ViewPager和Testview结合使用，点击切换和滑动切换

最新推荐文章于 2024-09-06 16:52:55 发布
最新推荐文章于 2024-09-06 16:52:55 发布
阅读量612 收藏 1
点赞数
分类专栏： 新技术
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zhangkaiyazky/article/details/81390829
版权

 

老规矩，第一先上图，这样是为了让大家能知道是不是想要的效果。

 

 

 

开始上代码了：

首先是Activity的xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">


    <RelativeLayout
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_gravity="center"
        android:layout_margin="@dimen/dp_16"
        android:background="@drawable/shape_director_total_earning_bg"
        android:gravity="center">

        <TextView
            android:id="@+id/tv_total_money_desc"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:text="累计收益"
            android:textColor="@color/white"
            android:textSize="@dimen/dimen_12sp" />

        <TextView
            android:id="@+id/tv_total_money"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_below="@id/tv_total_money_desc"
            android:layout_centerHorizontal="true"
            android:layout_marginTop="@dimen/dp_5"
            android:text="0元"
            android:textColor="@color/white"
            android:textSize="@dimen/dimen_24sp" />

    </RelativeLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <View style="@style/Line.Horizontal" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:background="@color/white"
            android:orientation="horizontal">

            <LinearLayout
                android:id="@+id/linear1"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:orientation="vertical"
                android:paddingBottom="@dimen/dimen_5dp"
                android:paddingTop="@dimen/dimen_5dp">

                <TextView
                    android:id="@+id/picture_text"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="@dimen/dimen_3dp"
                    android:layout_weight="1"
                    android:text="3元"
                    android:textColor="@color/tc_gray_3"
                    android:textSize="@dimen/dimen_16sp" />

                <TextView
                    android:id="@+id/picture_text1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="1"
                    android:text="赏金在路上"
                    android:textColor="@color/tc_gray_6"
                    android:textSize="@dimen/dimen_14sp" />

            </LinearLayout>

            <View
                android:layout_width="0.5dp"
                android:layout_height="match_parent"
                android:layout_alignParentRight="true"
                android:background="@color/tc_gray_9" />

            <LinearLayout
                android:id="@+id/linear2"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_gravity="center"
                android:layout_weight="1"
                android:orientation="vertical"
                android:paddingBottom="@dimen/dimen_5dp"
                android:paddingTop="@dimen/dimen_5dp"

                >

                <TextView
                    android:id="@+id/movie_text"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="@dimen/dimen_3dp"
                    android:layout_weight="1"
                    android:text="0元"
                    android:textColor="@color/tc_gray_3"
                    android:textSize="@dimen/dimen_16sp" />

                <TextView
                    android:id="@+id/movie_text1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="1"
                    android:text="已获得赏金"
                    android:textColor="@color/tc_gray_6"
                    android:textSize="@dimen/dimen_14sp" />
            </LinearLayout>

            <View
                android:layout_width="0.5dp"
                android:layout_height="match_parent"
                android:layout_alignParentRight="true"
                android:background="@color/tc_gray_9" />

            <LinearLayout
                android:id="@+id/linear3"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_gravity="center"
                android:layout_weight="1"
                android:orientation="vertical"
                android:paddingBottom="@dimen/dimen_5dp"
                android:paddingTop="@dimen/dimen_5dp">

                <TextView
                    android:id="@+id/music_text"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginTop="@dimen/dimen_3dp"
                    android:layout_weight="1"
                    android:text="3个"
                    android:textColor="@color/tc_gray_3"
                    android:textSize="@dimen/dimen_16sp" />

                <TextView
                    android:id="@+id/music_text1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_weight="1"
                    android:text="成功邀请"
                    android:textColor="@color/tc_gray_6"
                    android:textSize="@dimen/dimen_14sp" />

            </LinearLayout>


        </LinearLayout>

        <View style="@style/Line.Horizontal" />


        <android.support.v4.view.ViewPager
            android:id="@+id/vPager"
            android:layout_width="fill_parent"
            android:layout_height="0dp"
            android:layout_gravity="center"
            android:layout_weight="1.0"
            android:background="@color/white"
            android:flipInterval="30"
            android:persistentDrawingCache="animation" />

    </LinearLayout>

    <View style="@style/Line.Horizontal" />
</LinearLayout>

 

 

然后是Activity：

package com.dyh.drivingschool.ui.director;

import android.content.Context;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.view.ViewPager;
import android.view.View;
import android.widget.LinearLayout;
import android.widget.TextView;

import com.dyh.drivingschool.R;
import com.dyh.drivingschool.ui.director.adapter.MFragmentPagerAdapter;
import com.dyh.drivingschool.ui.director.fragment.ProfitRewardFragment;
import com.dyh.library.base.TitleFragmentActivity;

import java.util.ArrayList;

/**
 * Created by ljg on 2018/7/26.
 * 累计收益
 */

public class ProfitRewardActivity extends TitleFragmentActivity {

    //图片
    private TextView mTv_reward_road_money;
    //电影
    private TextView mTv_get_reward_money;
    //音乐
    private TextView mTv_number;
    //图片
    private TextView mTv_reward_road;
    //电影
    private TextView mTv_get_reward;
    //音乐
    private TextView mTv_success_invitation;

    private LinearLayout mLinear1;
    private LinearLayout mLinear2;
    private LinearLayout mLinear3;

    //实现Tab滑动效果
    private ViewPager mViewPager;

    //当前页卡编号
    private int currIndex = 0;

    //存放Fragment
    private ArrayList<Fragment> fragmentArrayList;

    //管理Fragment
    private FragmentManager fragmentManager;

    public Context context;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);

        addLayout(R.layout.activity_profit_reward);
        context = this;

        initView();


    }

    private void initView() {
        //初始化TextView
        InitTextView();

        //初始化Fragment
        InitFragment();

        //初始化ViewPager
        InitViewPager();

    }
//
//    @Override
//    public View onCreateView(String name, Context context, AttributeSet attrs) {
//
//        return super.onCreateView(name, context, attrs);
//    }
//
//    @Override
//    protected void onResume() {
//        /**
//         * 设置为竖屏
//         */
//        if(getRequestedOrientation()!= ActivityInfo.SCREEN_ORIENTATION_PORTRAIT){
//            setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);
//        }
//        super.onResume();
//    }

    /**
     * 初始化头标
     */
    private void InitTextView(){

        //金额
        mTv_reward_road_money = (TextView)findViewById(R.id.tv_reward_road_money);
        //赏金在路上
        mTv_reward_road = (TextView)findViewById(R.id.tv_reward_road);

        //金额
        mTv_get_reward_money = (TextView) findViewById(R.id.tv_get_reward_money);
        //已获得赏金
        mTv_get_reward = (TextView) findViewById(R.id.tv_get_reward);

        //几个
        mTv_number = (TextView)findViewById(R.id.tv_number);
        //成功邀请
        mTv_success_invitation = (TextView)findViewById(R.id.tv_success_invitation);


        mLinear1 = (LinearLayout)findViewById(R.id.linear1);
        mLinear2 = (LinearLayout)findViewById(R.id.linear2);
        mLinear3 = (LinearLayout)findViewById(R.id.linear3);

        //添加点击事件
        mLinear1.setOnClickListener(new MyOnClickListener(0));
        mLinear2.setOnClickListener(new MyOnClickListener(1));
        mLinear3.setOnClickListener(new MyOnClickListener(2));
    }

    /**
     * 初始化页卡内容区
     */
    private void InitViewPager() {

        mViewPager = (ViewPager) findViewById(R.id.vPager);
        mViewPager.setAdapter(new MFragmentPagerAdapter(fragmentManager, fragmentArrayList));

        //让ViewPager缓存2个页面
        mViewPager.setOffscreenPageLimit(2);

        //设置默认打开第一页
        mViewPager.setCurrentItem(0);

        //将顶部文字恢复默认值
        resetTextViewTextColor();
        mLinear1.setBackgroundResource(R.color.app_title_brown);
        mTv_reward_road_money.setTextColor(getResources().getColor(R.color.white));
        mTv_reward_road.setTextColor(getResources().getColor(R.color.white));

        //设置viewpager页面滑动监听事件
        mViewPager.setOnPageChangeListener(new MyOnPageChangeListener());
    }

    /**
     * 初始化Fragment，并添加到ArrayList中
     */
    private void InitFragment(){
        fragmentArrayList = new ArrayList<Fragment>();
        fragmentArrayList.add(new ProfitRewardFragment());
        fragmentArrayList.add(new ProfitRewardFragment());
        fragmentArrayList.add(new ProfitRewardFragment());
        fragmentManager = getSupportFragmentManager();

    }

    /**
     * 头标点击监听
     * @author weizhi
     * @version 1.0
     */
    public class MyOnClickListener implements View.OnClickListener{
        private int index = 0 ;
        public MyOnClickListener(int i) {
            index = i;
        }

        @Override
        public void onClick(View v) {
            mViewPager.setCurrentItem(index);
        }
    }

    /**
     * 页卡切换监听
     * @author weizhi
     * @version 1.0
     */
    public class MyOnPageChangeListener implements ViewPager.OnPageChangeListener{

        @Override
        public void onPageSelected(int position) {
//
            switch (position){

                //当前为页卡1
                case 0:
                    //从页卡1跳转转到页卡2
                    if(currIndex == 1){
                        resetTextViewTextColor();
                        mTv_reward_road_money.setTextColor(getResources().getColor(R.color.white));
                        mTv_reward_road.setTextColor(getResources().getColor(R.color.white));
                        mLinear1.setBackgroundResource(R.color.app_title_brown);
                        mLinear2.setBackgroundResource(R.color.white);
                        mLinear3.setBackgroundResource(R.color.white);
                    }else if(currIndex == 2){//从页卡1跳转转到页卡3
                        resetTextViewTextColor();
                        mTv_reward_road_money.setTextColor(getResources().getColor(R.color.white));
                        mTv_reward_road.setTextColor(getResources().getColor(R.color.white));
                        mLinear1.setBackgroundResource(R.color.app_title_brown);
                        mLinear2.setBackgroundResource(R.color.white);
                        mLinear3.setBackgroundResource(R.color.white);
                    }
                    break;

                //当前为页卡2
                case 1:
                    //从页卡1跳转转到页卡2
                    if (currIndex == 0) {
                        resetTextViewTextColor();
                        mTv_get_reward_money.setTextColor(getResources().getColor(R.color.white));
                        mTv_get_reward.setTextColor(getResources().getColor(R.color.white));
                        mLinear2.setBackgroundResource(R.color.app_title_brown);
                        mLinear1.setBackgroundResource(R.color.white);
                        mLinear3.setBackgroundResource(R.color.white);
                    } else if (currIndex == 2) { //从页卡1跳转转到页卡2
                        resetTextViewTextColor();
                        mTv_get_reward_money.setTextColor(getResources().getColor(R.color.white));
                        mTv_get_reward.setTextColor(getResources().getColor(R.color.white));
                        mLinear2.setBackgroundResource(R.color.app_title_brown);
                        mLinear1.setBackgroundResource(R.color.white);
                        mLinear3.setBackgroundResource(R.color.white);
                    }
                    break;

                //当前为页卡3
                case 2:

                    //从页卡1跳转转到页卡2
                    if (currIndex == 0) {
                        resetTextViewTextColor();
                        mTv_success_invitation.setTextColor(getResources().getColor(R.color.white));
                        mTv_number.setTextColor(getResources().getColor(R.color.white));
                        mLinear3.setBackgroundResource(R.color.app_title_brown);
                        mLinear2.setBackgroundResource(R.color.white);
                        mLinear1.setBackgroundResource(R.color.white);
                    } else if (currIndex == 1) {//从页卡1跳转转到页卡2
                        resetTextViewTextColor();
                        mTv_success_invitation.setTextColor(getResources().getColor(R.color.white));
                        mTv_number.setTextColor(getResources().getColor(R.color .white));
                        mLinear3.setBackgroundResource(R.color.app_title_brown);
                        mLinear2.setBackgroundResource(R.color.white);
                        mLinear1.setBackgroundResource(R.color.white);
                    }
                    break;
            }
            currIndex = position;
        }

        @Override
        public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

        }

        @Override
        public void onPageScrollStateChanged(int state) {

        }
    };


    /**
     * 将顶部文字恢复默认值
     */
    private void resetTextViewTextColor(){

        mTv_reward_road_money.setTextColor(getResources().getColor(R.color.tc_gray_3));
        mTv_reward_road.setTextColor(getResources().getColor(R.color.tc_gray_3));
        mTv_get_reward.setTextColor(getResources().getColor(R.color.tc_gray_3));
        mTv_get_reward_money.setTextColor(getResources().getColor(R.color.tc_gray_3));
        mTv_number.setTextColor(getResources().getColor(R.color.tc_gray_3));
        mTv_success_invitation.setTextColor(getResources().getColor(R.color.tc_gray_3));
    }

    @Override
    protected void initTitileBar() {
        titleLayout.showCenterLeftIconView("累计收益");
    }
}

最后是 FragmentPagerAdapter：

package com.dyh.drivingschool.ui.director.adapter;

import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.view.ViewGroup;

import java.util.ArrayList;

/**
 * Fragment适配器
 * @author weizhi
 * @version 1.0
 * Created by ljg on 2018/8/3.
 */
public class MFragmentPagerAdapter extends FragmentPagerAdapter {

    //存放Fragment的数组
    private ArrayList<Fragment> fragmentsList;

    public MFragmentPagerAdapter(FragmentManager fm, ArrayList<Fragment> fragmentsList) {
        super(fm);
        this.fragmentsList = fragmentsList;
    }

    @Override
    public Fragment getItem(int position) {

        return fragmentsList.get(position);
    }

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

    @Override
    public void destroyItem(ViewGroup container, int position, Object object) {
        super.destroyItem(container, position, object);
    }
}

 

最后是几个颜色值：

<color name="tc_gray_3">#333333</color>
<color name="white">#FFFFFF</color>
<color name="dividerColor">#cfcfcf</color>
<dimen name="dividerWidth">0.5dp</dimen>

横线：

<style name="Line.Horizontal" parent="@style/EmptyWidget">
  <item name="android:layout_width">match_parent</item>
  <item name="android:layout_height">@dimen/dividerWidth</item>
  <item name="android:background">@color/dividerColor</item>
</style>

 

shape文件：一个圆
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">

    <solid android:color="#C6A36B"/>

</shape>

以上就是全部代码

 

 

 

 

 

@删库跑路
关注
专栏目录
viewpager 点击小圆点切换页面
03-22
这是一个Viewpager的一个Demo，实现了点击校园点切换页面的效果
Fragment+ViewPager实现仿微信点击和滑动切换界面
longduyuan的博客
12-18 481
这是在我写的新闻App中实现的界面切换 贴出切换界面的主要代码： xml代码： &lt;span style="font-size:14px;"&gt; &lt;android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="wrap_con...
【Android】ViewPager基本用法总结
最新发布
Patrick_yuxuan的博客
09-06 1872
ViewPager是 Android 中一个用于在同一屏幕上滑动不同页面（通常是左右滑动）的组件。它通常用于实现多页面滑动效果，比如应用的引导页、图片轮播、以及支持标签导航的界面。ViewPager与结合使用。是一个适配器，它负责为ViewPager提供页面内容。每个页面通常是一个Fragment，也可以是一个普通的View。
ViewPager多页面滑动切换以及动画效果 (转载)
weixin_30678821的博客
07-03 216
http://www.eoeandroid.com/thread-157771-1-1.html、http://www.eoeandroid.com/forum.php?mod=viewthread&tid=164918&page=1 一、首先，我们来看一下效果图，这是新浪微博的Tab滑动效果。我们可以手势滑动，也可以点击上面的头标进行切换。与此同方式，白色横条会移动到相应的页卡...
ViewPager滑动和点击切换内容
Angus博客
07-06 2115
界面设计很简单，第一行三个头标，第二行动画图片，第三行页卡内容展示。 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27
android_ViewPager:实现页面滑动的切换和点击切换
06-09
android_ViewPager 实现页面滑动的切换和点击切换。
使用ViewPager+Fragment实现页面点击切换和手势滑动
03-08
本篇文章将详细讲解如何利用这两个组件实现页面的点击切换和手势滑动，以及如何添加动画效果，使得用户体验更加流畅。 **ViewPager组件** ViewPager是一个可以展示多个视图并支持用户进行左右滑动切换的容器。它...
Android使用TabLayou+fragment+viewpager实现滑动切换页面效果
08-30
要实现滑动切换页面效果，我们需要将 TabLayout、ViewPager 和 Fragment 配合使用。首先，我们需要在 Activity 中获取 TabLayout 和 ViewPager 控件，然后设置 TabLayout 的标题和 ViewPager 的适配器。例如： ```...
viewpager左右滑动+图片点击切换
01-10
综上所述，实现“viewpager左右滑动+图片点击切换”的功能，主要涉及`ViewPager`的使用、`PagerAdapter`的定制以及添加点击事件监听。这不仅使用户能够通过滑动手势浏览多张图片，还允许他们点击图片进行切换，增强...
既可以滑动也可以点击切换（ViewPager跟Fragment）
azhansy
08-10 834
整体布局思路如图： 1、首先创建一个Activity并且继承FragmentActivity，布局文件中留下一个Framelayout 初始化事务，添加Fragment，提交事务 MainActivity: package com.zhansy.mytext; import android.os.Bundle; import android.support.v4.app.
ActionBar的tab + ViewPager 同时支持点击切换和滑动切换页面
03-27
ActionBar.Tab 与 ViewPager关联使用，支持点击tab切换页面和滑动切换页面。
Android点击左右按钮实现左右滑动页面切换
04-08
NULL 博文链接：https://topmanopensource.iteye.com/blog/1594858
ViewPagerTest
10-18
自己做的一个小Demo
viewpage实现页面切换和点击事件.zip
08-16
android viewpage实现页面切换底部tab菜单和点击事件
ViewPager 滑动速度设置，并实现点击按钮滑动！
05-04
ViewPager 滑动速度设置，并实现点击按钮滑动！
通过点击按钮实现ViewPager的切换
热门推荐
hi_0123的专栏
10-10 1万+
这里我们实现的是通过点击按钮来切换ViewPager，就是在ViewPager的底端我们定义一个 LinearLayout布局，在其中放置4个ImageView控件，我们可以通过点击不同的控件来切换ViewPager并改变 ImageView的状态。所以这里我们需要用到选择器。 首先在res文件夹下新建一个drawable文件夹，并在其中新建一个Selector类型的dot.xml文件：
ViewPager+Button 实现左右滑动和点击切换按钮
weixin_40715900的博客
10-18 4260
1 ViewPager+Button 实现左右滑动和点击切换按钮 布局 一个viewpager 和 3个按钮 &lt;LinearLayout android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_paren...
android viewpager button,ViewPager+Button 实现左右滑动和点击切换按钮
weixin_34061241的博客
05-27 494
1ViewPager+Button 实现左右滑动和点击切换按钮布局一个viewpager 和 3个按钮android:orientation="vertical"android:layout_width="match_parent"android:layout_height="match_parent">android:id="@+id/vp"android:layout_width="ma...
Fragement和ViewPager结合使用可以实现滑动切换的效果。
06-11
是的，`Fragment` 和 `ViewPager` 结合使用可以实现滑动切换的效果。通过在 `ViewPager` 中添加多个 `Fragment`，可以实现左右滑动切换不同的页面。需要注意的是，在使用 `ViewPager` 时，需要自定义一个 `...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

@删库跑路

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值