Android中ViewPager常用功能3----仿微信既能点击又能滑动的选项卡

最新推荐文章于 2023-02-03 15:06:50 发布

zhaihaohao1

最新推荐文章于 2023-02-03 15:06:50 发布

阅读量664

点赞数

分类专栏： ViewPager fragment

本文链接：https://blog.csdn.net/zhaihaohao1/article/details/76142314

版权

ViewPager 同时被 2 个专栏收录

22 篇文章 0 订阅

订阅专栏

fragment

15 篇文章 0 订阅

订阅专栏

效果图：

MainActivity中

package com.example.viewpagertest4;

import android.app.Activity;
import android.graphics.Color;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.List;

/**
 * viewPager结合Fragment
 * 实现既能点击又能滑动的选项卡，仿微信
 * 这里要继承的FragmentActivity
 */
public class MainActivity extends FragmentActivity {
//  viewPager
    private ViewPager viewPager;
    private TextView tvPage1;
    private TextView tvPage2;
    private TextView tvPage3;
    private TextView tvPage4;
//  存放下面4个textView的list
    private List<TextView>tvList;
//  存放fragment的list
    private List<Fragment>fragmentList;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        initView();
        myOnclick();
    }
    private void initView(){
        tvPage1 = (TextView)findViewById(R.id.tvPage1);
        tvPage2 = (TextView)findViewById(R.id.tvPage2);
        tvPage3 = (TextView)findViewById(R.id.tvPage3);
        tvPage4 = (TextView)findViewById(R.id.tvPage4);
        tvList=new ArrayList<>();
        tvList.add(tvPage1);
        tvList.add(tvPage2);
        tvList.add(tvPage3);
        tvList.add(tvPage4);
        fragmentList=new ArrayList<>();
        Fragment01 fragment01=new Fragment01();
        Fragment02 fragment02=new Fragment02();
        Fragment03 fragment03=new Fragment03();
        Fragment04 fragment04=new Fragment04();
        fragmentList.add(fragment01);
        fragmentList.add(fragment02);
        fragmentList.add(fragment03);
        fragmentList.add(fragment04);
//      初始化viewPager
        viewPager = (ViewPager)findViewById(R.id.viewPager);
//      绑定适配器
        MyPagerAdapter myPagerAdapter =new MyPagerAdapter(getSupportFragmentManager(),  fragmentList);
        viewPager.setAdapter(myPagerAdapter);

    }
    private void myOnclick() {
//      监听事件
        viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            //          这个方法会在屏幕滚动过程中不断被调用。
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

            }
            // 当前选择的页面
            @Override
            public void onPageSelected(int position) {
                switch (position) {
                    case  0:
                        for (TextView textView  : tvList) {
                            textView.setTextColor(Color.parseColor("#CCCCCC"));
                        }
                        tvPage1.setTextColor(Color.parseColor("#FF3399"));
                        break;
                    case  1:
                        for (TextView textView  : tvList) {
                            textView.setTextColor(Color.parseColor("#CCCCCC"));
                        }
                        tvPage2.setTextColor(Color.parseColor("#FF3399"));
                        break;
                    case  2:
                        for (TextView textView  : tvList) {
                            textView.setTextColor(Color.parseColor("#CCCCCC"));
                        }
                        tvPage3.setTextColor(Color.parseColor("#FF3399"));
                        break;
                    case  3:
                        for (TextView textView  : tvList) {
                            textView.setTextColor(Color.parseColor("#CCCCCC"));
                        }
                        tvPage4.setTextColor(Color.parseColor("#FF3399"));
                        break;
                }

            }
            //          这个方法在手指操作屏幕的时候发生变化。有三个值：0（END）,1(PRESS) , 2(UP) 。
            @Override
            public void onPageScrollStateChanged(int state) {

            }
        });
//      page1点击事件
        tvPage1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
//              滑到第一页
                viewPager.setCurrentItem(0);
            }
        });
//      page2点击事件
        tvPage2.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
//              滑到第二页
                viewPager.setCurrentItem(1);
            }
        });
//      tvPage3点击事件
        tvPage3.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
//              滑到第三页
                viewPager.setCurrentItem(2);
            }
        });
//      tvPage4点击事件
        tvPage4.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
//              滑到第四页
                viewPager.setCurrentItem(3);
            }
        });

    }
// 绑定Fragment的适配器
    class MyPagerAdapter extends FragmentPagerAdapter {

        private List<Fragment> fragments;

        public MyPagerAdapter(FragmentManager fm, List<Fragment> fragments) {
            super(fm);
            this.fragments = fragments;
        }

        @Override
        public Fragment getItem(int i) {
            return fragments.get(i);
        }

        @Override
        public int getCount() {
            return fragments.size();
        }

    }
}
activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.viewpagertest4.MainActivity">
    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="#FF66FF"
        android:layout_marginBottom="50dp"
        >
    </android.support.v4.view.ViewPager>
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:orientation="horizontal"
        android:layout_alignParentBottom="true"
        >
        <TextView
            android:id="@+id/tvPage1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:text="page1"
            android:textSize="16sp"
            android:gravity="center"
            android:textColor="#FF3399"
            />
        <TextView
            android:id="@+id/tvPage2"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:text="page2"
            android:textSize="16sp"
            android:gravity="center"
            />
        <TextView
            android:id="@+id/tvPage3"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:text="page3"
            android:textSize="16sp"
            android:gravity="center"
            />
        <TextView
            android:id="@+id/tvPage4"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:text="page4"
            android:textSize="16sp"
            android:gravity="center"
            />

    </LinearLayout>

</RelativeLayout>
创建4个fragment,这里这些一个

Fragment01
package com.example.viewpagertest4;


import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;


/**
 * A simple {@link Fragment} subclass.
 */
public class Fragment01 extends Fragment {


    public Fragment01() {
        // Required empty public constructor
    }


    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_fragment01, container, false);
    }

}
fragment_fragment01.xml

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.viewpagertest4.Fragment01">

    <!-- TODO: Update blank fragment layout -->
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="第一页" />

</FrameLayout>
源码下载

ViewPadeDemo----viewpagertest4

http://download.csdn.net/detail/zhaihaohao1/9911113

zhaihaohao1

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
Android中ViewPager常用功能3----仿微信既能点击又能滑动的选项卡

效果图：MainActivity中package com.example.viewpagertest4;import android.app.Activity;import android.graphics.Color;import android.support.v4.app.Fragment;import android.support.v4.app.Fragme
复制链接

扫一扫