Android ViewPager与radiogroup实现关联

Android ViewPager与radiogroup实现关联
效果图展示
Android ViewPager与radiogroup实现关联_第1张图片
Android ViewPager与radiogroup实现关联步骤
1.实例化ViewPager
2.通过LayoutInflater加载布局,返回View结果
3.把生成的每一个View对象添加到List集合中
4.实例化适配器,传递View集合
5.在适配器中继承自PagerAdapter,实现内部的四个方法
getCount(); 返回视图的数量
isViewFromObject(); 是否通过对象加载视图 View==object
instantiateltem(); 加载当前页面
(通过container.addView();添加视图)
返回个给用户
destroyItem(); 销毁滑出的视图
(通过container.removerView();销毁视图)
6.实例化每个RadioButton
7.点击每个RaidoButton时,切换不同的页面
(viewPager.setCurrentltem(下标))
8.当页面切换后,还要把当前的导航栏变为绿色
设置文本颜色的
setTextColor(getResources().getColor(R.color.tvGreen));
设置文本的上方的图片的,四个参数分别为,左、上、右、下
setCompoundDrawablesWithIntrinsicBounds
(null,getResources().getDrawable)
(R.drawable.call_t),null,null);
9.当你每次点击之前的时候,添加一个方法,清除方法,
(清理之 前的所有导航栏的状态,置为灰色)
10.实现滑动监听需要addOnPagerChangeListener
11.在onPagerSelected方法中,根据position页面的下标判断分别设置对应的底部导航栏状态
代码演示
1.在主布局文件中引入android-support-v4.jar包并添加RadioGroup并在RadioGroup中添加RadioButton用于显示导航栏
xml version="1.0" encoding="utf-8"?>
<LinearLayout
    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"
    android:orientation="vertical"
    tools:context="com.example.cxy.viewpager.MainActivity">

    <android.support.v4.view.ViewPager
        android:id="@+id/viewPager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="9">
    android.support.v4.view.ViewPager>

    <RadioGroup
        android:id="@+id/radioGroup"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="#F4F3F3"
        android:orientation="horizontal">

        <RadioButton
            android:id="@+id/radioButton1"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:button="@null"
            android:drawableTop="@drawable/mess_t"
            android:gravity="center"
            android:text="微信"
            android:textColor="#11CD6E"/>

        <RadioButton
            android:id="@+id/radioButton2"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:button="@null"
            android:drawableTop="@drawable/call_f"
            android:gravity="center"
            android:text="通讯录"
            android:textColor="@android:color/darker_gray"/>

        <RadioButton
            android:id="@+id/radioButton3"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:button="@null"
            android:drawableTop="@drawable/show_f"
            android:gravity="center"
            android:text="发现"
            android:textColor="@android:color/darker_gray"/>

        <RadioButton
            android:id="@+id/radioButton4"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:button="@null"
            android:drawableTop="@drawable/my"
            android:gravity="center"
            android:text=""
            android:textColor="@android:color/darker_gray"/>
    RadioGroup>
LinearLayout>
2.ViewPager需要适配器继承于PagerAdapter
 
   
package com.example.cxy.viewpager.adapter;
import android.support.v4.view.PagerAdapter;
import android.view.View;
import android.view.ViewGroup;
import java.util.List;
/**
* date:2017/3/7
* Created: 陈箫阳 (admin)
*/
public class MyViewPagerAdpter extends PagerAdapter {
private List mList ;
public MyViewPagerAdpter(List list) {
mList = list;
}
// 返回视图数量
@Override
public int getCount() {
return mList .size();
}
// 是否通过对象加载视图
@Override
public boolean isViewFromObject(View view, Object object) {
return view == object;
}
// 加载当前页面
@Override
public Object instantiateItem(ViewGroup container, int position) {
container.addView( mList .get(position));
return mList .get(position); //View
}
// 销毁滑出视图
@Override
public void destroyItem(ViewGroup container, int position, Object object) {
container.removeView( mList .get(position));
}
}
3.新建一个fragment包,在包中新建OneFragment类用于滑动展示,新建布局文件fragmentone.xml并添加TextView用于添加不同页面的内容,共有四个这里只写一个
OneFragment类
package com.example.cxy.viewpager.fragment;

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

import com.example.cxy.viewpager.R;

/**
 * date:2017/3/7
 * Created:陈箫阳(admin)
 */
public class OneFragment extends Fragment{
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragmentone, null);
        return view;
    }
}
fragmentone.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">

    <TextView
        android:textSize="30sp"
        android:id="@+id/textView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="这是微信页面"/>

LinearLayout>
4.编写主类
package com.example.cxy.viewpager;

import android.os.Bundle;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.RadioButton;
import android.widget.RadioGroup;

import com.example.cxy.viewpager.adapter.MyViewPagerAdpter;

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

public class MainActivity extends AppCompatActivity implements RadioGroup.OnCheckedChangeListener, ViewPager.OnPageChangeListener {
    private ViewPager mViewPager;
    private List mList;
    private RadioGroup mRadioGroup;
    private RadioButton weChatBtn, msgBtn, showBtn, myBtn;


    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //初始化所有控件
        initView();
    }

    private void initView() {
        //实例化ViewPager
        mViewPager = (ViewPager) findViewById(R.id.viewPager);
        //实例化Radiogroup
        mRadioGroup = (RadioGroup) findViewById(R.id.radioGroup);
        //RadioGroup添加监听
        mRadioGroup.setOnCheckedChangeListener(this);
        //实例化RadioButton
        weChatBtn = (RadioButton) findViewById(R.id.radioButton1);
        msgBtn = (RadioButton) findViewById(R.id.radioButton2);
        showBtn = (RadioButton) findViewById(R.id.radioButton3);
        myBtn = (RadioButton) findViewById(R.id.radioButton4);
        //实例化List数组
        mList = new ArrayList<>();
        View view1 = LayoutInflater.from(this).inflate(R.layout.fragmentone, null);
        View view2 = LayoutInflater.from(this).inflate(R.layout.fragmenttwo, null);
        View view3 = LayoutInflater.from(this).inflate(R.layout.fragmentthree, null);
        View view4 = LayoutInflater.from(this).inflate(R.layout.fragmentfour, null);
        //把生成的每一个View对象添加到集合中
        mList.add(view1);
        mList.add(view2);
        mList.add(view3);
        mList.add(view4);
        //实例化适配器
        MyViewPagerAdpter adapter = new MyViewPagerAdpter(mList);
        //ViewPager添加适配器
        mViewPager.setAdapter(adapter);
        //ViewPager添加监听事件
        mViewPager.addOnPageChangeListener(this);
    }

    @Override
    public void onCheckedChanged(RadioGroup group, int checkedId) {
        //清理所有导航栏的状态
        clearState();
        switch (checkedId) {
            case R.id.radioButton1:
                //ViewPager设置当前布局
                mViewPager.setCurrentItem(0);
                //RadioButton设置文本颜色
                weChatBtn.setTextColor(getResources().getColor(R.color.tvGreen));
                //RadioButton设置文本上方的图片
                weChatBtn.setCompoundDrawablesWithIntrinsicBounds(null, getResources().getDrawable(R.drawable.mess_t), null, null);
                break;
            case R.id.radioButton2:
                mViewPager.setCurrentItem(1);
                msgBtn.setTextColor(getResources().getColor(R.color.tvGreen));
                msgBtn.setCompoundDrawablesWithIntrinsicBounds(null, getResources().getDrawable(R.drawable.call_t), null, null);
                break;
            case R.id.radioButton3:
                mViewPager.setCurrentItem(2);
                showBtn.setTextColor(getResources().getColor(R.color.tvGreen));
                showBtn.setCompoundDrawablesWithIntrinsicBounds(null, getResources().getDrawable(R.drawable.show_t), null, null);
                break;
            case R.id.radioButton4:
                mViewPager.setCurrentItem(3);
                myBtn.setTextColor(getResources().getColor(R.color.tvGreen));
                myBtn.setCompoundDrawablesWithIntrinsicBounds(null, getResources().getDrawable(R.drawable.my_t), null, null);
                break;
        }
    }

    //初始化底部导航栏
    private void clearState() {
        weChatBtn.setTextColor(getResources().getColor(android.R.color.darker_gray));
        msgBtn.setTextColor(getResources().getColor(android.R.color.darker_gray));
        showBtn.setTextColor(getResources().getColor(android.R.color.darker_gray));
        myBtn.setTextColor(getResources().getColor(android.R.color.darker_gray));
        weChatBtn.setCompoundDrawablesWithIntrinsicBounds(null, getResources().getDrawable(R.drawable.mess_f), null, null);
        msgBtn.setCompoundDrawablesWithIntrinsicBounds(null, getResources().getDrawable(R.drawable.call_f), null, null);
        showBtn.setCompoundDrawablesWithIntrinsicBounds(null, getResources().getDrawable(R.drawable.show_f), null, null);
        myBtn.setCompoundDrawablesWithIntrinsicBounds(null, getResources().getDrawable(R.drawable.my), null, null);
    }

    //滑动过程中的动作
    @Override
    public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {

    }

    //选择某个页面松手后会被调用
    @Override
    public void onPageSelected(int position) {
        //清理所有导航栏的状态
        clearState();
        switch (position) {
            //使用Switch拿到下标定义当滑动到相应位置小点显示颜色
            case 0:
                //当页面切换后,还要把当前的导航栏变为绿色
                weChatBtn.setTextColor(getResources().getColor(R.color.tvGreen));
                //设置文本的上方的图片的,四个参数分别为,左、上、右、下
                weChatBtn.setCompoundDrawablesWithIntrinsicBounds(null, getResources().getDrawable(R.drawable.mess_t), null, null);
                break;
            case 1:
                msgBtn.setTextColor(getResources().getColor(R.color.tvGreen));
                msgBtn.setCompoundDrawablesWithIntrinsicBounds(null, getResources().getDrawable(R.drawable.call_t), null, null);
                break;
            case 2:
                showBtn.setTextColor(getResources().getColor(R.color.tvGreen));
                showBtn.setCompoundDrawablesWithIntrinsicBounds(null, getResources().getDrawable(R.drawable.show_t), null, null);
                break;
            case 3:
                myBtn.setTextColor(getResources().getColor(R.color.tvGreen));
                myBtn.setCompoundDrawablesWithIntrinsicBounds(null, getResources().getDrawable(R.drawable.my_t), null, null);
                break;
        }

    }

    //手指放上去,松开,拖动都会被调用
    @Override
    public void onPageScrollStateChanged(int state) {

    }
}

你可能感兴趣的:(Android)