Android 新的底部导航栏或底部导航视图

看到新的指南出来了,并在 google photos最新的应用程序中使用。 不知道如何使用新的底部导航栏。 看了新的支持自由党,没找到任何线索。

enter image description here

找不到任何正式样本。

如何使用新的底部酒吧? 不想做任何自定义。

301372 次浏览

我想你可能在找这个。

下面是一个简短的开始片段:

public class MainActivity extends AppCompatActivity {
private BottomBar mBottomBar;


@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);


// Notice how you don't use the setContentView method here! Just
// pass your layout to bottom bar, it will be taken care of.
// Everything will be just like you're used to.
mBottomBar = BottomBar.bind(this, R.layout.activity_main,
savedInstanceState);


mBottomBar.setItems(
new BottomBarTab(R.drawable.ic_recents, "Recents"),
new BottomBarTab(R.drawable.ic_favorites, "Favorites"),
new BottomBarTab(R.drawable.ic_nearby, "Nearby"),
new BottomBarTab(R.drawable.ic_friends, "Friends")
);


mBottomBar.setOnItemSelectedListener(new OnTabSelectedListener() {
@Override
public void onItemSelected(final int position) {
// the user selected a new tab
}
});
}


@Override
protected void onSaveInstanceState(Bundle outState) {
super.onSaveInstanceState(outState);
mBottomBar.onSaveInstanceState(outState);
}
}

这里是参考链接。

Https://github.com/roughike/bottombar

编辑新版本。

底部导航视图已经出现在材质设计指南中有一段时间了,但是对于我们来说将它实现到我们的应用程序中并不容易。一些应用程序已经构建了自己的解决方案,而其他应用程序则依赖第三方开源库来完成工作。现在,设计支持库看到了这个底部导航栏的添加,让我们深入了解一下如何使用它!

怎么用?

首先,我们需要更新我们的依赖项!

compile ‘com.android.support:design:25.0.0’

设计 xml。

<?xml version="1.0" encoding="utf-8"?>
<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">


<!-- Content Container -->


<android.support.design.widget.BottomNavigationView
android:id="@+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:itemBackground="@color/colorPrimary"
app:itemIconTint="@color/white"
app:itemTextColor="@color/white"
app:menu="@menu/bottom_navigation_main" />


</RelativeLayout>

根据需要创建菜单。

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
<item
android:id="@+id/action_favorites"
android:enabled="true"
android:icon="@drawable/ic_favorite_white_24dp"
android:title="@string/text_favorites"
app:showAsAction="ifRoom" />
<item
android:id="@+id/action_schedules"
android:enabled="true"
android:icon="@drawable/ic_access_time_white_24dp"
android:title="@string/text_schedules"
app:showAsAction="ifRoom" />
<item
android:id="@+id/action_music"
android:enabled="true"
android:icon="@drawable/ic_audiotrack_white_24dp"
android:title="@string/text_music"
app:showAsAction="ifRoom" />
</menu>

处理启用/禁用状态。创建选择器文件。

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:state_checked="true"
android:color="@color/colorPrimary" />
<item
android:state_checked="false"
android:color="@color/grey" />
</selector>

句柄单击事件。

BottomNavigationView bottomNavigationView = (BottomNavigationView)
findViewById(R.id.bottom_navigation);
        

bottomNavigationView.setOnNavigationItemSelectedListener(
new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()) {
case R.id.action_favorites:
                        

break;
case R.id.action_schedules:
                    

break;
case R.id.action_music:
                    

break;
}
return false;
}
});

编辑: 使用 Androidx,您只需在下面添加依赖项。

implementation 'com.google.android.material:material:1.2.0-alpha01'

布局

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:layout_gravity="bottom"
app:menu="@menu/bottom_navigation_menu"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
</FrameLayout>

如果你想了解更多关于它的方法和它是如何工作的 看看这个。

肯定会对你有帮助的。

我认为这也是有用的。

片段

public class MainActivity : AppCompatActivity, BottomNavigationBar.Listeners.IOnTabSelectedListener
{
private BottomBar _bottomBar;


protected override void OnCreate(Bundle bundle)
{
base.OnCreate(bundle);


SetContentView(Resource.Layout.MainActivity);


_bottomBar = BottomBar.Attach(this, bundle);
_bottomBar.SetItems(
new BottomBarTab(Resource.Drawable.ic_recents, "Recents"),
new BottomBarTab(Resource.Drawable.ic_favorites, "Favorites"),
new BottomBarTab(Resource.Drawable.ic_nearby, "Nearby")
);
_bottomBar.SetOnItemSelectedListener(this);
_bottomBar.HideShadow();
_bottomBar.UseDarkTheme(true);
_bottomBar.SetTypeFace("Roboto-Regular.ttf");


var badge = _bottomBar.MakeBadgeForTabAt(1, Color.ParseColor("#f02d4c"), 1);
badge.AutoShowAfterUnSelection = true;
}


public void OnItemSelected(int position)
{


}


protected override void OnSaveInstanceState(Bundle outState)
{
base.OnSaveInstanceState(outState);


// Necessary to restore the BottomBar's state, otherwise we would
// lose the current tab on orientation change.
_bottomBar.OnSaveInstanceState(outState);
}
}

连结

Https://github.com/pocheshire/bottomnavigationbar

它是为 Xamarin 开发人员移植到 C # 的 https://github.com/roughike/BottomBar

您还可以使用自定义选项卡视图的选项卡布局来实现这一点。

Custom_ tab. xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?attr/selectableItemBackground"
android:gravity="center"
android:orientation="vertical"
android:paddingBottom="10dp"
android:paddingTop="8dp">


<ImageView
android:id="@+id/icon"
android:layout_width="24dp"
android:layout_height="24dp"
android:scaleType="centerInside"
android:src="@drawable/ic_recents_selector" />


<TextView
android:id="@+id/title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:ellipsize="end"
android:maxLines="1"
android:textAllCaps="false"
android:textColor="@color/tab_color"
android:textSize="12sp"/>
</LinearLayout>

Activity _ main. xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">


<android.support.v4.view.ViewPager


android:id="@+id/view_pager"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />


<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
style="@style/AppTabLayout"
android:layout_width="match_parent"
android:layout_height="56dp"
android:background="?attr/colorPrimary" />


</LinearLayout>

MainActivity.java

public class MainActivity extends AppCompatActivity {
private TabLayout mTabLayout;


private int[] mTabsIcons = {
R.drawable.ic_recents_selector,
R.drawable.ic_favorite_selector,
R.drawable.ic_place_selector};




@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);


// Setup the viewPager
ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);
MyPagerAdapter pagerAdapter = new MyPagerAdapter(getSupportFragmentManager());
viewPager.setAdapter(pagerAdapter);


mTabLayout = (TabLayout) findViewById(R.id.tab_layout);
mTabLayout.setupWithViewPager(viewPager);


for (int i = 0; i < mTabLayout.getTabCount(); i++) {
TabLayout.Tab tab = mTabLayout.getTabAt(i);
tab.setCustomView(pagerAdapter.getTabView(i));
}


mTabLayout.getTabAt(0).getCustomView().setSelected(true);
}




private class MyPagerAdapter extends FragmentPagerAdapter {


public final int PAGE_COUNT = 3;


private final String[] mTabsTitle = {"Recents", "Favorites", "Nearby"};


public MyPagerAdapter(FragmentManager fm) {
super(fm);
}


public View getTabView(int position) {
// Given you have a custom layout in `res/layout/custom_tab.xml` with a TextView and ImageView
View view = LayoutInflater.from(MainActivity.this).inflate(R.layout.custom_tab, null);
TextView title = (TextView) view.findViewById(R.id.title);
title.setText(mTabsTitle[position]);
ImageView icon = (ImageView) view.findViewById(R.id.icon);
icon.setImageResource(mTabsIcons[position]);
return view;
}


@Override
public Fragment getItem(int pos) {
switch (pos) {


case 0:
return PageFragment.newInstance(1);


case 1:
return PageFragment.newInstance(2);
case 2:
return PageFragment.newInstance(3);


}
return null;
}


@Override
public int getCount() {
return PAGE_COUNT;
}


@Override
public CharSequence getPageTitle(int position) {
return mTabsTitle[position];
}
}


}

下载完整示例项目

您可以尝试其他备用库:-https://github.com/Ashok-Varma/BottomNavigation

<com.ashokvarma.bottomnavigation.BottomNavigationBar
android:layout_gravity="bottom"
android:id="@+id/bottom_navigation_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>


BottomNavigationBar bottomNavigationBar = (BottomNavigationBar) findViewById(R.id.bottom_navigation_bar);


bottomNavigationBar
.addItem(new BottomNavigationItem(R.drawable.ic_home_white_24dp, "Home"))
.addItem(new BottomNavigationItem(R.drawable.ic_book_white_24dp, "Books"))
.addItem(new BottomNavigationItem(R.drawable.ic_music_note_white_24dp, "Music"))
.addItem(new BottomNavigationItem(R.drawable.ic_tv_white_24dp, "Movies & TV"))
.addItem(new BottomNavigationItem(R.drawable.ic_videogame_asset_white_24dp, "Games"))
.initialise();

我创建了一个使用网格视图和菜单资源的私有类:

private class BottomBar {


private GridView mGridView;
private Menu     mMenu;
private BottomBarAdapter mBottomBarAdapter;
private View.OnClickListener mOnClickListener;


public BottomBar (@IdRes int gridviewId, @MenuRes int menuRes,View.OnClickListener onClickListener) {
this.mGridView = (GridView) findViewById(gridviewId);
this.mMenu = getMenu(menuRes);
this.mOnClickListener = onClickListener;


this.mBottomBarAdapter = new BottomBarAdapter();
this.mGridView.setAdapter(mBottomBarAdapter);
}


private Menu getMenu(@MenuRes int menuId) {
PopupMenu p = new PopupMenu(MainActivity.this,null);
Menu menu = p.getMenu();
getMenuInflater().inflate(menuId,menu);
return menu;
}


public GridView getGridView(){
return mGridView;
}


public void show() {
mGridView.setVisibility(View.VISIBLE);
mGridView.animate().translationY(0);
}


public void hide() {
mGridView.animate().translationY(mGridView.getHeight());
}






private class BottomBarAdapter extends BaseAdapter {


private LayoutInflater    mInflater;


public BottomBarAdapter(){
this.mInflater = LayoutInflater.from(MainActivity.this);
}


@Override
public int getCount() {
return mMenu.size();
}


@Override
public Object getItem(int i) {
return mMenu.getItem(i);
}


@Override
public long getItemId(int i) {
return 0;
}


@Override
public View getView(int i, View view, ViewGroup viewGroup) {


MenuItem item = (MenuItem) getItem(i);


if (view==null){
view = mInflater.inflate(R.layout.your_item_layout,null);
view.setId(item.getItemId());
}


view.setOnClickListener(mOnClickListener);
view.findViewById(R.id.bottomnav_icon).setBackground(item.getIcon());
((TextView) view.findViewById(R.id.bottomnav_label)).setText(item.getTitle());


return view;
}
}

Your _ menu. xml:

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@+id/item1_id"
android:icon="@drawable/ic_item1"
android:title="@string/title_item1"/>
<item android:id="@+id/item2_id"
android:icon="@drawable/ic_item2"
android:title="@string/title_item2"/>
...
</menu>

以及一个自定义布局项 your _ item _ lay.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_margin="16dp">
<ImageButton android:id="@+id/bottomnav_icon"
android:layout_width="24dp"
android:layout_height="24dp"
android:layout_gravity="top|center_horizontal"
android:layout_marginTop="8dp"
android:layout_marginBottom="4dp"/>
<TextView android:id="@+id/bottomnav_label"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|center_horizontal"
android:layout_marginBottom="8dp"
android:layout_marginTop="4dp"
style="@style/mystyle_label" />
</LinearLayout>

在你的主要活动中的使用:

BottomBar bottomBar = new BottomBar(R.id.YourGridView,R.menu.your_menu, mOnClickListener);

还有

private View.OnClickListener mOnClickListener = new View.OnClickListener() {
@Override
public void onClick(View view) {
switch (view.getId()) {
case R.id.item1_id:
//todo item1
break;
case R.id.item2_id:
//todo item2
break;
...
}
}
}

以及 lay_ activity. xml 中

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true">
...
<FrameLayout android:id="@+id/fragment_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"/>


<GridView android:id="@+id/bottomNav"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@color/your_background_color"
android:verticalSpacing="0dp"
android:horizontalSpacing="0dp"
android:numColumns="4"
android:stretchMode="columnWidth"
app:layout_anchor="@id/fragment_container"
app:layout_anchorGravity="bottom"/>
</android.support.design.widget.CoordinatorLayout>

您应该使用来自 v25 Android 支持库的 底部导航视图。 它表示应用程序的标准底部导航栏。

这里有一篇关于 Medium 的帖子,里面有一个 < strong > 循序渐进的指导: Https://medium.com/@hitherejoe/exploring-the-android-design-support-library-bottom-navigation-drawer-548de699e8e0#.9vmiekxze

在设计支持库的版本25中有一个新的官方 底部导航视图

Https://developer.android.com/reference/android/support/design/widget/bottomnavigationview.html 加上梯度 compile 'com.android.support:design:25.0.0'

XML

<android.support.design.widget.BottomNavigationView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:design="http://schema.android.com/apk/res/android.support.design"
android:id="@+id/navigation"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
design:menu="@menu/my_navigation_items" />

Google 在25.0.0版本的设计支持库之后发布了 BottomNavigationView。但它有以下局限性:

  1. 您不能删除标题和中心图标。
  2. 不能更改标题文本大小。
  3. 你无法控制自己的情绪,也无法控制自己的情绪
  4. 它没有触底导航行为: 所以没有通过协调器布局与 FAB 或 SnackBar 集成。
  5. 每个 menuItem 都是 FrameLayout 的纯扩展,所以它没有任何漂亮的圆形显示效果

因此,对于 BottomNavigationView 的第一个版本,您所能做的最大限度是: (不需要任何反思或自己实现 lib)。

enter image description here

所以,如果你想要这些。您可以使用类似 野餐/酒吧的第三部分库,或者自己实现这个库。

正如 Sanfford 提到的,谷歌推出了 底部导航视图作为 设计支援资料库版本25.0.0的一部分。他提到的限制大多是真实的,除了你可以改变视图的背景颜色,甚至文本颜色和图标色彩。当您添加超过4个项目时,它也有一个动画(遗憾的是,它不能手动启用或禁用)。

我写了一个关于它的详细的教程,包括一些例子和一个附带的知识库,你可以在这里阅读: Https://blog.autsoft.hu/now-you-can-use-the-bottom-navigation-view-in-the-design-support-library/


大概就是这样

你必须在你的应用程序级别 build.gradle中添加以下内容:

compile 'com.android.support:appcompat-v7:25.0.0'
compile 'com.android.support:design:25.0.0'

你可以像下面这样将它包含在你的布局中:

<android.support.design.widget.BottomNavigationView
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/bottom_navigation_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:itemBackground="@color/darkGrey"
app:itemIconTint="@color/bottom_navigation_item_background_colors"
app:itemTextColor="@color/bottom_navigation_item_background_colors"
app:menu="@menu/menu_bottom_navigation" />

您可以通过菜单资源指定项目,如下所示:

<?xml version="1.0" encoding="utf-8"?>
<menu
xmlns:android="http://schemas.android.com/apk/res/android">
<item
android:id="@+id/action_one"
android:icon="@android:drawable/ic_dialog_map"
android:title="One"/>
<item
android:id="@+id/action_two"
android:icon="@android:drawable/ic_dialog_info"
android:title="Two"/>
<item
android:id="@+id/action_three"
android:icon="@android:drawable/ic_dialog_email"
android:title="Three"/>
<item
android:id="@+id/action_four"
android:icon="@android:drawable/ic_popup_reminder"
android:title="Four"/>
</menu>

还可以将色彩和文本颜色设置为颜色列表,这样当前选定的项目就会突出显示:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">


<item
android:color="@color/colorAccent"
android:state_checked="false"/>
<item
android:color="@android:color/white"
android:state_checked="true"/>


</selector>

最后,您可以使用 OnNavigationItemSelectedListener 处理项的选择:

bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
Fragment fragment = null;
switch (item.getItemId()) {
case R.id.action_one:
// Switch to page one
break;
case R.id.action_two:
// Switch to page two
break;
case R.id.action_three:
// Switch to page three
break;
}
return true;
}
});

我已经提到了这个 github post和我已经设置了 three layoutsthree fragment页在底部标签栏。

FourButtonsActivity.java:

bottomBar.setFragmentItems(getSupportFragmentManager(), R.id.fragmentContainer,
new BottomBarFragment(LibraryFragment.newInstance(R.layout.library_fragment_layout), R.drawable.ic_update_white_24dp, "Recents"),
new BottomBarFragment(PhotoEffectFragment.newInstance(R.layout.photo_effect_fragment), R.drawable.ic_local_dining_white_24dp, "Food"),
new BottomBarFragment(VideoFragment.newInstance(R.layout.video_layout), R.drawable.ic_favorite_white_24dp, "Favorites")


);

设置徽章数量:

  BottomBarBadge unreadMessages = bottomBar.makeBadgeForTabAt(1, "#E91E63", 4);
unreadMessages.show();
unreadMessages.setCount(4);
unreadMessages.setAnimationDuration(200);
unreadMessages.setAutoShowAfterUnSelection(true);

Java:

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;


public class LibraryFragment extends Fragment {
private static final String STARTING_TEXT = "Four Buttons Bottom Navigation";


public LibraryFragment() {
}


public static LibraryFragment newInstance(int resource) {
Bundle args = new Bundle();
args.putInt(STARTING_TEXT, resource);


LibraryFragment sampleFragment = new LibraryFragment();
sampleFragment.setArguments(args);


return sampleFragment;
}


@Nullable
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {




View view = LayoutInflater.from(getActivity()).inflate(
getArguments().getInt(STARTING_TEXT), null);
return view;




}

我最初的答案是 BottomNavigationView,但现在有了 BottomAppBar。我在顶部添加了一个具有实现链接的部分。

底部应用程序栏

BottomAppBar支持浮动操作按钮。

enter image description here

来自 给你的图像。请参阅 文件本教程以获得设置 BottomAppBar的帮助。

底部导航视图

下面的完整示例演示如何使底部导航视图类似于问题中的图像。请参阅文档中的 底部导航

enter image description here

添加设计支持库

将这一行添加到应用程序的 建筑,等级文件中,紧挨着其他支持库。

implementation 'com.android.support:design:28.0.0'

将版本号替换为当前版本号。

创建活动布局

唯一特别的东西,我们已经添加到布局是 BottomNavigationView。若要在单击图标和文本时更改其颜色,可以使用 selector而不是直接指定颜色。为了简单起见,这里省略了。

Activity _ main. xml

<?xml version="1.0" encoding="utf-8"?>
<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">


<android.support.design.widget.BottomNavigationView
android:id="@+id/bottom_navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
app:menu="@menu/bottom_nav_menu"
app:itemBackground="@color/colorPrimary"
app:itemIconTint="@android:color/white"
app:itemTextColor="@android:color/white" />


</RelativeLayout>

注意,我们使用 layout_alignParentBottom实际上将它放在底部。

定义菜单项

上面用于底部导航视图的 xml 引用了 bottom_nav_menu。这就是在我们的视图中定义每个项的内容。我们会成功的。所有你必须做的是 添加菜单资源就像你会为一个动作栏或工具栏。

Bottom _ nav _ menu. xml

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">


<item
android:id="@+id/action_recents"
android:enabled="true"
android:icon="@drawable/ic_action_recents"
android:title="Recents"
app:showAsAction="ifRoom" />


<item
android:id="@+id/action_favorites"
android:enabled="true"
android:icon="@drawable/ic_action_favorites"
android:title="Favorites"
app:showAsAction="ifRoom" />


<item
android:id="@+id/action_nearby"
android:enabled="true"
android:icon="@drawable/ic_action_nearby"
android:title="Nearby"
app:showAsAction="ifRoom" />
</menu>

您需要将适当的图标添加到项目中。这是不是很困难,如果你去 文件 > 新建 > 图像资产和选择 动作栏和标签图标作为图标类型。

添加一个选定的监听器项

这里没有什么特别的事情发生。我们只是在活动的 onCreate方法中向底部导航栏添加一个侦听器。

public class MainActivity extends AppCompatActivity {


@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);


BottomNavigationView bottomNavigationView = (BottomNavigationView) findViewById(R.id.bottom_navigation);
bottomNavigationView.setOnNavigationItemSelectedListener(new BottomNavigationView.OnNavigationItemSelectedListener() {
@Override
public boolean onNavigationItemSelected(@NonNull MenuItem item) {
switch (item.getItemId()) {
case R.id.action_recents:
Toast.makeText(MainActivity.this, "Recents", Toast.LENGTH_SHORT).show();
break;
case R.id.action_favorites:
Toast.makeText(MainActivity.this, "Favorites", Toast.LENGTH_SHORT).show();
break;
case R.id.action_nearby:
Toast.makeText(MainActivity.this, "Nearby", Toast.LENGTH_SHORT).show();
break;


}
return true;
}
});
}
}

需要帮忙吗?

我学会了如何做到这一点,看下面的 YouTube 视频。计算机的声音有点奇怪,但演示非常清晰。

<android.support.design.widget.BottomNavigationView
android:id="@+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="?android:attr/windowBackground"
app:menu="@menu/navigation" />

Xml (内部菜单)

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">


<item
android:id="@+id/navigation_home"
android:icon="@drawable/ic_home_black_24dp"
android:title="@string/title_home"
app:showAsAction="always|withText"
android:enabled="true"/>

onCreate()方法中,

BottomNavigationView navigation = (BottomNavigationView)findViewById(R.id.navigation);
//Dont forgot this line
BottomNavigationViewHelper.disableShiftMode(navigation);

创建类如下所示。

public class BottomNavigationViewHelper {
public static void disableShiftMode(BottomNavigationView view) {
BottomNavigationMenuView menuView = (BottomNavigationMenuView) view.getChildAt(0);
try {
Field shiftingMode = menuView.getClass().getDeclaredField("mShiftingMode");
shiftingMode.setAccessible(true);
shiftingMode.setBoolean(menuView, false);
shiftingMode.setAccessible(false);
for (int i = 0; i < menuView.getChildCount(); i++) {
BottomNavigationItemView item = (BottomNavigationItemView) menuView.getChildAt(i);
//noinspection RestrictedApi
item.setShiftingMode(false);
// set once again checked value, so view will be updated
//noinspection RestrictedApi
item.setChecked(item.getItemData().isChecked());
}
} catch (NoSuchFieldException e) {
Log.e("BNVHelper", "Unable to get shift mode field", e);
} catch (IllegalAccessException e) {
Log.e("BNVHelper", "Unable to change value of shift mode", e);
}
}
}

这个库 下方导航视图扩展了 Google 的 BottomNavigationView。你可以很容易地定制谷歌图书馆的底部导航栏的方式,你希望它是。你可以禁用移动模式,改变图标和文字的可见性等等。一定要试试。

您可以根据上述答案创建布局 如果有人想在 Kotlin 使用这个:-

 private val mOnNavigationItemSelectedListener = BottomNavigationView.OnNavigationItemSelectedListener { item ->
when (item.itemId) {
R.id.images -> {
// do your work....
return@OnNavigationItemSelectedListener true
}
R.id.videos ->
{
// do your work....
return@OnNavigationItemSelectedListener true
}
}
false
}

然后在 oncreate 中,您可以将上面的侦听器设置为您的视图

   mDataBinding?.navigation?.setOnNavigationItemSelectedListener(mOnNavigationItemSelectedListener)