Android开发——实现TabHost 随手滑动切换选项卡功能(绝对实用)
以前用TabHost只是点击导航栏选项卡才进行切换,今天试了下手势滑动进行切换,搜了好多资料感觉特别乱,花了好长时间整理了一下终于有效果了,自己写了一个Demo。
程序清单1:布局文件
说明:和我们写Tabhost布局文件一样
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TabHost
android:id="@android:id/tabhost" android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout android:orientation="vertical"
android:layout_width="fill_parent" android:layout_height="fill_parent">
<TabWidget android:id="@android:id/tabs"
android:layout_width="fill_parent" android:layout_height="wrap_content" />
<FrameLayout android:id="@android:id/tabcontent"
android:layout_width="fill_parent" android:layout_height="fill_parent" >
<LinearLayout
android:focusable="true"
android:focusableInTouchMode="true"
android:id="@+id/tab01"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="你好"
android:textSize="20sp"/>
<ListView
android:id="@+id/listview"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:dividerHeight="10dp"
android:divider="#D1D1D1"
>
</ListView>
</LinearLayout>
<LinearLayout
android:id="@+id/tab02"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="你好"
android:textSize="20sp"/>
<ListView
android:id="@+id/listview1"
android:layout_width="match_parent"
android:layout_height="match_parent">
</ListView>
</LinearLayout>
<LinearLayout
android:id="@+id/tab03"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:text="你好"
android:textSize="20sp"/>
<ListView
android:id="@+id/listview2"
android:layout_width="match_parent"
android:layout_height="360dp"
>
</ListView>
</LinearLayout>
</FrameLayout>
</LinearLayout>
</TabHost>
</LinearLayout>
程序清单2:
MainActivity.java
public class MainActivity extends TabActivity {
private static final int SWIPE_MIN_DISTANCE = 120;
private static final int SWIPE_MAX_OFF_PATH = 250;
private static final int SWIPE_THRESHOLD_VELOCITY = 200;
private GestureDetector gestureDetector;
View.OnTouchListener gestureListener;
private Animation slideLeftIn;
private Animation slideLeftOut;
private Animation slideRightIn;
private Animation slideRightOut;
private ViewFlipper viewFlipper;
int currentView = 0;
private static int maxTabIndex = 2;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TabHost tabHost = getTabHost();
tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("tab1 ")
.setContent(R.id.tab01));
tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("tab2 ")
.setContent(R.id.tab02));
tabHost.addTab(tabHost.newTabSpec("tab3").setIndicator("tab3 ")
.setContent(R.id.tab03));
tabHost.setCurrentTab(0);
slideLeftIn = AnimationUtils.loadAnimation(this, R.anim.slide_left_in);
slideLeftOut = AnimationUtils
.loadAnimation(this, R.anim.slide_left_out);
slideRightIn = AnimationUtils
.loadAnimation(this, R.anim.slide_right_in);
slideRightOut = AnimationUtils.loadAnimation(this,
R.anim.slide_right_out);
gestureDetector = new GestureDetector(new MyGestureDetector());
gestureListener = new View.OnTouchListener() {
public boolean onTouch(View v, MotionEvent event) {
if (gestureDetector.onTouchEvent(event)) {
return true;
}
return false;
}
};
}
class MyGestureDetector extends GestureDetector.SimpleOnGestureListener {
@Override
public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
float velocityY) {
TabHost tabHost = getTabHost();
try {
if (Math.abs(e1.getY() - e2.getY()) > SWIPE_MAX_OFF_PATH)
return false;
if (e1.getX() - e2.getX() > SWIPE_MIN_DISTANCE
&& Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {
Log.i("test ", "right");
if (currentView == maxTabIndex) {
currentView = 0;
} else {
currentView++;
}
tabHost.setCurrentTab(currentView);
} else if (e2.getX() - e1.getX() > SWIPE_MIN_DISTANCE
&& Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) {
Log.i("test ", "left");
if (currentView == 0) {
currentView = maxTabIndex;
} else {
currentView--;
}
tabHost.setCurrentTab(currentView);
}
} catch (Exception e) {
// nothing
}
return false;
}
}
//@Override
//public boolean onTouchEvent(MotionEvent event) {
//if (gestureDetector.onTouchEvent(event))
//return true;
//else
//return false;
//}
@Override
public boolean dispatchTouchEvent(MotionEvent event) {
if(gestureDetector.onTouchEvent(event)){
event.setAction(MotionEvent.ACTION_CANCEL);
}
return super.dispatchTouchEvent(event);
}
}
当然这里会用到关于滑动的四个xml文件 我们将它们存在 res\anim中 (anim文件要自己新建)
1、 slide_left_in
2、slide_lefe_out
3、slide_right_in
4、slide_right_out
1、 slide_left_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="500"
android:fromXDelta="100%p"
android:toXDelta="0" />
<alpha
android:duration="500"
android:fromAlpha="0.0"
android:toAlpha="1.0" />
</set>
2、slide_lefe_out.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="500"
android:fromXDelta="0"
android:toXDelta="-100%p" />
<alpha
android:duration="500"
android:fromAlpha="1.0"
android:toAlpha="0.0" />
</set>
3、slide_right_in.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="500"
android:fromXDelta="-100%p"
android:toXDelta="0" />
<alpha
android:duration="500"
android:fromAlpha="0.0"
android:toAlpha="1.0" />
</set>
4、slide_right_out.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android" >
<translate
android:duration="1500"
android:fromXDelta="0"
android:toXDelta="100%p" />
<alpha
android:duration="1500"
android:fromAlpha="1.0"
android:toAlpha="0.1" />
</set>
好了现在就完成了。来几张效果图:
本文出自 “我的博客” 博客,请务必保留此出处http://huolailai.blog.51cto.com/9946966/1656387
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。