Android ViewPager与radiogroup实现关联

Android ViewPager与radiogroup实现关联
效果图展示



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<View> mList;
public MyViewPagerAdpter(List<View> 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<View> 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) {

}
}