由于项目需要,要做一个滑动改变选项内容效果的类似iOS的按钮,不由想起TextSwitcher,今天看了http://blog.youkuaiyun.com/tianjf0514/article/details/7556487的Demo,感觉不是很完美,故做了一些修改以更好实现效果。
首先是布局文件:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<TextSwitcher
android:id="@+id/textSwicher"
android:layout_width="200px"
android:layout_height="wrap_content"
android:background="@android:color/black"
android:gravity="center" >
</TextSwitcher>
</LinearLayout>
主Activity文件:
package org.crazyit.ui;
import android.app.Activity;
import android.graphics.Color;
import android.os.Bundle;
import android.view.Gravity;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.view.ViewGroup.LayoutParams;
import android.view.animation.AnimationUtils;
import android.widget.TextSwitcher;
import android.widget.TextView;
import android.widget.ViewSwitcher;
import android.widget.ViewSwitcher.ViewFactory;
public class TextSwitcherTest extends Activity {
private TextSwitcher textSwicher;
// 图片数组
private String[] arrayTexts = { "文本01", "文本02", "文本03", "文本04" };
// 要显示的图片在图片数组中的Index
private int textIndex=0;;
// 左右滑动时手指按下的X坐标
private float touchDownX;
// 左右滑动时手指松开的X坐标
private float touchUpX;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
textSwicher = (TextSwitcher) findViewById(R.id.textSwicher);
// 为TextSwitcher设置Factory,用来为TextSwitcher制造TextView
textSwicher.setFactory(new ViewSwitcher.ViewFactory()
{
public View makeView()
{
TextView tv = new TextView(TextSwitcherTest.this);
tv.setTextSize(40);
tv.setTextColor(Color.WHITE);
return tv;
}
});
textSwicher.setText(arrayTexts[0]);
// 设置TextSwitcher左右滑动监听事件
textSwicher.setOnTouchListener(new TextSwicherOnTouchListener());
}
//开始按钮监听
private final class TextSwicherOnTouchListener implements OnTouchListener{
public boolean onTouch(View v, MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_DOWN) {
// 取得左右滑动时手指按下的X坐标
touchDownX = event.getX();
return true;
} else if (event.getAction() == MotionEvent.ACTION_UP) {
// 取得左右滑动时手指松开的X坐标
touchUpX = event.getX();
// 从左往右,看前一文本
if (touchUpX - touchDownX > 50) {
// 设置文本切换的动画
textSwicher.setOutAnimation(AnimationUtils.loadAnimation(TextSwitcherTest.this,
android.R.anim.slide_out_right));
// 设置当前要看的文本
textSwicher.setText(arrayTexts[textIndex=textIndex==0?(arrayTexts.length-1):--textIndex]);
textSwicher.setInAnimation(AnimationUtils.loadAnimation(TextSwitcherTest.this,
android.R.anim.slide_in_left));
// 从右往左,看下一张
}else if(touchDownX - touchUpX > 50) {
// 设置文本切换的动画
// 由于Android没有提供slide_out_left和slide_in_right,所以仿照slide_in_left和slide_out_right编写了slide_out_left和slide_in_right
textSwicher.setOutAnimation(AnimationUtils.loadAnimation(TextSwitcherTest.this,
R.anim.slide_out_left));
// 设置当前要看的文本
textSwicher.setText(arrayTexts[textIndex=textIndex==(arrayTexts.length-1)?0:++textIndex]);
textSwicher.setInAnimation(AnimationUtils.loadAnimation(TextSwitcherTest.this,R.anim.slide_in_right));
}
return true;
}
return false;
}
}
}
两个动画文件(完全参考上面链接的那个动画):
1.slide_out_left:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="0" android:toXDelta="-50%p" android:duration="300"/>
<alpha android:fromAlpha="1.0" android:toAlpha="0.0" android:duration="300" />
</set>
2.slide_in_right:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="50%p" android:toXDelta="0" android:duration="300"/>
<alpha android:fromAlpha="0.0" android:toAlpha="1.0" android:duration="300" />
</set>
效果图就不贴了,很简单的.