tabhostandbadgeview

效果

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

 

 

素材

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

 

tab_select.xml

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

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

<selector

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

    <item android:state_selected="false"  android:drawable="@drawable/tab"></item>

    <item android:state_selected="true"   android:drawable="@drawable/foucs001"></item>

    

</selector>

 

activity_main.xml

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

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

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

    android:id="@+id/mtabs"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical" >

 

    <LinearLayout

        android:layout_width="fill_parent"

        android:layout_height="fill_parent"

        android:orientation="vertical" >

 

        <TabWidget

            android:id="@android:id/tabs"

            android:layout_width="match_parent"

            android:layout_height="wrap_content"

            android:layout_weight="0" >

        </TabWidget>

 

        <FrameLayout

            android:id="@android:id/tabcontent"

            android:layout_width="fill_parent"

            android:layout_height="fill_parent"

            android:layout_weight="1" >

 

            <TextView

                android:id="@+id/tab1"

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="Tab 1"

                android:textSize="20dip" />

 

            <TextView

                android:id="@+id/tab2"

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="Tab 2"

                android:textSize="20dip" />

 

            <TextView

                android:id="@+id/tab3"

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="Tab 3"

                android:textSize="20dip" />

        </FrameLayout>

    </LinearLayout>

 

</TabHost>

 

 

tab_icon.xml

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

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

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

    android:layout_width="fill_parent"

    android:layout_height="40dip"

    android:background="@drawable/tab"

    android:orientation="vertical" >

 

    <LinearLayout

        android:layout_width="fill_parent"

        android:layout_height="fill_parent"

        android:background="@drawable/tab_select"

        android:gravity="center"

        android:orientation="horizontal" >

 

        <ImageView

            android:id="@+id/iv"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_gravity="center"

            android:paddingTop="5dp" />

 

        <TextView

            android:id="@+id/tv"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_gravity="center"

            android:gravity="center" />

    </LinearLayout>

 

</LinearLayout>

 

 

tab_icon2.xml

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

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

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

    android:layout_width="fill_parent"

    android:layout_height="40dip"

    android:background="@drawable/tab"

    android:orientation="vertical" >

 

    <LinearLayout

        android:layout_width="fill_parent"

        android:layout_height="fill_parent"

        android:background="@drawable/tab_select"

        android:gravity="center"

        android:orientation="vertical" >

 

        <ImageView

            android:id="@+id/iv"

            android:layout_width="fill_parent"

            android:layout_height="wrap_content"

            android:layout_gravity="center"

            android:paddingTop="5dp" />

 

        <TextView

            android:id="@+id/tv"

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:layout_gravity="center"

            android:gravity="center" />

    </LinearLayout>

 

</LinearLayout>

 

 

activity_main.xml

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

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

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

    android:id="@+id/mtabs"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    android:orientation="vertical" >

 

    <LinearLayout

        android:layout_width="fill_parent"

        android:layout_height="fill_parent"

        android:orientation="vertical" >

 

        <TabWidget

            android:id="@android:id/tabs"

            android:layout_width="match_parent"

            android:layout_height="wrap_content"

            android:layout_weight="0" >

        </TabWidget>

 

        <FrameLayout

            android:id="@android:id/tabcontent"

            android:layout_width="fill_parent"

            android:layout_height="fill_parent"

            android:layout_weight="1" >

 

            <TextView

                android:id="@+id/tab1"

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="Tab 1"

                android:textSize="20dip" />

 

            <TextView

                android:id="@+id/tab2"

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="Tab 2"

                android:textSize="20dip" />

 

            <TextView

                android:id="@+id/tab3"

                android:layout_width="wrap_content"

                android:layout_height="wrap_content"

                android:text="Tab 3"

                android:textSize="20dip" />

        </FrameLayout>

    </LinearLayout>

 

</TabHost>

 

 

MainActivity.java

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

package com.tabhostandbadgeview;

 

import com.readystatesoftware.viewbadger.BadgeView;

 

import android.app.Activity;

import android.os.Bundle;

import android.view.LayoutInflater;

import android.view.View;

import android.widget.ImageView;

import android.widget.TabHost;

import android.widget.TextView;

 

/**

 * 

 * 项目名称：com.tabhostandbadgeview   

 * 类  名  称：MainActivity   

 * 类  描  述： TabHost导航菜单与BadgeView徽章视图的混合应用  

 * 创  建  人：fy   

 * 创建时间：2014-3-19 上午10:00:04   

 * Copyright (c) 方勇-版权所有

 */

public class MainActivity extends Activity {

 

/* TabHost导航菜单 */

private TabHost mTab;

 

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

initTabHost();

}

 

private void initTabHost() {

/* 最热导航菜单 */

View hot = (View) LayoutInflater.from(this).inflate(R.layout.tab_icon, null);

TextView home_tv = (TextView) hot.findViewById(R.id.tv);

home_tv.setText("最热");

ImageView home_iv = (ImageView) hot.findViewById(R.id.iv);

home_iv.setImageResource(R.drawable.tab_1);

 

/* 最新上架导航菜单 */

View latest = (View) LayoutInflater.from(this).inflate(R.layout.tab_icon, null);

TextView setting_tv = (TextView) latest.findViewById(R.id.tv);

setting_tv.setText("最新");

ImageView setting_iv = (ImageView) latest.findViewById(R.id.iv);

setting_iv.setImageResource(R.drawable.tab_2);

 

/* 推荐导航菜单 */

View ok = (View) LayoutInflater.from(this).inflate(R.layout.tab_icon2, null);

TextView ok_tv = (TextView) ok.findViewById(R.id.tv);

ok_tv.setText("推荐");

ImageView ok_iv = (ImageView) ok.findViewById(R.id.iv);

ok_iv.setImageResource(R.drawable.tab_3);

mTab = (TabHost) findViewById(R.id.mtabs);

mTab.setup();

 

mTab.addTab(mTab.newTabSpec("01").setIndicator(hot).setContent(R.id.tab1));

mTab.addTab(mTab.newTabSpec("02").setIndicator(latest).setContent(R.id.tab2));

mTab.addTab(mTab.newTabSpec("03").setIndicator(ok).setContent(R.id.tab3));

 

/* 徽章视图,停留在推荐导航菜单右上角 */

BadgeView badge = new BadgeView(this, ok_iv);

badge.setText("10");

badge.setBadgePosition(BadgeView.POSITION_TOP_RIGHT);

badge.show();

}

}

<!--EndFragment-->