我沒有時間再維護這個了。我基本上是匆忙編寫了整個庫,沒有進行測試,而當時我是一個認真的專家初學者。因此,存在許多不可預測的移動部件,並且測試可能也不是那麼好。真的不知道,因為我已經很久沒有碰過這個了。
我建議您使用 Google 的官方 BottomNavigationView 並敦促他們實現您需要的功能。或使用另一個第三方函式庫。
先前的最新版本可以在 v1 分支中找到
如何貢獻
變更日誌
模仿新的 Material Design 底部導航模式的自訂視圖元件。
沒有。 minSDK 版本為API 等級 11 (Honeycomb)。
compile ' com.roughike:bottom-bar:2.3.1 '
行家:
< dependency >
< groupId >com.roughike</ groupId >
< artifactId >bottom-bar</ artifactId >
< version >2.3.1</ version >
< type >pom</ type >
</ dependency >
您可以透過編寫 XML 資源檔案來新增項目。
圖示必須是完全不透明、純黑色、24dp 並且沒有填充。例如,使用 Android Asset Studio 通用圖示產生器,選擇「TRIM」並確保填入 0dp。您的圖示應如下所示:
在 XML 資源檔案中定義標籤。
res/xml/bottombar_tabs.xml:
< tabs >
< tab
id = " @+id/tab_favorites "
icon = " @drawable/ic_favorites "
title = " Favorites " />
< tab
id = " @+id/tab_nearby "
icon = " @drawable/ic_nearby "
title = " Nearby " />
< tab
id = " @+id/tab_friends "
icon = " @drawable/ic_friends "
title = " Friends " />
</ tabs >
然後,將 BottomBar 新增到您的佈局中,並為其指定選項卡 xml 檔案的資源 ID。
佈局/activity_main.xml
< RelativeLayout xmlns : android = " http://schemas.android.com/apk/res/android "
android : layout_width = " match_parent "
android : layout_height = " match_parent "
xmlns : app = " http://schemas.android.com/apk/res-auto " >
<!-- This could be your fragment container, or something -->
< FrameLayout
android : id = " @+id/contentContainer "
android : layout_width = " match_parent "
android : layout_height = " match_parent "
android : layout_above = " @+id/bottomBar " />
< com .roughike.bottombar.BottomBar
android : id = " @+id/bottomBar "
android : layout_width = " match_parent "
android : layout_height = " 60dp "
android : layout_alignParentBottom = " true "
app : bb_tabXmlResource = " @xml/bottombar_tabs " />
</ RelativeLayout >
預設情況下,選項卡不會執行任何操作,除非您偵聽選擇事件並在選擇選項卡時執行某些操作。
MainActivity.java:
public class MainActivity extends Activity {
@ Override
protected void onCreate ( @ Nullable Bundle savedInstanceState ) {
super . onCreate ( savedInstanceState );
setContentView ( R . layout . activity_main );
BottomBar bottomBar = ( BottomBar ) findViewById ( R . id . bottomBar );
bottomBar . setOnTabSelectListener ( new OnTabSelectListener () {
@ Override
public void onTabSelected ( @ IdRes int tabId ) {
if ( tabId == R . id . tab_favorites ) {
// The tab with id R.id.tab_favorites was selected,
// change your content accordingly.
}
}
});
}
}
如果您想監聽重選事件,請依照下列步驟操作:
bottomBar . setOnTabReselectListener ( new OnTabReselectListener () {
@ Override
public void onTabReSelected ( @ IdRes int tabId ) {
if ( tabId == R . id . tab_favorites ) {
// The tab with id R.id.tab_favorites was reselected,
// change your content accordingly.
}
}
});
如果您想有條件地取消任何選項卡的選擇,您絕對可以。只需將TabSelectionInterceptor
指派給 BottomBar,並從shouldInterceptTabSelection()
方法傳回 true 即可。
bottomBar . setTabSelectionInterceptor ( new TabSelectionInterceptor () {
@ Override
public boolean shouldInterceptTabSelection ( @ IdRes int oldTabId , @ IdRes int newTabId ) {
if ( newTabId == R . id . tab_pro_feature && ! userHasProVersion ()) {
startProVersionPurchaseFlow ();
return true ;
}
return false ;
}
});
如果您希望在選擇特定選項卡時具有不同的圖標,只需使用狀態清單可繪製物件即可。
res/drawable/my_tab_icon.xml
< selector xmlns : android = " http://schemas.android.com/apk/res/android " >
< item android : drawable = " @drawable/ic_myicon_selected " android : state_selected = " true " />
< item android : drawable = " @drawable/ic_myicon_default " android : state_selected = " false " />
</ selector >
res/xml/bottombar_tabs.xml
...
< tab
id = " @+id/tab_favorites "
icon = " @drawable/my_tab_icon "
title = " Favorites " />
<!-- You can use @color resources too! -->
...
只需將barColorWhenSelected
新增至每個分頁即可。當選擇該選項卡時,整個 BottomBar 背景顏色會以漂亮的動畫變化。
res/xml/bottombar_tabs.xml
< tabs >
< tab
id = " @+id/tab_favorites "
icon = " @drawable/ic_favorites "
title = " Favorites "
barColorWhenSelected = " #5D4037 " />
<!-- You can use @color resources too! -->
</ tabs >
首先,定義一個作為主應用程式主題的子主題的樣式:
res/values-v21/styles.xml
< style name = " AppTheme.TransNav " parent = " AppTheme " >
< item name = " android:navigationBarColor " >@android:color/transparent</ item >
< item name = " android:windowTranslucentNavigation " >true</ item >
< item name = " android:windowDrawsSystemBarBackgrounds " >true</ item >
</ style >
您還必須製作相同主題的存根版本,以避免在 Lollipop 之前的 API 層級中發生當機:
資源/值/styles.xml
< style name = " AppTheme.TransNav " parent = " AppTheme " />
也要在您的values-land-v21.xml
中包含相同的存根,以避免透明的導航列和景觀上的奇怪行為。
res/values-land-v21.xml:
< style name = " AppTheme.TransNav " parent = " AppTheme " />
將AndroidManifest.xml
中的主題套用到您的 Activity。
AndroidManifest.xml:
< activity android : name = " .MyAwesomeActivity " android : theme = " @style/AppTheme.TransNav " />
最後,設定bb_behavior
以包含underNavbar
標誌,然後就可以開始了!
Activity_my_awesome.xml:
< com .roughike.bottombar.BottomBar
android : id = " @+id/bottomBar "
android : layout_width = " match_parent "
android : layout_height = " 56dp "
android : layout_alignParentBottom = " true "
app : bb_tabXmlResource = " @xml/my_awesome_bottombar_tabs "
app : bb_behavior = " underNavbar " />
在res/layout-sw600dp
資料夾中為您的 Activity 指定不同的佈局,並將bb_tabletMode
設為 true。
res/layout-sw600dp/activity_main.xml:
< RelativeLayout
xmlns : android = " http://schemas.android.com/apk/res/android "
xmlns : app = " http://schemas.android.com/apk/res-auto "
android : layout_width = " match_parent "
android : layout_height = " match_parent " >
< com .roughike.bottombar.BottomBar
android : id = " @+id/bottomBar "
android : layout_width = " wrap_content "
android : layout_height = " match_parent "
android : layout_alignParentLeft = " true "
app : bb_tabXmlResource = " @xml/bottombar_tabs_three "
app : bb_tabletMode = " true " />
<!-- This could be your fragment container, or something -->
< FrameLayout
android : id = " @+id/contentContainer "
android : layout_width = " match_parent "
android : layout_height = " match_parent "
android : layout_toRightOf = " @+id/bottomBar " />
</ RelativeLayout >
簡單易行!
活動_main.xml:
< android .support.design.widget.CoordinatorLayout xmlns : android = " http://schemas.android.com/apk/res/android "
xmlns : app = " http://schemas.android.com/apk/res-auto "
android : layout_width = " match_parent "
android : layout_height = " match_parent " >
< android .support.v4.widget.NestedScrollView
android : id = " @+id/myScrollingContent "
android : layout_width = " match_parent "
android : layout_height = " match_parent " >
<!-- Your loooooong scrolling content here. -->
</ android .support.v4.widget.NestedScrollView>
< com .roughike.bottombar.BottomBar
android : id = " @+id/bottomBar "
android : layout_width = " match_parent "
android : layout_height = " 60dp "
android : layout_gravity = " bottom "
app : bb_tabXmlResource = " @xml/bottombar_tabs_three "
app : bb_behavior = " shy " />
</ android .support.design.widget.CoordinatorLayout>
您可以輕鬆新增徽章來顯示未讀訊息計數或新項目/任何您喜歡的內容。
BottomBarTab nearby = bottomBar . getTabWithId ( R . id . tab_nearby );
nearby . setBadgeCount ( 5 );
// Remove the badge when you're done with it.
nearby . removeBadge /();
< com .roughike.bottombar.BottomBar
android : id = " @+id/bottomBar "
android : layout_width = " match_parent "
android : layout_height = " 60dp "
android : layout_alignParentBottom = " true "
app : bb_tabXmlResource = " @xml/bottombar_tabs_three "
app : bb_tabletMode = " true "
app : bb_behavior = " shifting|shy|underNavbar "
app : bb_inActiveTabAlpha = " 0.6 "
app : bb_activeTabAlpha = " 1 "
app : bb_inActiveTabColor = " #222222 "
app : bb_activeTabColor = " @color/colorPrimary "
app : bb_badgesHideWhenActive = " true "
app : bb_titleTextAppearance = " @style/MyTextAppearance "
app : bb_titleTypeFace = " fonts/MySuperDuperFont.ttf "
app : bb_showShadow = " true " />
values/xml/
中shifting
:所選選項卡比其餘選項卡更寬。 shy
:將 BottomBar 放入 CoordinatorLayout 中,它會在滾動時自動隱藏! underNavbar
:在導覽列下方繪製BottomBar!fonts/MySuperDuperFont.ttf
。在這種情況下,您的字型路徑將類似於src/main/assets/fonts/MySuperDuperFont.ttf
,但您只需要提供fonts/MySuperDuperFont.ttf
,因為資源資料夾會自動為您填入。< tab
id = " @+id/tab_recents "
title = " Recents "
icon = " @drawable/empty_icon "
inActiveColor = " #00FF00 "
activeColor = " #FF0000 "
barColorWhenSelected = " #FF0000 "
badgeBackgroundColor = " #FF0000 "
badgeHidesWhenActive = " true " />
向我發送帶有修改後的 README.md 的拉取請求以獲得好評!
請隨意建立問題和拉取請求。
在建立拉取請求時,越多越好:我希望看到按功能分隔的十個小拉取請求,而不是將所有這些合併為一個巨大的拉取請求。
BottomBar library for Android
Copyright (c) 2016 Iiro Krankka (http://github.com/roughike).
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.