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" ...
随机推荐
- wamp2.4.4 如何配置虚拟主机及反向代理(解决跨域问题)
一.找到安装目录下的httpd.conf文件 1. 删除Include conf/extra/httpd-vhosts.conf前面的#号(开启虚拟主机的配置) 2. 删除LoadModule pro ...
- EntityFramework Core高并发深挖详解，一纸长文，你准备好了吗？
前言 之前有关EF并发探讨过几次,但是呢,博主感觉还是有问题,为什么会觉得有问题,其实就是理解不够透彻罢了,于是在项目中都是用的存储过程或者SQL语句来实现,利用放假时间好好补补EF Core并发的问 ...
- Python之路-Linux命令基础（2）
作业一: 1) 新建用户natasha,uid为1000,gid为555,备注信息为"master" 2) 修改natasha用户的家目录为/Natasha 3) ...
- 使用Vagrant打造开发环境
1.安装Oracle VM VirtualBox.vagrant,安装完成需重启电脑 Oracle VM VirtualBox安装包下载:https://www.virtualbox.org/wiki ...
- JSAAS的Activiti会签开发扩展处理
1.什么是会签? 在流程业务管理中,任务是通常都是由一个人去处理的,而多个人同时处理一个任务,这种任务我们称之为会签任务.这种业务需求很常见,如一个请款单,领导审批环节中,就需要多个部门领导签字.在流 ...
- 老李推荐：第14章3节《MonkeyRunner源码剖析》 HierarchyViewer实现原理-HierarchyViewer实例化
老李推荐:第14章3节<MonkeyRunner源码剖析> HierarchyViewer实现原理-HierarchyViewer实例化 poptest是国内唯一一家培养测试开发工程师的培 ...
- Angularjs 实现移动端在线测评效果
注:此文所用的angular版本为 1.6 一.运行效果图 二.需求 1. 点击选项时,背景变为黄色(即选中状态),并且自动切换到下一题 2. 切换到下一题时,顶部进度随之改变 3. 选中时要把对应的 ...
- Struts2基础学习(一)—初识Struts2
目录 一.什么是Struts2 二.搭建Struts2的开发环境 三.Struts2的配置文件 四.MVC模式 一.什么是Struts2 Struts2是一个非常优秀的MVC框架,由传统 ...
- mysql 分析2 show processlist ;
show processlist ; 可以查看当前有哪些链接 处于什么状态 分析语句 那些连接处于什么状态 (需要通过脚本观察一段时间内的有运行情况做出统计一直刷新服务器运行状态 ) 当出现下面的几种 ...
- 解决failed to push some refs to
由于github我使用了dev和feature分支,团队合作合并到dev,个人开发都是feature....今天在本地feature中git pull origin dev 出现 在使用git 对源代 ...