Android自定义TabBar

转载请说明出处:

我发现现在的移动开发界面都被iOS主导了,UI动不动设计出来的东西都是ios的风格,,对于一个做Android的程序员来说甚是苦恼啊,为了适应这种环境和氛围,今天我们来自定义一个TabBar,这个是移动开发很常用的一个组件。

<?xml version="1.0" encoding="utf-8"?><resources><!– TabBarItem –><declare-styleable name="TabBarItem"><attr name="checked_item" format="boolean"></attr><attr name="nomal_icon" format="reference"></attr><attr name="check_icon" format="reference"></attr><attr name="text" format="string"></attr><attr name="text_size" format="dimension"></attr><attr name="nomal_color" format="color"></attr><attr name="check_color" format="color"></attr></declare-styleable></resources>定义界面xml文件<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android=""xmlns:tools=""xmlns:hyman=""android:layout_width="match_parent"android:layout_height="match_parent"android:background="@color/app_base_nomal_background_color"android:orientation="vertical" ><FrameLayoutandroid:id="@+id/fragment_container"android:layout_width="match_parent"android:layout_height="0dip"android:layout_weight="1"/><Viewandroid:layout_width="match_parent"android:layout_height="1px"android:background="@color/color_app_base_7"/><LinearLayoutandroid:layout_width="match_parent"android:layout_height="60dip"android:background="@color/main_bottom_tab_bg_color"android:orientation="horizontal"><com.xxx.xx.view.TabBarItemandroid:id="@+id/id_indicator_one"android:layout_width="0dp"android:layout_height="fill_parent"android:layout_weight="1"hyman:checked_item="true"hyman:nomal_icon="@drawable/tab_bar_home_normal"hyman:check_icon="@drawable/tab_bar_home_current"hyman:text="@string/activity_main_tab1_title"hyman:text_size="@dimen/app_nomal_text_size"hyman:nomal_color="@color/color_app_base_2"hyman:check_color="@color/color_app_base_1"/><com.xxx.xx.view.TabBarItemandroid:id="@+id/id_indicator_two"android:layout_width="0dp"android:layout_height="fill_parent"android:layout_weight="1"hyman:checked_item="false"hyman:nomal_icon="@drawable/tab_bar_market_normal"hyman:check_icon="@drawable/tab_bar_market_current"hyman:text="@string/activity_main_tab2_title"hyman:text_size="@dimen/app_nomal_text_size"hyman:nomal_color="@color/color_app_base_2"hyman:check_color="@color/color_app_base_1"/><com.xxx.xx.view.TabBarItemandroid:id="@+id/id_indicator_three"android:layout_width="0dp"android:layout_height="fill_parent"android:layout_weight="1"hyman:checked_item="false"hyman:nomal_icon="@drawable/tab_bar_market_normal"hyman:check_icon="@drawable/tab_bar_market_current"hyman:text="@string/activity_main_tab3_title"hyman:text_size="@dimen/app_nomal_text_size"hyman:nomal_color="@color/color_app_base_2"hyman:check_color="@color/color_app_base_1"/><com.xxx.xx.view.TabBarItemandroid:id="@+id/id_indicator_four"android:layout_width="0dp"android:layout_height="fill_parent"android:layout_weight="1"hyman:checked_item="false"hyman:nomal_icon="@drawable/tab_bar_basket_normal"hyman:check_icon="@drawable/tab_bar_basket_current"hyman:text="@string/activity_main_tab4_title"hyman:text_size="@dimen/app_nomal_text_size"hyman:nomal_color="@color/color_app_base_2"hyman:check_color="@color/color_app_base_1"/><com.xxx.xx.view.TabBarItemandroid:id="@+id/id_indicator_five"android:layout_width="0dp"android:layout_height="fill_parent"android:layout_weight="1"hyman:checked_item="false"hyman:nomal_icon="@drawable/tab_bar_personal_normal"hyman:check_icon="@drawable/tab_bar_personal_current"hyman:text="@string/activity_main_tab5_title"hyman:text_size="@dimen/app_nomal_text_size"hyman:nomal_color="@color/color_app_base_2"hyman:check_color="@color/color_app_base_1"/></LinearLayout></LinearLayout>

自定义TabBarItem

package com.guozha.buy.view;import android.content.Context;import android.content.res.TypedArray;import android.graphics.Bitmap;import android.graphics.drawable.BitmapDrawable;import android.util.AttributeSet;import android.util.TypedValue;import android.view.Gravity;import android.widget.ImageView;import android.widget.ImageView.ScaleType;import android.widget.LinearLayout;import android.widget.TextView;import com.guozha.buy.R;import com.guozha.buy.util.DimenUtil;import com.guozha.buy.util.LogUtil;/** * TabBar的按钮控件 * @author PeggyTong * */public class TabBarItem extends LinearLayout{private static final int ICON_HEIGHT = 32;private boolean isChoosed;private String mTextContent;private int mTextSize;private int mTextNomalColor;private int mTextCheckColor;private Bitmap mNomalIcon;private Bitmap mCheckIcon;private ImageView mBtnImage;private TextView mBtnText;public TabBarItem(Context context) {this(context, null);}public TabBarItem(Context context, AttributeSet attrs) {this(context, attrs, 0);}public TabBarItem(Context context, AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);initTabBarItem(context, attrs);}/** * 初始化 * @param context * @param attrs */private void initTabBarItem(Context context, AttributeSet attrs) {initTabItem(context, attrs); //获取尺寸addChilds(context);//添加子viewchangeCheckedStatus(); //根据状态显示当前view}/** * 添加子控件 * @param context */private void addChilds(Context context) {setOrientation(LinearLayout.VERTICAL);setGravity(Gravity.CENTER);mBtnImage = new ImageView(context);mBtnImage.setScaleType(ScaleType.CENTER_INSIDE);mBtnImage.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, DimenUtil.dp2px(context, ICON_HEIGHT)));mBtnText = new TextView(context);LogUtil.e("mTextSize = " + mTextSize);mBtnText.setText(mTextContent);mBtnText.setTextSize(TypedValue.COMPLEX_UNIT_PX, mTextSize);mBtnText.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT));addView(mBtnImage);addView(mBtnText);}/** * 改变当前显示状态 */private void changeCheckedStatus() {if(isChoosed){mBtnImage.setImageBitmap(mCheckIcon);mBtnText.setTextColor(mTextCheckColor);}else{mBtnImage.setImageBitmap(mNomalIcon);mBtnText.setTextColor(mTextNomalColor);}}/** * 设置为选中状态 */public void setCheckedItem(){isChoosed = true;changeCheckedStatus();}/** * 设置为未选中状态 */public void setDisCheckedItem(){isChoosed = false;changeCheckedStatus();}/** * 初始配置的数据 * @param context * @param attrs */private void initTabItem(Context context, AttributeSet attrs){TypedArray typeArr = context.obtainStyledAttributes(attrs, R.styleable.TabBarItem);int count = typeArr.getIndexCount();for(int i = 0; i < count; i++){int attr = typeArr.getIndex(i);switch(attr){case R.styleable.TabBarItem_checked_item:isChoosed = typeArr.getBoolean(attr, false);break;case R.styleable.TabBarItem_text:mTextContent = typeArr.getString(attr);break;case R.styleable.TabBarItem_text_size:mTextSize = (int) typeArr.getDimension(attr, TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, 12, getResources().getDisplayMetrics()));break;case R.styleable.TabBarItem_nomal_color:mTextNomalColor = typeArr.getColor(attr, getResources().getColor(R.color.color_app_base_2));break;case R.styleable.TabBarItem_check_color:mTextCheckColor = typeArr.getColor(attr, getResources().getColor(R.color.color_app_base_1));break;case R.styleable.TabBarItem_nomal_icon:mNomalIcon = ((BitmapDrawable)typeArr.getDrawable(attr)).getBitmap();break;case R.styleable.TabBarItem_check_icon:mCheckIcon = ((BitmapDrawable)typeArr.getDrawable(attr)).getBitmap();break;}}typeArr.recycle();}}如果是多个Tab切换,可以使用Fragment酒般的思念,一饮就醉,醉时就用全部的热情读这忧伤的月色,

Android自定义TabBar

相关文章:

你感兴趣的文章:

标签云: