android使用viewpager计算偏移量实现选项卡功能
程序员文章站
2022-08-20 16:58:47
本文实例为大家分享了android实现选项卡功能,通过计算偏移量,设置tetxview和imageview的对应值,一些color的值读者自己去补充
实现效果图:...
本文实例为大家分享了android实现选项卡功能,通过计算偏移量,设置tetxview和imageview的对应值,一些color的值读者自己去补充
实现效果图:
(1)简单写一个主界面的布局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="match_parent" android:layout_height="match_parent" android:cliptopadding="true" android:fitssystemwindows="true" android:background="@color/bg_color"> <linearlayout android:layout_width="match_parent" android:layout_height="match_parent" android:background="@color/bag_gray" android:orientation="vertical"> <linearlayout android:layout_width="match_parent" android:layout_height="36dp" android:background="@android:color/white" android:orientation="horizontal" android:weightsum="3"> <textview android:id="@+id/tab1_tv" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_weight="1" android:gravity="center" android:text="商品" android:textcolor="@color/title_bag" android:textsize="18sp" /> <textview android:id="@+id/tab2_tv" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_weight="1" android:gravity="center" android:text="评价" android:textcolor="@color/text_color_context" android:textsize="18sp" /> <textview android:id="@+id/tab3_tv" android:layout_width="0dp" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_weight="1" android:gravity="center" android:text="详情" android:textcolor="@color/text_color_context" android:textsize="18sp" /> </linearlayout> <view android:layout_width="match_parent" android:layout_height="0.5dp" android:background="@color/text_color_context" /> <view android:id="@+id/cursor" android:layout_width="50dp" android:layout_height="2dp" android:layout_marginleft="40dp" android:layout_margintop="0dip" android:background="@color/title_bag" /> <android.support.v4.view.viewpager android:id="@+id/thire_vp" android:layout_width="match_parent" android:layout_height="match_parent"/> </linearlayout> </linearlayout>
(2)设置viewpager的适配器:fragmentadapter
public class fragmentadapter extends fragmentpageradapter { private arraylist<fragment> list; fragmentmanager fm; public fragmentadapter(fragmentmanager fm, arraylist<fragment> list){ super(fm); this.fm = fm; this.list = list; } @override public fragment getitem(int position) { return list.get(position); } @override public int getcount() { return list.size(); } }
(3)然后设置三个fragment,因为有三个选项卡,所以我们新建三个fragment,分别是onefragment、twofragment 、threefragment ,布局的话也需要新建三个,跟fragment一一对应,因为布局过于简单,这里就不写了,简单写一点fragment的代码吧
public class onefragment extends fragment { @nullable @override public view oncreateview(layoutinflater inflater, @nullable viewgroup container, @nullable bundle savedinstancestate) { view view = inflater.inflate(r.layout.fragment_one,null); return view; } }
(4)在mainactivity中,设置fragment的适配器,设置显示内容,并且做viewpager的事件监听
public class mainactivity extends fragmentactivity implements viewpager.onpagechangelistener,view.onclicklistener{ private textview tab1tv; private textview tab2tv; private textview tab3tv; private view cursor; private viewpager thirdvp; private arraylist<fragment> fragmentlist; private int offset = 0; private int screenwidth = 0; private int screenl_3; private linearlayout.layoutparams lp; @override protected void oncreate(@nullable bundle savedinstancestate) { super.oncreate(savedinstancestate); setcontentview(r.layout.activity_product); //绑定控件 tab1tv = (textview)findviewbyid(r.id.tab1_tv); tab2tv = (textview)findviewbyid(r.id.tab2_tv); tab3tv = (textview)findviewbyid(r.id.tab3_tv); cursor = (view) findviewbyid(r.id.cursor); thirdvp = (viewpager) findviewbyid(r.id.thire_vp); //获取屏幕宽度 displaymetrics dm = new displaymetrics(); getwindowmanager().getdefaultdisplay().getmetrics(dm); screenwidth = dm.widthpixels; screenl_3 = screenwidth/3; //裁剪3分之1 lp = (linearlayout.layoutparams)cursor.getlayoutparams(); fragmentlist = new arraylist<>(); fragmentlist.add(new onefragment()); fragmentlist.add(new twofragment()); fragmentlist.add(new threefragment()); thirdvp.setadapter(new fragmentadapter(getsupportfragmentmanager(),fragmentlist)); thirdvp.setcurrentitem(0); thirdvp.setoffscreenpagelimit(2); thirdvp.setonpagechangelistener(this); tab1tv.setonclicklistener(this); tab2tv.setonclicklistener(this); tab3tv.setonclicklistener(this); } @override public void onpagescrolled(int position, float positionoffset, int positionoffsetpixels) { offset = (screenl_3-cursor.getlayoutparams().width)/2; log.d("tag", "111----"+position + "--" + positionoffset + "--" + positionoffsetpixels); final float scale = getresources().getdisplaymetrics().density; if (position == 0){ lp.leftmargin = (int)(positionoffsetpixels/3)+offset; }else if(position ==1){ lp.leftmargin = (int)(positionoffsetpixels/3)+screenl_3+offset; } cursor.setlayoutparams(lp); uptextcolor(position); } private void uptextcolor(int position){ if (position==0){ tab1tv.settextcolor(getresources().getcolor(r.color.title_bag)); tab2tv.settextcolor(getresources().getcolor(r.color.text_color_context)); tab3tv.settextcolor(getresources().getcolor(r.color.text_color_context)); }else if(position==1){ tab1tv.settextcolor(getresources().getcolor(r.color.text_color_context)); tab2tv.settextcolor(getresources().getcolor(r.color.title_bag)); tab3tv.settextcolor(getresources().getcolor(r.color.text_color_context)); }else if(position==2){ tab1tv.settextcolor(getresources().getcolor(r.color.text_color_context)); tab2tv.settextcolor(getresources().getcolor(r.color.text_color_context)); tab3tv.settextcolor(getresources().getcolor(r.color.title_bag)); } } @override public void onpageselected(int position) { } @override public void onpagescrollstatechanged(int state) { } @override public void onclick(view view) { switch (view.getid()) { case r.id.tab1_tv: thirdvp.setcurrentitem(0); break; case r.id.tab2_tv: thirdvp.setcurrentitem(1); break; case r.id.tab3_tv: thirdvp.setcurrentitem(2); break; } } }
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
上一篇: 旅游途中如何保持健康
下一篇: Android编译的注意事项