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) {

  }
}

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。