android - 如何避免与 insetEdge 和 dodgeInsetEdges 重叠的视图
问题描述
我有这个布局:
<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">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="@+id/listitem_1"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 1"
android:background="#ff0000"/>
<TextView
android:id="@+id/listitem_2"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 2"
android:background="#ff0000"/>
<TextView
android:id="@+id/listitem_3"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 3"
android:background="#ff0000"/>
<View
android:id="@+id/scroller_bottom_bar"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#0000ff" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/fab_margin"
app:layout_anchor="@id/scroller_bottom_bar"
app:layout_anchorGravity="end"
app:srcCompat="@android:drawable/ic_dialog_email" />
</android.support.design.widget.CoordinatorLayout>
转换为以下 UI 动画:
如您所见,浮动操作按钮与蓝色底视图重叠。我想避免这种情况。我怎么做?
解决方案
这可以通过添加insetEdge
和dodgeInsetEdges
属性来解决。基本上,insetEdge
让CoordinatorLayout
其他孩子知道如果他们愿意,他们可以躲避它。设置dodgeInsetEdges
其他视图让他们真正躲避可闪避视图(标记为insetEdge
)。
将原始 xml 布局重写为:
<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">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="@+id/listitem_1"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 1"
android:background="#ff0000"/>
<TextView
android:id="@+id/listitem_2"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 2"
android:background="#ff0000"/>
<TextView
android:id="@+id/listitem_3"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_margin="16dp"
android:gravity="center"
android:text="item 3"
android:background="#ff0000"/>
<View
android:id="@+id/scroller_bottom_bar"
android:layout_width="match_parent"
android:layout_height="100dp"
android:background="#0000ff" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
<android.support.design.widget.FloatingActionButton
android:id="@+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="@dimen/fab_margin"
app:layout_anchor="@id/fab_anchor"
app:layout_anchorGravity="end"
app:layout_dodgeInsetEdges="bottom"
app:srcCompat="@android:drawable/ic_dialog_email" />
<View
android:id="@+id/fab_anchor"
android:layout_width="match_parent"
android:layout_height="1dp"
app:layout_anchor="@id/scroller_bottom_bar"
app:layout_insetEdge="bottom" />
</android.support.design.widget.CoordinatorLayout>
应该导致预期的 UI 行为:
推荐阅读
- python - numpy 遵循没有循环的自索引列表
- javascript - 最近我在我的扩展程序“未检查的 runtime.lastError:现在无法查询选项卡(用户可能正在拖动选项卡)”中收到此错误。
- python - 如何删除该字典中没有 str“id”的所有内容?
- python-3.x - 找不到元素href
- android - 尝试在本地服务器上连接时改造无法在手机上运行
- python - openslide 信息:TIFFReadDirectory:警告,与光度类型相关的颜色通道和 ExtraSamples 的总和与 SamplesPerPixel 不匹配
- php - 在这种情况下如何修复正确的日期?
- c# - 检索 Google 身份验证令牌
- libphonenumber - 格式化数字时如何防止 libphonenumber-js 删除破折号?
- math - 如何从理论上估算自旋锁的等待时间?