问题描述
到目前为止,我正在尝试在我的Android应用程序中实现BottomAppBar。
MainActivity 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:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<fragment
app:layout_behavior="@string/appbar_scrolling_view_behavior"
android:id="@+id/nav_host_fragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:layout_weight="1"
app:defaultNavHost="true"
app:navGraph="@navigation/mobile_navigation" />
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:id="@+id/coordinator"
android:layout_height="match_parent">
<com.google.android.material.bottomappbar.BottomAppBar
android:id="@+id/bottomAppBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
android:background="@drawable/rpurple"
android:backgroundTint="@color/reallyDarkPurple"
style="@style/Widget.MaterialComponents.BottomAppBar.PrimarySurface"
app:menu="@menu/bottom_nav_menu"
app:tint = "@color/white"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageButton
android:id="@+id/navigation_profile"
android:layout_width="60dp"
android:layout_height="60dp"
android:src="@drawable/user"
android:padding="5dp"
app:tint = "@color/lightPurple"
android:scaleType="centerCrop"
android:background="@android:color/transparent"
android:adjustViewBounds="true"/>
<ImageButton
android:id="@+id/historyBtn"
android:layout_width="60dp"
android:padding="5dp"
android:layout_marginEnd="10dp"
android:layout_height="60dp"
android:src="@drawable/clock"
android:layout_alignParentEnd="true"
app:tint = "@color/lightPurple"
android:scaleType="centerCrop"
android:background="@android:color/transparent"
android:adjustViewBounds="true"/>
</RelativeLayout>
</com.google.android.material.bottomappbar.BottomAppBar>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:layout_width="56dp"
android:layout_height="56dp"
android:backgroundTint="@color/lightPurple"
app:srcCompat="@drawable/addwhite"
app:tint = "@color/white"
app:borderWidth="0dp"
android:adjustViewBounds="true"
app:fabCustomSize="56dp"
app:layout_anchor="@id/bottomAppBar"
/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
</RelativeLayout>
我已经在MainActivity中实现了以下代码:
BottomAppBar bottomAppBar = findViewById(R.id.bottomAppBar);
bottomAppBar.replaceMenu(R.menu.bottom_nav_menu);
setSupportActionBar(bottomAppBar);
理想情况下,我想做的是使用BottomAppBar的ImageButtons R.id.navigation_profile
和R.id.historyBtn
在4个单独的片段A,B,C,D之间导航。要求的关键部分是按钮位于屏幕的相对两侧。关于如何处理每个imageButton的OnClick,然后进行后续片段转换的任何帮助?
解决方法
据我了解,您想将一个包含4个片段的导航添加到bottomAppBar。您可以通过删除BottomAppBar中的相对布局来做到这一点 并将其作为一个项目包含在这样的菜单中
首先将其添加到依赖项
implementation 'androidx.coordinatorlayout:coordinatorlayout:1.1.0'
implementation 'com.google.android.material:material:1.2.1'
您的主要活动
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.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"
tools:context=".MainActivity"
>
<FrameLayout
android:id="@+id/hostFragment"
android:name="androidx.navigation.fragment.NavHostFragment"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:backgroundTint="#009FFF"
app:layout_anchor="@id/bottomAppBar"
app:maxImageSize="35dp"/>
<com.google.android.material.bottomappbar.BottomAppBar
android:id="@+id/bottomAppBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:fabAlignmentMode="center"
android:backgroundTint="#3498DB"
app:fabCradleVerticalOffset="10dp"
app:fabCradleMargin="8dp"
app:hideOnScroll="true"
app:fabCradleRoundedCornerRadius="20dp"
app:menu="@menu/menu"
style="@style/Widget.MaterialComponents.BottomAppBar"
android:theme="@style/AppThemeMaterial"
>
</com.google.android.material.bottomappbar.BottomAppBar>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
并且菜单文件应该看起来像这样
<?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/menu_home"
android:title="Home"
app:showAsAction="always" />
<item
android:id="@+id/menu_message"
android:title="Message"
app:showAsAction="always" />
</menu>
将此添加到样式文件
<style name="AppThemeMaterial"
parent="Theme.MaterialComponents.Light.DarkActionBar">
<!-- Customize your theme here. -->
<item name="colorPrimary">@color/colorPrimary</item>
<item name="colorPrimaryDark">@color/colorPrimaryDark</item>
<item name="colorAccent">@color/colorAccent</item>
</style>
u可以这样处理botoom上的项目
BottomAppBar bottomAppBar=findViewById(R.id.bottomAppBar) ;
bottomAppBar.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() {
@Override
public boolean onMenuItemClick(MenuItem item) {
Fragment itemSelected = null ;
switch (item.getItemId()){
case R.id.menu_home:
itemSelected=new Home();
break;
case R.id.menu_message:
itemSelected=new Message();
break;
} getSupportFragmentManager().beginTransaction().replace(R.id.hostFragment,itemSelected).commit();
return true;
}
,您可以使用它来决定打开活动时显示的片段 放入onCreate
getSupportFragmentManager().beginTransaction().replace(R.id.hostFragment,new Home()).commit();
希望这个回答您的问题