要实现底部导航栏中间按钮的凸起效果,可以通过以下几种方法实现:
<!-- 布局文件示例 -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
<!-- 背景 -->
<View
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="@color/colorPrimary"/>
<!-- 中间凸起按钮 -->
<ImageView
android:id="@+id/center_button"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_centerHorizontal="true"
android:src="@drawable/ic_add"
android:background="@drawable/circle_background"
android:elevation="8dp"
android:translationY="-20dp"/>
<!-- 其他导航按钮 -->
<!-- ... -->
</RelativeLayout>
// 添加点击动画
centerButton.setOnClickListener(v -> {
ObjectAnimator scaleX = ObjectAnimator.ofFloat(v, "scaleX", 1f, 1.2f, 1f);
ObjectAnimator scaleY = ObjectAnimator.ofFloat(v, "scaleY", 1f, 1.2f, 1f);
AnimatorSet set = new AnimatorSet();
set.playTogether(scaleX, scaleY);
set.setDuration(300);
set.start();
});
<com.google.android.material.bottomnavigation.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"/>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center|bottom"
android:layout_marginBottom="16dp"
android:src="@drawable/ic_add"
app:elevation="8dp"/>
res/drawable/raised_button.xml
):<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="@color/colorAccent"/>
<size android:width="60dp" android:height="60dp"/>
</shape>
<ImageView
android:id="@+id/center_button"
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_centerHorizontal="true"
android:layout_marginBottom="20dp"
android:src="@drawable/ic_add"
android:background="@drawable/raised_button"
android:elevation="8dp"/>
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.material.bottomappbar.BottomAppBar
android:id="@+id/bottom_app_bar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom"
app:fabAlignmentMode="center"
app:fabCradleMargin="8dp"
app:fabCradleRoundedCornerRadius="8dp"
app:fabCradleVerticalOffset="8dp">
<com.google.android.material.bottomnavigation.BottomNavigationView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:menu="@menu/bottom_nav_menu"/>
</com.google.android.material.bottomappbar.BottomAppBar>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/ic_add"
app:layout_anchor="@id/bottom_app_bar"/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
以上方法可以根据项目需求选择最适合的实现方式,Material Design组件提供了最原生的支持,而自定义View则提供了最大的灵活性。