Ten's Blog客户端开发前言

一些 UI 问题解决方法

解决安卓虚拟导航栏遮挡 Activity 根视图

1. Activity 布局根节点设置fitsSystemWindows=true，这个加在哪个布局，该布局就会相应的向上（配置 A）或者向下（配置 B）或者向上下（同时配置 AB）扩展

<RelativeLayout 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:id="@+id/root_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    android:background="@color/colorPrimary">
    <!--Content-->
</RelativeLayout>

2. Activity 代码设定状态栏和导航栏以扩展形式而非堆叠形式占据界面

Java

@Override
protected void onCreate(Bundle savedInstanceState){
    setContentView(R.layout.activity_main)
    // 状态栏 @ 顶部
    getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS);//A
    // 导航栏 @ 底部
    getWindow().addFlags(WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION);//B
}

.NET

protected override void OnCreate(Bundle savedInstanceState)
{
    SetContentView(Resource.Layout.activity_main);
    // 状态栏 @ 顶部
    Window.AddFlags(WindowManagerFlags.TranslucentStatus);
    // 导航栏 @ 底部
    Window.AddFlags(WindowManagerFlags.TranslucentNavigation);
}

CoordinatorLayout 布局里 FloatingActionButton 和 Snackbar 联动位置自动调整

• CoordinatorLayout 各种与其他 Widget 联动使用教程参照简书
• Snackbar 官方 API 文档请查阅Google Developer

简单布局

<?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"
	android:background="@color/colorWhite"
	tools:showIn="@layout/activity_main"
	tools:context="TenBlogDroidApp.MainActivity">

	<com.google.android.material.appbar.AppBarLayout
		android:layout_width="match_parent"
		android:layout_height="wrap_content"
		android:theme="@style/AppTheme.AppBarOverlay">

		<androidx.appcompat.widget.Toolbar
			android:id="@+id/toolbar"
			android:layout_width="match_parent"
			android:layout_height="?attr/actionBarSize"
			android:background="?attr/colorPrimary"
			app:popupTheme="@style/AppTheme.PopupOverlay" />

	</com.google.android.material.appbar.AppBarLayout>

	<include
		layout="@layout/content_default" />

	<com.google.android.material.floatingactionbutton.FloatingActionButton
		android:id="@+id/fab"
		android:layout_width="wrap_content"
		android:layout_height="wrap_content"
		android:layout_gravity="bottom|end"
		android:layout_margin="@dimen/fab_margin"
		android:scaleType="center"
		app:elevation="@dimen/dp_10"
		app:srcCompat="@android:drawable/ic_dialog_email" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

初始界面

点击 FloatingActionButton 展示 Snackbar