首先,看下要兼容的Action bar的效果圖吧.
1、想法是這塊只做1個佈局文件,具體頁面在用的時候include進來就好。
2、分析這個通用的佈局,標題要用RadioGroup去做,有幾個標題就顯示幾個RadioButton,右邊功能按鈕的方法類似,只是用LinearLayout
上代碼 common_header.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="43dp"
android:background="@color/green_dark" >
<Button
android:id="@+id/btn_header_left"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="@drawable/btn_back_common" />
<RadioGroup
android:id="@+id/rg_header_radioButtons"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:orientation="horizontal" >
<RadioButton
android:id="@+id/rb_header_tab0"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:button="@null"
android:gravity="center"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:textColor="@color/white"
android:visibility="gone" />
<RadioButton
android:id="@+id/rb_header_tab1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:button="@null"
android:gravity="center"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:textColor="@color/white"
android:visibility="gone" />
<RadioButton
android:id="@+id/rb_header_tab2"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:button="@null"
android:gravity="center"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:textColor="@color/white"
android:visibility="gone" />
</RadioGroup>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
>
<Button
android:id="@+id/btn_header_right2"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:textColor="@color/white"
android:visibility="gone"
/>
<Button
android:id="@+id/btn_header_right1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:textColor="@color/white"
android:visibility="gone" />
</LinearLayout>
</RelativeLayout>
public class CommonHeader {
/**
* 類標識.
*/
private static final String TAG = TAGBuilder.build(CommonHeader.class);
/**
* 上下文.
*/
private Context mContext;
/**
* 單選按鈕容器.
*/
private RadioGroup mRadioGroup;
/**
* 左按鈕.
*/
private Button mLeftBtn;
/**
* 右按鈕.
*/
private Button mRightBtns[];
/**
* 右按鈕id數組.
*/
private int rightIds[];
/**
* 單選按鈕id數組.
*/
private int radioIds[];
/**
* 單選按鈕數組.
*/
private RadioButton mTabRbs[];
/**
* tab切換的監聽.
*/
private OnTabChangeListener mListener;
/**
* Activity裏用的構造器.
*
* @param activity 能調findViewById的對象,這裏是Activity.
*/
public CommonHeader(Activity activity) {
super();
mContext = activity;
mRadioGroup = (RadioGroup) activity
.findViewById(R.id.rg_header_radioButtons);
mLeftBtn = (Button) activity.findViewById(R.id.btn_header_left);
rightIds = new int[]{R.id.btn_header_right1, R.id.btn_header_right2};
mRightBtns = new Button[rightIds.length];
for (int i = 0; i < rightIds.length; i++) {
mRightBtns[i] = (Button) activity.findViewById(rightIds[i]);
}
radioIds = new int[]{R.id.rb_header_tab0, R.id.rb_header_tab1,
R.id.rb_header_tab2};
mTabRbs = new RadioButton[radioIds.length];
for (int i = 0; i < radioIds.length; i++) {
mTabRbs[i] = (RadioButton) activity.findViewById(radioIds[i]);
}
}
/**
* Fragment裏用的構造器.
*
* @param context 上下文.
* @param view 能調findViewById的對象,這裏是view.
*/
public CommonHeader(Context context, View view) {
super();
mContext = context;
mRadioGroup = (RadioGroup) view
.findViewById(R.id.rg_header_radioButtons);
mLeftBtn = (Button) view.findViewById(R.id.btn_header_left);
rightIds = new int[]{R.id.btn_header_right1, R.id.btn_header_right2};
mRightBtns = new Button[rightIds.length];
for (int i = 0; i < rightIds.length; i++) {
mRightBtns[i] = (Button) view.findViewById(rightIds[i]);
}
radioIds = new int[]{R.id.rb_header_tab0, R.id.rb_header_tab1,
R.id.rb_header_tab2};
mTabRbs = new RadioButton[radioIds.length];
for (int i = 0; i < radioIds.length; i++) {
mTabRbs[i] = (RadioButton) view.findViewById(radioIds[i]);
}
}
/**
* 設置標題<br>
* 可以設置多個標題<br>
* 多個標題間用tab隔開.
*
* @param titles 標題名稱組.
*/
public void setTitle(String... titles) {
for (int i = 0; i < titles.length; i++) {
LogCat.v(TAG+titles[i]);
mTabRbs[i].setText(titles[i]);
mTabRbs[i].setVisibility(View.VISIBLE);
mTabRbs[i].setTextSize(20f);
}
}
/**
* 設置默認選擇哪個tab頁.
*
* @param position 第幾個,默認從0開始.
*/
public void setCheckPosition(int position) {
mTabRbs[position].setChecked(true);
// mTabRbs[position].setBackgroundColor(mContext.getResources()
// .getColor(R.color.green_00B797));
}
/**
* 設置tab切換監聽器.
*
* @param listener tab切換的監聽器.
*/
public void setListener(OnTabChangeListener listener) {
this.mListener = listener;
mRadioGroup.setOnCheckedChangeListener(new OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
for (int i = 0; i < radioIds.length; i++) {
if (checkedId == radioIds[i]) {
mTabRbs[i].setBackgroundColor(mContext.getResources()
.getColor(R.color.green_00B797));
if (mListener != null) {
mListener.onTabChanged(i);
}
} else {
mTabRbs[i].setBackgroundColor(mContext.getResources()
.getColor(R.color.green_dark));
}
}
}
});
}
/**
* 獲取左按鈕.
*
* @return 左邊按鈕.
*/
public Button getLeftBtn() {
return mLeftBtn;
}
/**
* 設置右按鈕的背景圖片.
*
* @param resId 右邊按鈕的圖標組(R.drawable裏的).
*/
public void setRightBtnBackgroundResource(int... resId) {
for (int i = 0; i < resId.length; i++) {
mRightBtns[i].setBackgroundResource(resId[i]);
mRightBtns[i].setVisibility(View.VISIBLE);
}
}
/**
* 根據位置獲取右按鈕.
*
* @return 右邊按鈕.
*/
public Button getRightBtn(int position) {
if (position < mRightBtns.length)
return mRightBtns[position];
else return null;
}
/**
* 獲取選中的tab是第幾個<br>
* 從0開始計.
*
* @return 獲取選中的位置,從0開始.
*/
public int getCheckPosition() {
int postion = -1;
for (int i = 0; i < radioIds.length; i++) {
if (mRadioGroup.getCheckedRadioButtonId() == radioIds[i]) {
postion = i;
}
}
return postion;
}
/**
* TAB切換監聽.
*
* @author fengdianxun
*/
public interface OnTabChangeListener {
/**
* 當tab切換髮生時.
*
* @param position 位置.
*/
void onTabChanged(int position);
}
}
4、在具體頁面的xml只要include一下,如下
<include layout="@layout/common_header" />
5、具體頁面java部分
CommonHeader mHeader = new CommonHeader(this);
mBackBtn = mHeader.getLeftBtn();
mHeader.setTitle("One", "Two");
mFragments = new Fragment[]{new OneFragment(),new TwoFragment()};
mHeader.setListener(new CommonHeader.OnTabChangeListener() {
@Override
public void onTabChanged(int position) {
changeFragment(mFragments[position]);
}
});
mHeader.setCheckPosition(0);
mHeader.setRightBtnBackgroundResource(R.drawable.icon1,R.drawable.icon2);
btn1 = mHeader.getRightBtn(0);
btn2 = mHeader.getRightBtn(1);
6、大致就是這個樣子,我相信大家應該懂了我思路了。
Android開發交流羣 QQ羣號223919243 (未滿)