Viewpager结合fragment实现底部导航

具体实现如下：

FindFragment.java

package fbtt.com.fbtt.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 fbtt.com.fbtt.R;

/**

 * Created by Administrator on 2016/5/23.

 */

public class FindFragment extends Fragment {

    @Nullable

    @Override

    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

        return inflater.inflate(R.layout.tab_find_fragment, container, false);

    }

}

R.layout.tab_find_fragment：

<?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">

    <TextView

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:text="find"

        android:textSize="40sp"/>

</LinearLayout>

其余对应的MainFragment，MyFragment两个都是相同的。

TabFragmentPagerAdapter类：

package fbtt.com.fbtt.adapter;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentManager;

import android.support.v4.app.FragmentPagerAdapter;

import java.util.List;

/**

 * Created by Administrator on 2016/5/23.

 */

public class TabFragmentPagerAdapter extends FragmentPagerAdapter {

    //继承FragmentPagerAdapter类 ,并自定义的构造器

    private List<Fragment> fragments;

    public TabFragmentPagerAdapter(FragmentManager fm,List<Fragment> fragments) {

        super(fm);

        this.fragments =fragments;

    }

    @Override

    public Fragment getItem(int position) {

        return fragments.get(position);

    }

    @Override

    public int getCount() {

        return fragments.size();

    }

}

tab_main_viewpager.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">

    <android.support.v4.view.ViewPager

        android:id="@+id/tab_main_viewpager"

        android:layout_width="match_parent"

        android:layout_height="0dp"

        android:layout_weight="1" />

    <include layout="@layout/tab_buttom" />

</LinearLayout>

tab_buttom.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="wrap_content"

    android:orientation="horizontal">

    <LinearLayout

        android:id="@+id/id_tab_main"

        android:layout_width="0dp"

        android:layout_height="match_parent"

        android:layout_weight="1"

        android:gravity="center"

        android:layout_marginTop="@dimen/image_magin_size_10dp"

        android:layout_marginBottom="@dimen/image_magin_size_5dp"

        android:orientation="vertical">

        <ImageButton

            android:id="@+id/ib_tab_main_icon_grey"

            android:layout_width="@dimen/image_size_27dp"

            android:layout_height="@dimen/image_size_27dp"

            android:background="#00000000"

            android:clickable="false"

            android:src="@drawable/tab_main_icon_grey" />

        <TextView

            android:id="@+id/tv_tab_main_icon_grey"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginTop="@dimen/image_magin_size_5dp"

            android:text="首頁"

            android:textColor="@color/shouye_tab_grep" />

    </LinearLayout>

    <LinearLayout

        android:id="@+id/id_tab_find"

        android:layout_width="0dp"

        android:layout_height="fill_parent"

        android:layout_weight="1"

        android:gravity="center"

        android:layout_marginTop="@dimen/image_magin_size_10dp"

        android:layout_marginBottom="@dimen/image_magin_size_5dp"

        android:orientation="vertical">

        <ImageButton

            android:id="@+id/ib_tab_find_icon_grey"

            android:layout_width="@dimen/image_size_26dp"

            android:layout_height="@dimen/image_size_26dp"

            android:background="#00000000"

            android:clickable="false"

            android:src="@drawable/tab_find_icon_grey" />

        <TextView

            android:id="@+id/tv_tab_find_icon_grey"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_marginTop="@dimen/image_magin_size_5dp"

            android:text="發現"

            android:textColor="@color/shouye_tab_grep" />

    </LinearLayout>

    <LinearLayout

        android:layout_marginTop="@dimen/image_magin_size_10dp"

        android:layout_marginBottom="@dimen/image_magin_size_5dp"

        android:id="@+id/id_tab_my"

        android:layout_width="0dp"

        android:layout_height="fill_parent"

        android:layout_weight="1"

        android:gravity="center"

        android:orientation="vertical">

        <ImageButton

            android:id="@+id/ib_tab_my_icon_grey"

            android:layout_width="@dimen/image_size_25dp"

            android:layout_height="@dimen/image_size_25dp"

            android:background="#00000000"

            android:clickable="false"

            android:src="@drawable/tab_my_icon_grey" />

        <TextView

            android:id="@+id/tv_tab_my_icon_grey"

            android:layout_marginTop="@dimen/image_magin_size_5dp"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="我的"

            android:textSize="15sp"

            android:textColor="@color/shouye_tab_grep" />

    </LinearLayout>

</LinearLayout>

MainActivity.java为主要的实现：

package fbtt.com.fbtt.activity;

import android.app.Activity;

import android.content.SharedPreferences;

import android.content.res.Configuration;

import android.os.Bundle;

import android.support.v4.app.Fragment;

import android.support.v4.app.FragmentActivity;

import android.support.v4.view.ViewPager;

import android.view.View;

import android.widget.ImageButton;

import android.widget.LinearLayout;

import android.widget.TextView;

import java.util.ArrayList;

import java.util.List;

import java.util.Locale;

import fbtt.com.fbtt.R;

import fbtt.com.fbtt.fragment.FindFragment;

import fbtt.com.fbtt.fragment.MainFragment;

import fbtt.com.fbtt.fragment.MyFragment;

import fbtt.com.fbtt.adapter.TabFragmentPagerAdapter;

public class MainActivity extends FragmentActivity implements View.OnClickListener{

    private Locale myLocale;

    private LinearLayout id_tab_main;

    private LinearLayout id_tab_find;

    private LinearLayout id_tab_my;

    private ImageButton ib_tab_main_icon_grey;

    private ImageButton ib_tab_find_icon_grey;

    private ImageButton ib_tab_my_icon_grey;

    private TextView tv_tab_main_icon_grey;

    private TextView tv_tab_find_icon_grey;

    private TextView tv_tab_my_icon_grey;

    private ViewPager mViewPager;

    private List<Fragment> mFragments;

    private TabFragmentPagerAdapter mAdapter;

    int shouyeRed=0;

    int shouyeGrep=0;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.tab_main_viewpager);

        shouyeRed=getResources().getColor(R.color.shouye_tab_red);

        shouyeGrep=getResources().getColor(R.color.shouye_tab_grep);

        initView();

        initClickListener();

        setSelect(0);

    }

    private void initClickListener() {

        id_tab_main.setOnClickListener(this);

        id_tab_find.setOnClickListener(this);

        id_tab_my.setOnClickListener(this);

    }

    private void initView() {

        mViewPager= (ViewPager) findViewById(R.id.tab_main_viewpager);

        id_tab_main= (LinearLayout) findViewById(R.id.id_tab_main);

        id_tab_find= (LinearLayout) findViewById(R.id.id_tab_find);

        id_tab_my= (LinearLayout) findViewById(R.id.id_tab_my);

        ib_tab_main_icon_grey= (ImageButton) findViewById(R.id.ib_tab_main_icon_grey);

        ib_tab_find_icon_grey= (ImageButton) findViewById(R.id.ib_tab_find_icon_grey);

        ib_tab_my_icon_grey= (ImageButton) findViewById(R.id.ib_tab_my_icon_grey);

        tv_tab_main_icon_grey= (TextView) findViewById(R.id.tv_tab_main_icon_grey);

        tv_tab_find_icon_grey=(TextView) findViewById(R.id.tv_tab_find_icon_grey);

        tv_tab_my_icon_grey=(TextView) findViewById(R.id.tv_tab_my_icon_grey);

        mFragments = new ArrayList<Fragment>();

        Fragment mTab_01 = new MainFragment();

        Fragment mTab_02 = new FindFragment();

        Fragment mTab_03 = new MyFragment();

        mFragments.add(mTab_01);

        mFragments.add(mTab_02);

        mFragments.add(mTab_03);

        mAdapter = new TabFragmentPagerAdapter(getSupportFragmentManager(), mFragments);

        mViewPager.setAdapter(mAdapter);

        //设置滑动监听器

        mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {

            @Override

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

            }

            //滑动时 改变图标状态

            @Override

            public void onPageSelected(int position) {

                int currentItem = mViewPager.getCurrentItem();

                initTabImage();

                switch (currentItem) {

                    case 0:

                        ib_tab_main_icon_grey.setImageResource(R.drawable.tab_main_icon_red);

                        tv_tab_main_icon_grey.setTextColor(shouyeRed);

                        break;

                    case 1:

                        ib_tab_find_icon_grey.setImageResource(R.drawable.tab_find_icon_red);

                        tv_tab_find_icon_grey.setTextColor(shouyeRed);

                        break;

                    case 2:

                        ib_tab_my_icon_grey.setImageResource(R.drawable.tab_my_icon_red);

                        tv_tab_my_icon_grey.setTextColor(shouyeRed);

                        break;

                }

            }

            @Override

            public void onPageScrollStateChanged(int state) {

            }

        });

    }

    //初始的图标状态(滑动和点击事件改变的时候都要初始化)

    private void initTabImage() {

        ib_tab_main_icon_grey.setImageResource(R.drawable.tab_main_icon_grey);

        tv_tab_main_icon_grey.setTextColor(shouyeGrep);

        ib_tab_find_icon_grey.setImageResource(R.drawable.tab_find_icon_grey);

        tv_tab_find_icon_grey.setTextColor(shouyeGrep);

        ib_tab_my_icon_grey.setImageResource(R.drawable.tab_my_icon_grey);

        tv_tab_my_icon_grey.setTextColor(shouyeGrep);

    }

    public void changeLang(String lang){

        if (lang.equalsIgnoreCase("")){

            return;

        }

        myLocale = new Locale(lang);

        saveLocale(lang);

        Locale.setDefault(myLocale);

        Configuration config=new Configuration();

        config.locale=myLocale;

        getBaseContext().getResources().updateConfiguration(config, getBaseContext().getResources().getDisplayMetrics());

        updateTexts();

    }

    public void saveLocale(String lang) {

        String langPref = "Language";

        SharedPreferences prefs = getSharedPreferences("CommonPrefs", Activity.MODE_PRIVATE);

        SharedPreferences.Editor editor = prefs.edit();

        editor.putString(langPref, lang);

        editor.commit();

    }

    private void updateTexts() {

    }

    @Override

    public void onClick(View v) {

        switch (v.getId()) {

            case R.id.id_tab_main:

                //注意上面修改的只是图标的状态,还要修改相对应的fragment;

                setSelect(0);

                break;

            case R.id.id_tab_find:

                setSelect(1);

                break;

            case R.id.id_tab_my:

                setSelect(2);

                break;

        }

    }

    //设置将点击的那个图标为亮色,切换内容区域

    private void setSelect(int i) {

        initTabImage();

        switch (i) {

            case 0:

                ib_tab_main_icon_grey.setImageResource(R.drawable.tab_main_icon_red);

                tv_tab_main_icon_grey.setTextColor(shouyeRed);

                break;

            case 1:

                ib_tab_find_icon_grey.setImageResource(R.drawable.tab_find_icon_red);

                tv_tab_find_icon_grey.setTextColor(shouyeRed);

                break;

            case 2:

                ib_tab_my_icon_grey.setImageResource(R.drawable.tab_my_icon_red);

                tv_tab_my_icon_grey.setTextColor(shouyeRed);

                break;

            default:

                break;

        }

        mViewPager.setCurrentItem(i);

    }

}

效果截图：

Viewpager结合fragment实现底部导航的更多相关文章

[置顶] xamarin android Fragment实现底部导航栏
前段时间写了篇关于Fragment的文章,介绍了基础的概念,用静态和动态的方式加载Fragment Xamarin Android Fragment的两种加载方式.下面的这个例子介绍xamarin ...
TextView+Fragment实现底部导航栏
前言:项目第二版刚上线没多久,产品又对需求进行了大改动,以前用的是左滑菜单,现在又要换成底部导航栏,于是今天又苦逼加班了.花了几个小时实现了一个底部导航栏的demo,然后总结一下.写一篇博客.供自己以 ...
Android学习笔记- Fragment实例底部导航栏的实现
1.要实现的效果图以及工程目录结构: 先看看效果图吧: 接着看看我们的工程的目录结构: 2.实现流程: Step 1:写下底部选项的一些资源文件我们从图上可以看到,我们底部的每一项点击的时候都有不同 ...
使用BottomNavigationView+ViewPager+Fragment的底部导航栏
2019独角兽企业重金招聘Python工程师标准>>> 使用BottomNavigationView做底部工具栏,使用ViewPager做页面切换,使用Fragment完成每个页面的 ...
使用ViewPager和Fragment实现滑动导航
ViewPage是android-support-v4.jar包提供的用于页面滑动的库,android-support-v4.jar是google推荐使用的一个类库,在项目中使用之前,你必须其添加到项 ...
使用fragment添加底部导航栏
切记:fragment一定要放在framlayout中,不然不会被替换完全(就是切换之后原来的fagment可能还会存在) main.xml <LinearLayout xmlns:androi ...
Android底部导航栏创建——ViewPager + RadioGroup
原创文章,引用请注明出处:http://www.cnblogs.com/baipengzhan/p/6270201.html Android底部导航栏有多种实现方式,本文详解其中的ViewPager ...
Android之RadioGroup+ViewPager制作的底部导航栏
在日常开发中我们常常会用到类似微信或者QQ的底部导航.实现这样的效果有多种,今天就为大家介绍一种实现简单,可控性好的底部导航的实现方法. 首先创建activity_main.xml布局文件,里面主要由 ...
Android_ViewPager+Fragment实现页面滑动和底部导航栏
1.Xml中底部导航栏由一个RadioGroup组成,其上是ViewPager. <?xml version="1.0" encoding="utf-8" ...

随机推荐

HTML中的table布局
<table width="100" height="50" border="1" bgcolor="blue"& ...
salesforce 零基础学习（六十七）SingleEmailMessage 那点事
在salesforce开发中,发送邮件是一个很常见的功能.比如在进入审批流以后的通过和拒绝的操作需要发送邮件给记录的owner,和其他系统交互以后更改了某些状态通知相关的User或者Contact等等 ...
python爬虫实战（二）--------千图网高清图
相关代码已经修改调试----2017-3-21 实现:千图网上高清图片的爬取程序运行20小时,爬取大约162000张图片,一共49G,存入百度云.链接:http://pan.baidu.com/s/ ...
3.Redis常用命令：String
字符串类型是Redis中最为基础的数据存储类型,它在Redis中是二进制安全的,这便意味着该类型可以接受任何格式的数据,如JPEG图像数据或Json对象描述信息等.在Redis中字符串类型的Value ...
eclipse中配置drools6.5环境
1.去官网下载两个压缩包 2.解压两个压缩包,依次进入droolsjbpm-tools-distribution-6.5.0.Final\droolsjbpm-tools-distribution-6 ...
漫谈PHP代码规范
前言虽说PHP是世界上最好的语言,但是写出来的PHP代码却往往不是最美观的.究其原因,可能正式因为PHP简单易上手,适合快速迭代的特性,导致了我们沉浸在迅速完成需求迭代的窃喜中,却忘记了规范性.忽略 ...
PCIE_DMA实例三：Xilinx 7系列(KC705/VC709)FPGA的EDK仿真
一:前言好久没写博客了,前段时间有个朋友加微信请教关于PCIe的一些学习方法.本人也不是专家,只是略知一些皮毛.对于大家反馈的问题未必能一一解答,但一定知无不言.以后我会常来博客园看看,大家可以把问 ...
HTML5基础学习
分享一下html5的一些基础,小白上路! 一.html5基本结构 <!DOCTYPE html> ↑声明文档类型为HTML5文件. 文档声明,在HTML文档必不可少.且必须放在文档第一行 ...
filter滤镜的使用
刚开始学css,开始遇到filter不懂什么意思后来到网上查了,觉得解释的很全面,就把它抠下来,以便自己经常来看看. CSS滤镜的使用方法:filter:filtername(parameters) ...
JavaScript编码解码以及C#中的编码解码
JS: 编码解码 escape unescape encodeURI decodeURI encodeURIComponent decodeURIComponent C#: HttpUtilit ...

Viewpager结合fragment实现底部导航

Viewpager结合fragment实现底部导航的更多相关文章

随机推荐

热门专题