文档章节

ViewPager中常用的tab例子1

初来小修
 初来小修
发布于 2016/02/04 15:07
字数 917
阅读 25
收藏 0


效果图示例:






===============================


1、res/layout下的 activity_main.xml布局 


代码


<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="${relativePackage}.${activityClass}" >


    <android.support.v4.view.ViewPager

        android:id="@+id/viewPager"

        android:layout_width="match_parent"

        android:layout_height="wrap_content" />

    <!-- 不使用Button而使用RadioGroup是为了在代码中好控制 Button控件些

    RadioButton的一些集体属性也可以在res/values/styles.xml里设置

    然后在这里引用设置好的样式就行 -->

    <RadioGroup 

        android:id="@+id/radioGroup"

        android:layout_width="match_parent"

        android:layout_height="wrap_content"

        android:layout_alignParentBottom="true"

        android:gravity="center"

        android:background="#000"

        android:orientation="horizontal">

        

       <RadioButton android:id="@+id/leftRadio"

           android:layout_width="0dp"

           android:layout_weight="1"

           android:layout_height="wrap_content"

           android:background="@drawable/navbar_tab_l_bg"

           android:text="左边"

           style="@style/tabs_style"

           />

       

        <RadioButton android:id="@+id/middleRadio"

           android:layout_width="0dp"

           android:layout_weight="1"

           android:layout_height="wrap_content"

           android:background="@drawable/navbar_tab_m_bg"

           android:text="中间"

           style="@style/tabs_style"

           />

        

         <RadioButton android:id="@+id/rightRadio"

           android:layout_width="0dp"

           android:layout_weight="1"

           android:layout_height="wrap_content"

           android:background="@drawable/navbar_tab_r_bg"

           android:text="右边"

           style="@style/tabs_style"

           />

            

    </RadioGroup>


</RelativeLayout>



//样式的基本使用 -- 样式中定义布局控件的共同属性 然后引用 比较方便

//  2、在res/values/styles.xml样式布局 中 本程序共用属性如下



=========================



3、按钮(RadioButton)用到的图片自己找, 然后放到res/drawable下,这里用到6张 , 左边2张 , 中间2张 , 右边2张,

 2张中一张是没点击或没选 中的 颜色浅一些 , 一张点击或 选中的 颜色深一些。

    有 了按钮(RadioButton)图片,就可以在res/drawable下设置图片的样式 了

    3个样式布局 一个左边按钮  一个中间按钮  一个右边按钮


1)navbar_tab_l_bg.xml 样式布局


代码


<?xml version="1.0" encoding="utf-8"?>

<!-- Android中的Selector主要是用来改变ListView和Button控件的默认背景 -->

<selector xmlns:android="http://schemas.android.com/apk/res/android" >

    <item android:state_checked="true" android:drawable="@drawable/navbar_tab_l_pressed"/>

    <item android:state_checked="false" android:drawable="@drawable/navbar_tab_l_normal"/>

</selector>



-------------------------------



2)navbar_tab_m_bg.xml样式布局


代码


<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android" >

    <item android:state_checked="true" android:drawable="@drawable/navbar_tab_m_pressed"/>

    <item android:state_checked="false" android:drawable="@drawable/navbar_tab_m_normal"/>

</selector>



---------------------------------


3)navbar_tab_r_bg.xml样式布局


代码


<?xml version="1.0" encoding="utf-8"?>

<selector xmlns:android="http://schemas.android.com/apk/res/android" >

    <item android:state_checked="true" android:drawable="@drawable/navbar_tab_r_pressed"/>

    <item android:state_checked="false" android:drawable="@drawable/navbar_tab_r_normal"/>

</selector>





=======================================



 

4、    .java 源文件有4个 1个左边碎片  一个中间碎片  一个右边碎片 

         一个MainActivity




LeftFragment.java类


代码


public class LeftFragment extends Fragment {


@Override

public View onCreateView(LayoutInflater inflater,

@Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {

TextView text_left = new TextView(getActivity());

text_left.setText("这是leftfragment");

text_left.setTextSize(40);

return text_left;

}

}



=====================




MiddleFragment.java类


代码


public class MiddleFragment extends Fragment {


@Override

public View onCreateView(LayoutInflater inflater,

@Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {

TextView text_middle = new TextView(getActivity());

text_middle.setText("这是middlefragment");

text_middle.setTextSize(40);

return text_middle;

}

}



=========================




RightFragment.java 类



代码



public class RightFragment extends Fragment {


@Override

public View onCreateView(LayoutInflater inflater,

@Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {

TextView text_right = new TextView(getActivity());

text_right.setText("这是rightfragment");

text_right.setTextSize(40);

return text_right;

}

}




========================



MainActivity类


代码



public class MainActivity extends FragmentActivity {


private ViewPager viewPager;

private MyFragmentPagerAdapter adapter;

private RadioGroup radioGroup;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

        

        this.viewPager = (ViewPager) this.findViewById(R.id.viewPager);

        this.radioGroup = (RadioGroup) this.findViewById(R.id.radioGroup);

        //ViewPager中Fragment(碎片)的切换用FragmentPagerAdapter适配器

        //ViewPager中图片的切换用PagerAdapter适配器

        adapter = new MyFragmentPagerAdapter(getSupportFragmentManager());

        viewPager.setAdapter(adapter);

        

        viewPager.setOnPageChangeListener(new OnPageChangeListener() {

@Override

public void onPageSelected(int position) {

//滑动的时 RadioButton也要改变

RadioButton check_radio = (RadioButton) radioGroup.getChildAt(position);

   check_radio.setChecked(true);

}

@Override

public void onPageScrolled(int arg0, float arg1, int arg2) {

}

@Override

public void onPageScrollStateChanged(int arg0) {

}

});

        //RadioGroup的点击事件监听

        radioGroup.setOnCheckedChangeListener(new OnCheckedChangeListener() {

@Override

public void onCheckedChanged(RadioGroup arg0, int checkId) {

//RadioGroup点击时ViewPager也要改变

for(int i = 0;i<radioGroup.getChildCount();i++){

RadioButton check_radio = (RadioButton) radioGroup.getChildAt(i);

if(check_radio.getId() == checkId){

viewPager.setCurrentItem(i);

}

}

}

});

    }

    

    //这个适配器类继承于FragmentPagerAdapter类

    class MyFragmentPagerAdapter extends FragmentPagerAdapter{


    private List<Fragment> list = new ArrayList<Fragment>();

    //继承FragmentPagerAdapter类的 类是没有无惨构造函数的

public MyFragmentPagerAdapter(FragmentManager fm) {

super(fm);

//初始化需要的数据

list.add(new LeftFragment());

list.add(new MiddleFragment());

list.add(new RightFragment());

}

@Override

public Fragment getItem(int position) {

return list.get(position);

}

@Override

public int getCount() {

return list.size();

}

   

    }

}


© 著作权归作者所有

初来小修
粉丝 4
博文 117
码字总数 80711
作品 0
广州
私信 提问
【求指教!!】Fragment ViewPager相关问题

想实现类似于微信的效果,点击Footer的tab整个页面的内容跟着变化,但是页面切换不需要滑动(页面切换包括手势切换和点击Footer的tab切换,默认ViewPager是手势切换和点击Footer的tab切换都有...

Summersize
2013/12/16
317
3
Fragement+ViewPager+Fragment

求大神指导 该怎么在Fragment中使用ViewPager 并且ViewPager的三个Tab使用3个Fragmengt 也就是 Fragment中嵌套ViewPager ViewPager嵌套Fragment...

lollipop
2015/03/22
294
4
Android开源控件ViewPager Indicator的使用方法

Android Viewpager Indicator是Android开发中最常用的控件之一,几乎所有的新闻类APP中都有使用,下面介绍其基本使用方法。 1. ViewPager Indicator的Library 查看Viewpager Indicator的Lib...

linsea
2014/03/14
0
0
Fragement+ViewPager+Fragment

该怎么在Fragment中使用ViewPager 并且ViewPager的三个Tab使用3个Fragmengt 也就是 Fragment中嵌套ViewPager ViewPager嵌套Fragment...

lollipop
2015/03/22
160
1
ViewPager一:结合Fragment使用

平时都是打开一个Word来记笔记,现在发现不如写个博文,又不容易丢失,又方便。所以,本次开始,代码一律用截图上传。 接触android开始,就频繁接触android.support.v4包里面的这个向下兼容类...

熊西西77
2018/06/26
0
0

没有更多内容

加载失败,请刷新页面

加载更多

【AI实战】手把手教你深度学习文字识别(文字检测篇:基于MSER, CTPN, SegLink, EAST等方法)

文字检测是文字识别过程中的一个非常重要的环节,文字检测的主要目标是将图片中的文字区域位置检测出来,以便于进行后面的文字识别,只有找到了文本所在区域,才能对其内容进行识别。 文字检...

雪饼
今天
15
0
思维导图XMind 8 Pro 绿化方法(附序列号)

按部就班: Step 1 -全新下载最新版本的 Xmind 8(注必须是英文官方的版本,中文代{过}{滤}理网站的版本修改过,无法使用pj); Step 2 -安装完毕后,点击文末的下载按钮下载pj补丁文件包,将...

一只小青蛙
今天
10
0
数据结构(ER数据库)设计规范

表命名规范 表命名的规则分为3个层级,层级之间通过_分割,例如b_r_identity、d_l_identity。规约为: [leavel]_[type]_[name] [leavel] 表示数据库表的层级和功能,分为: s:业务无关的系统...

随风溜达的向日葵
今天
10
0
阿里Sentinel控制台源码修改-对接Apollo规则持久化

https://github.com/alibaba/Sentinel/wiki/%E5%9C%A8%E7%94%9F%E4%BA%A7%E7%8E%AF%E5%A2%83%E4%B8%AD%E4%BD%BF%E7%94%A8-Sentinel 动态规则扩展 https://github.com/alibaba/Sentinel/wiki......

jxlgzwh
昨天
14
0
在Linux系统中创建SSH服务器别名

如果你经常通过 SSH 访问许多不同的远程系统,这个技巧将为你节省一些时间。你可以通过 SSH 为频繁访问的系统创建 SSH 别名,这样你就不必记住所有不同的用户名、主机名、SSH 端口号和 IP 地...

老孟的Linux私房菜
昨天
13
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部