android使用viewpager计算偏移量实现选项卡功能
作者:cf8833 发布时间:2023-12-06 12:53:02
标签:android,viewpager,选项卡
本文实例为大家分享了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;
}
}
}
来源:https://blog.csdn.net/cf8833/article/details/79898366
0
投稿
猜你喜欢
- Eclipse提供了一个可扩展插件的开发系统。这就使得Eclipse在运行系统之上可以实现各种功能。这些插件也不同于其他的应用(插件的功能是
- 前言:mongodb是一个基于分布式文件存储的开源数据库系统。mongodb与我们平常使用的mysql的区别: 1.
- 循环依赖所谓循环依赖就是多个Bean之间依赖关系形成一个闭环,例如A->B->C->...->A 这种情况,当然,最
- 经典排序算法 - 冒泡排序Bubble sort原理是临近的数字两两进行比较,按照从小到大或者从大到小的顺序进行交换,这样一趟过去后,最大或
- 朋友让我帮忙写个程序从文本文档中导入数据到oracle数据库中,技术上没有什么难度,文档的格式都是固定的只要对应数据库中的字段解析就行了,关
- 从大学就开始做C#这块,也做C#几年了,最近又从ios转回.Net,继续做C#,之前也没有写博客的习惯,写博客也是从我做ios的时候开始的,
- 值类型和引用类型作为两个非常基础而且很重要的概念,一般我们都是在最开始的时候学的,你听到的可能是这样的:值类型传递的是具体的值(副本),引用
- 做Android开发的程序员必须知道android客户端应该如何与服务端进行交互,这里主要介绍的是使用json数据进行交互。服务端从数据库查
- 包的作用,1是为了防止类和方法的重名,2是为了管理众多的java类。步骤 1 工具包里面有很多个工具类之前讲了打印数据的方法:S
- 本篇文章介绍:如何使用Toolbar;自定义Toolbar;先来看一看效果,了解一下toolbar;布局文件:<android.sup
- 本文实例讲述了C#实现TCP连接信息统计的方法。分享给大家供大家参考。具体实现方法如下:using System;using System.
- 1集合的概念把集合看做是一个容器,集合不是一个类,是一套集合框架,框架体系包含很多的集合类,java api提供了集合存储任意类型(基本包装
- 本文实例讲述了Java字符流与字节流区别与用法。分享给大家供大家参考,具体如下:字节流与字符流主要的区别是他们的的处理方式流分类:1.Jav
- 线程线程:对于所有需要等待的操作,例如移动文件,数据库和网络访问都需要一定的时间,此时就可以启动一个新的线程,同时完成其他任务。一个进程的多
- 效果展示前面的导入过程这里就不多说了,不会的可以自己去问度娘。导入后,选择Spider.java类直接运行就可以了,下面是游戏运行的截图:游
- java在jdk1.5中引入了注解,spring框架也正好把java注解发挥得淋漓尽致。下面会讲解Spring中自定义注解的简单流程,其中会
- 1.介绍在SpringBoot的Web项目中,默认采用的是内置Tomcat,当然也可以配置支持内置的jetty,内置有什么好处呢? 1. 方
- 本文实例为大家分享了Java实现医院管理系统的具体代码,供大家参考,具体内容如下1.开发工具NetBeans8.2Mysql5.7mysql
- @CompentScan excludeFilters配置无效@CompentScan 注解配置需要扫描的包excludeFilters 是
- 前言本文主要给大家介绍了如何更改Dialog的标题与按钮颜色的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧。an