主要思想:顶部标题top.xml,中间Fragment,底部Tab导航。

top.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="45dp"
android:background="@drawable/title_bar"
android:gravity="center"
android:orientation="vertical" > <TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="微信"
android:textColor="#ffffff"
android:textSize="20sp"
android:textStyle="bold" /> </LinearLayout>

bottom.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="55dp"
android:background="@drawable/bottom_bar"
android:orientation="horizontal" > <LinearLayout
android:id="@+id/id_tab_weixin"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" > <ImageButton
android:id="@+id/id_tab_weixin_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00000000"
android:clickable="false"
android:src="@drawable/tab_weixin_pressed" /> <TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="微信"
android:textColor="#ffffff" />
</LinearLayout> <LinearLayout
android:id="@+id/id_tab_frd"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" > <ImageButton
android:id="@+id/id_tab_frd_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00000000"
android:clickable="false"
android:src="@drawable/tab_find_frd_normal" /> <TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="朋友"
android:textColor="#ffffff" />
</LinearLayout> <LinearLayout
android:id="@+id/id_tab_address"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" > <ImageButton
android:id="@+id/id_tab_address_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00000000"
android:clickable="false"
android:src="@drawable/tab_address_normal" /> <TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="通讯录"
android:textColor="#ffffff" />
</LinearLayout> <LinearLayout
android:id="@+id/id_tab_settings"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="center"
android:orientation="vertical" > <ImageButton
android:id="@+id/id_tab_settings_img"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#00000000"
android:clickable="false"
android:src="@drawable/tab_settings_normal" /> <TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="设置"
android:textColor="#ffffff" />
</LinearLayout> </LinearLayout>

activity_main.xml具体实现:

<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" > <include layout="@layout/top" /> <FrameLayout
android:id="@+id/id_content"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="1"
></FrameLayout> <include layout="@layout/bottom" /> </LinearLayout>

WeixinFragment.java具体实现:

package com.imooc.tab02;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup; public class WeixinFragment extends Fragment
{
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState)
{
return inflater.inflate(R.layout.tab01, container, false);
}
}

另外3个Fragment的实现类似,此处不再赘述。

MainActivity.java具体实现:

package com.imooc.tab02;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.view.View;
import android.view.View.OnClickListener;
import android.view.Window;
import android.widget.ImageButton;
import android.widget.LinearLayout; public class MainActivity extends FragmentActivity implements OnClickListener
{
private LinearLayout mTabWeixin;
private LinearLayout mTabFrd;
private LinearLayout mTabAddress;
private LinearLayout mTabSettings; private ImageButton mImgWeixin;
private ImageButton mImgFrd;
private ImageButton mImgAddress;
private ImageButton mImgSettings; private Fragment mTab01;
private Fragment mTab02;
private Fragment mTab03;
private Fragment mTab04; @Override
protected void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
requestWindowFeature(Window.FEATURE_NO_TITLE);
setContentView(R.layout.activity_main);
initView();
initEvent();
setSelect(0);
} private void initEvent()
{
mTabWeixin.setOnClickListener(this);
mTabFrd.setOnClickListener(this);
mTabAddress.setOnClickListener(this);
mTabSettings.setOnClickListener(this);
} private void initView()
{
mTabWeixin = (LinearLayout) findViewById(R.id.id_tab_weixin);
mTabFrd = (LinearLayout) findViewById(R.id.id_tab_frd);
mTabAddress = (LinearLayout) findViewById(R.id.id_tab_address);
mTabSettings = (LinearLayout) findViewById(R.id.id_tab_settings); mImgWeixin = (ImageButton) findViewById(R.id.id_tab_weixin_img);
mImgFrd = (ImageButton) findViewById(R.id.id_tab_frd_img);
mImgAddress = (ImageButton) findViewById(R.id.id_tab_address_img);
mImgSettings = (ImageButton) findViewById(R.id.id_tab_settings_img);
} private void setSelect(int i)
{
FragmentManager fm = getSupportFragmentManager();
FragmentTransaction transaction = fm.beginTransaction();
hideFragment(transaction);
// 把图片设置为亮的
// 设置内容区域
switch (i)
{
case 0:
if (mTab01 == null)
{
mTab01 = new WeixinFragment();
transaction.add(R.id.id_content, mTab01);
} else
{
transaction.show(mTab01);
}
mImgWeixin.setImageResource(R.drawable.tab_weixin_pressed);
break;
case 1:
if (mTab02 == null)
{
mTab02 = new FrdFragment();transaction.add(R.id.id_content, mTab02);
} else
{
transaction.show(mTab02); }
mImgFrd.setImageResource(R.drawable.tab_find_frd_pressed);
break;
case 2:
if (mTab03 == null)
{
mTab03 = new AddressFragment();
transaction.add(R.id.id_content, mTab03);
} else
{
transaction.show(mTab03);
}
mImgAddress.setImageResource(R.drawable.tab_address_pressed);
break;
case 3:
if (mTab04 == null)
{
mTab04 = new SettingFragment();
transaction.add(R.id.id_content, mTab04);
} else
{
transaction.show(mTab04);
}
mImgSettings.setImageResource(R.drawable.tab_settings_pressed);
break; default:
break;
} transaction.commit();
} private void hideFragment(FragmentTransaction transaction)
{
if (mTab01 != null)
{
transaction.hide(mTab01);
}
if (mTab02 != null)
{
transaction.hide(mTab02);
}
if (mTab03 != null)
{
transaction.hide(mTab03);
}
if (mTab04 != null)
{
transaction.hide(mTab04);
}
} @Override
public void onClick(View v)
{
resetImgs();
switch (v.getId())
{
case R.id.id_tab_weixin:
setSelect(0);
break;
case R.id.id_tab_frd:
setSelect(1);
break;
case R.id.id_tab_address:
setSelect(2);
break;
case R.id.id_tab_settings:
setSelect(3);
break; default:
break;
}
} /**
* 切换图片至暗色
*/
private void resetImgs()
{
mImgWeixin.setImageResource(R.drawable.tab_weixin_normal);
mImgFrd.setImageResource(R.drawable.tab_find_frd_normal);
mImgAddress.setImageResource(R.drawable.tab_address_normal);
mImgSettings.setImageResource(R.drawable.tab_settings_normal);
} }

Fragment实现不支持左右滑动的Tab的更多相关文章

  1. ViewPager+Fragment实现支持左右滑动的Tab

    主要思想:顶部标题栏top.xml,中间ViewPager(4个Fragment),底部导航 top.xml和bottom.xml在我之前的两个随笔里有,此处不再赘述. activity_main.x ...

  2. Android开发之ViewPager+ActionBar+Fragment实现响应式可滑动Tab

     今天我们要实现的这个效果呢,在Android的应用中十分地常见,我们可以看到下面两张图,无论是系统内置的联系人应用,还是AnyView的阅读器应用,我们总能找到这样的影子,当我们滑动屏幕时,Tab可 ...

  3. Android实战简易教程-第三十四枪(基于ViewPager和FragmentPagerAdapter实现滑动通用Tab)

    上一段时间写过一篇文章<基于ViewPager实现微信页面切换效果> 里面实现了相似微信Tab的页面.可是这样的实现方法有个问题.就是以后全部的代码逻辑都必须在MainActivity中实 ...

  4. 3种方式实现可滑动的Tab

    1. 第一种,使用 TabHost + ViewPager 实现 该方法会有一个Bug,当设置tabHost.setCurrentTab()为0时,ViewPager不显示(准确的说是加载),只有点击 ...

  5. [js开源组件开发]js轮播图片支持手机滑动切换

    js轮播图片支持手机滑动切换 carousel-image 轮播图片,支持触摸滑动. 例子见DEMO http://www.lovewebgames.com/jsmodule/carousel-ima ...

  6. 简洁的支持展开关闭的tab标签代码

    简洁的支持展开关闭的tab标签代码,由huiyi8素材网提供. TAB标签代码下载:http://www.huiyi8.com/tab/

  7. flickity:支持触摸滑动,响应迅速的幻灯片轮播插件

    简介:flickity 是一个支持触摸,响应迅速的幻灯片轮播插件.支持环绕滑动.自由滑动.组滑动.自动播放.延迟加载.视差滑动.图片滑动.兼容IE10+, Android 4+, Safari for ...

  8. UITableView 支持左右滑动(一)

    原理如下: SwipeTableView subView 1 :  UIScrollView作为容器, 主要负责左右滑动, 每个tableView的顶部设置相同的contentInset subVie ...

  9. Android Studio 使用ViewPager + Fragment实现滑动菜单Tab效果 --简易版

    描述: 之前有做过一个记账本APP,拿来练手的,做的很简单,是用Eclipse开发的: 最近想把这个APP重新完善一下,添加了一些新的功能,并选用Android Studio来开发: APP已经完善了 ...

随机推荐

  1. 如何将 MFC ActiveX 控件标记为安全,脚本和初始化

    MSDN原文.ActiveX控件标记安全(可以不仅仅是MFC ActiveX) 概要 默认情况下,MFC ActiveX 控件未标记为对脚本编写是安全的和对初始化是安全的.控制运行在 Internet ...

  2. MYSQL事务和锁

    mysql事务(一)—转载 2012年12月20日 ⁄ Mysql数据库, 技术交流 ⁄ 暂无评论 一. 什么是事务 事务就是一段sql 语句的批处理,但是这个批处理是一个atom(原子) ,不可分割 ...

  3. ajax+php如何获取部分请求的信息显示在对应的div中

    我该如何把需要显示的信息显示在文章列表中呢???

  4. hdu 4614 Vases and Flowers 线段树

    题目链接 一共n个盒子, 两种操作, 第一种是给出两个数x, y, 从第x个盒子开始放y朵花, 一个盒子只能放一朵, 如果某个盒子已经有了, 那么就跳过这个盒子放下面的盒子. 直到花放完了或者到了最后 ...

  5. Vistual Studio 2010 调试无法进断点

    系统是2003出现的问题 win8就没事 打sp1 补丁就行

  6. VC++ win32 多线程 一边画圆一边画矩形

    // WinThreadTest.cpp : Defines the entry point for the application. // #include "stdafx.h" ...

  7. 转: js中的getYear()函数的问题(推荐用 getFullYear())

    用了JS的getYear()方法,但是发现生成的代码竟然有108(本应该是2008),发现这是firefox下的问题. 然后google了一下,发 现原来是这样的:var today = new da ...

  8. ORACLE模拟一个数据文件坏块并使用RMAN备份来恢复

    1.创建一个实验用的表空间并在此表空间上创建表 create tablespace blocktest datafile '/u01/oradata/bys1/blocktest.dbf' size ...

  9. JAVA GUI学习 - JList列表、JScrollPane滚动条组件学习

    /** * 本例结合JList和JScrollPane共同使用 * @author Wfei * */ public class JListKnow extends JFrame { JList jL ...

  10. POJ-1006 Biorhythms

    [题目描述] 三个周期时间分别为:23,28和33.分别给定三个周期的某一天(不一定是第一天),和开始计算的日期,输出下一个triple peak. [思路分析] 如果不了解中国剩余定理,可以通过模拟 ...