您好,登錄后才能下訂單哦!
超簡單,幾行代碼搞定Android底部導航欄—–應項目需求以及小伙伴的留言,新加了兩個方法:
底部導航欄的實現也不難,就是下邊是幾個Tab切換,上邊一般是一個FrameLayout,然后FrameLayout中切換fragment。
網上有不少關于Android底部導航欄的文章,不過好像都只是關于下邊Tab切的,沒有實現Tab與fragment的聯動,用的時候還要自己手寫這部分代碼,對我這個比較懶(據說,懶是程序員的一種美德_#)得程序員來說,這是不能忍的。
下邊就來說說我的BottomTabBar吧。
這就是我以前封裝過的BottomTabBar的效果圖,現在就從這張效果圖開始,先分析一下,都需要設置那些參數吧。
1、BottomTabBar的整體背景
雖然一般這里都是用白色或者接近白色的淺色調作為背景,但我們也不能給他固定死,要提供這樣的一個方法,讓使用者可以把背景設置成任何的顏色。
2、圖片
這里不僅要傳入一個圖片,還要做圖片做一些設置:
3、 文字
與圖片類似,文字也需要做一些設置:
4、 顏色
文字和圖片的顏色都是只有兩種,一種是選中狀態下的,一種是未選中的,我們可以在這里統一設置,提供一個方法就可以了
5、邊距
這里需要設置三個地方的邊距:
6、分割線
上邊說到了,圖片上邊需要設置分割線,當然,這只是部分使用者需要設置的,所以我們需要提供一個方法,用來設置是否顯示分割線。此外還要設置分割線的高度以及其背景顏色
7、fragment
我這個BottomTabBar既然是要與fragment聯動的,所以必須要傳入一個fragment
大體的參數就是需要這些了,下面上代碼:
GitHub代碼連接
用法也簡單,就像標題說的幾行代碼就可以搞定:
引用方式:
compile 'com.hjm:BottomTabBar:1.0.0'
1. 首先是XML文件代碼:
<com.hjm.bottomtabbar.BottomTabBar android:id="@+id/bottom_tab_bar" android:layout_width="match_parent" android:layout_height="match_parent"/>
簡單吧,就這么一個控件就可以了。
當然,你要是想進行一些屬性設置的話,需要加上命名空間
xmlns:hjm="http://schemas.android.com/apk/res-auto"
下面就開始詳細的解釋一下每個參數的含義以及用法:
參數名 | 涵義 |
---|---|
tab_bar_background | BottomTabBar的整體背景顏色 |
tab_img_width | 圖片寬度 |
tab_img_height | 圖片高度 |
tab_font_size | 文字尺寸 |
tab_padding_top | 上邊距 |
tab_img_font_padding | 圖片文字間隔 |
tab_padding_bottom | 下邊距 |
tab_isshow_divider | 是否顯示分割線 |
tab_divider_height | 分割線高度 |
tab_divider_background | 分割線背景 |
tab_selected_color | 選中的顏色 |
tab_unselected_color | 未選中的顏色 |
這些參數可以指接在XML文件里設置
<com.hjm.bottomtabbar.BottomTabBar android:id="@+id/bottom_tab_bar" android:layout_width="match_parent" android:layout_height="match_parent" hjm:tab_divider_background="#FF0000" hjm:tab_divider_height="5dp" hjm:tab_font_size="6sp" hjm:tab_img_font_padding="0dp" hjm:tab_img_height="30dp" hjm:tab_img_width="30dp" hjm:tab_isshow_divider="true" hjm:tab_padding_bottom="5dp" hjm:tab_padding_top="8dp" hjm:tab_selected_color="#000000" hjm:tab_unselected_color="@color/colorPrimary" />
2. Activity文件代碼:
mBottomTabBar = (BottomTabBar) findViewById(R.id.bottom_tab_bar); mBottomTabBar.init(getSupportFragmentManager()) .addTabItem("第一項", R.mipmap.ic_launcher, OneFragment.class) .addTabItem("第二項", R.mipmap.ic_launcher, TwoFragment.class) .addTabItem("第三項", R.mipmap.ic_launcher, ThreeFragment.class) .addTabItem("第四項", R.mipmap.ic_launcher, FourFragment.class);
也很簡單,是吧。
這里簡單的提一句,這個init ( getSupportFragmentManager() )
方法一定要第一個調用,沒有這個初始化,后邊什么也做不了。
或許大家也看出來了,這個init()方法里,我們需要傳入一個FragmentManager,而且還是V4包下的,所以,在使用Activity的時候需要注意一下。
下邊是一些方法的使用,都加了注釋了
/** * 設置圖片的尺寸 * <p> * 此方法必須在addTabItem()之前調用 * * @param width 寬度 px * @param height 高度 px * @return */ setImgSize(float width, float height) /** * 設置文字的尺寸 * <p> * 此方法必須在addTabItem()之前調用 * * @param textSize 文字的尺寸 sp * @return */ setFontSize(float textSize) /** * 設置Tab的padding值 * <p> * 此方法必須在addTabItem()之前調用 * * @param top 上邊距 px * @param middle 文字圖片的距離 px * @param bottom 下邊距 px * @return */ setTabPadding(float top, float middle, float bottom) /** * 設置選中未選中的顏色 * <p> * 此方法必須在addTabItem()之前調用 * * @param selectColor 選中的顏色 * @param unSelectColor 未選中的顏色 * @return */ setChangeColor(@ColorInt int selectColor, @ColorInt int unSelectColor) /** * 設置BottomTabBar的整體背景 * * @param color 背景顏色 * @return */ setTabBarBackgroundColor(@ColorInt int color) /** * 是否顯示分割線 * * @param isShowDivider * @return */ isShowDivider(boolean isShowDivider) /** * 設置分割線的高度 * * @param height * @return */ setDividerHeight(float height) /** * 設置分割線的顏色 * * @param color * @return */ setDividerColor(@ColorInt int color) /** * 添加TabItem * * @param name 文字 * @param drawable 圖片 * @param fragmentClass fragment * @return */ addTabItem(String name, Drawable drawable, Class fragmentClass)
值得注意的是前四個方法必須在addTabItem()
之前調用,如果放在addTabItem()
之后調用的話,就沒有任何的效果了。
正確用法如下:
mBottomTabBar.init(getSupportFragmentManager()) .setImgSize(50,50) .setFontSize(8) .setTabPadding(4,6,10) .setChangeColor(Color.DKGRAY,Color.RED) .addTabItem("第一項", R.mipmap.ic_launcher, OneFragment.class) .addTabItem("第二項", R.mipmap.ic_launcher, TwoFragment.class) .addTabItem("第三項", R.mipmap.ic_launcher, ThreeFragment.class) .addTabItem("第四項", R.mipmap.ic_launcher, FourFragment.class) .setTabBarBackgroundColor(Color.WHITE) .isShowDivider(false);
總結
以上所述是小編給大家介紹的超簡單的幾行代碼搞定Android底部導航欄功能,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對億速云網站的支持!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。