3

我对设计支持库的浮动操作按钮小部件和新的百分比布局有疑问。

支持 FAB 似乎不支持百分比布局，这会导致布局无法正常工作。

我有一个由 LinearLayouts 制成的自定义键盘，其中所有键的间距取决于屏幕的大小和我分配的空间。在右下角，我有一个 FAB 来触发主要操作。

在此处输入图像描述

一切都很好，但后来我想改变它，让它变成如下所示的材料表，因为它当前触发了一个弹出对话框。

https://material-design.storage.googleapis.com/publish/material_v_4/material_ext_publish/0B8v7jImPsDi-TjBicTdvQjg4M1E/components-buttons-fab-transition_card_02.webm

我找到了下面的库，它可以满足我的需要。

https://github.com/gowong/material-sheet-fab

该库可以正常工作，但为了使工作表视图正确动画，它不能像 FAB 当前那样包含在 LinearLayout 中。当它这样设置时，它无法在微小的布局中显示工作表。

我通过将其他必需的代码放置在一个更大的相对布局中的线性布局之外，让它几乎可以与线性布局一起使用，但是 FAB 动画仍然无法正常工作，因为它包含在线性布局中，但是工作表以正确的方式制作动画。

我决定尝试将整个键盘更改为新的百分比布局，并想出了这个。

<android.support.percent.PercentRelativeLayout 
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="fill_parent"
android:layout_below="@+id/title">

<TextView
    android:id="@+id/key_one"
    style="@style/keypad"
    android:layout_alignParentLeft="true"
    android:layout_below="@id/title"
    android:text="@string/number_one"
    android:textIsSelectable="false"
    app:layout_heightPercent="25%"
    app:layout_widthPercent="33%" />


<TextView
    android:id="@+id/key_two"
    style="@style/keypad"
    android:layout_below="@id/title"
    android:layout_toLeftOf="@+id/key_three"
    android:layout_toRightOf="@id/key_one"
    android:text="@string/number_two"
    android:textIsSelectable="false"
    app:layout_heightPercent="25%"
    app:layout_widthPercent="33%" />

<TextView
    android:id="@+id/key_three"
    style="@style/keypad"
    android:layout_alignParentRight="true"
    android:layout_below="@id/title"
    android:text="@string/number_three"
    android:textIsSelectable="false"
    app:layout_heightPercent="25%"
    app:layout_widthPercent="33%" />

<TextView
    android:id="@+id/key_four"
    style="@style/keypad"
    android:layout_alignParentLeft="true"
    android:layout_below="@id/key_one"
    android:text="@string/number_four"
    android:textIsSelectable="false"
    app:layout_heightPercent="25%"
    app:layout_widthPercent="33%" />


<TextView
    android:id="@+id/key_five"
    style="@style/keypad"
    android:layout_below="@id/key_one"
    android:layout_toLeftOf="@id/key_three"
    android:layout_toRightOf="@id/key_one"
    android:text="@string/number_five"
    android:textIsSelectable="false"
    app:layout_heightPercent="25%"
    app:layout_widthPercent="33%" />

<TextView
    android:id="@+id/key_six"
    style="@style/keypad"
    android:layout_alignParentRight="true"
    android:layout_below="@id/key_three"
    android:text="@string/number_six"
    android:textIsSelectable="false"
    app:layout_heightPercent="25%"
    app:layout_widthPercent="33%" />

<TextView
    android:id="@+id/key_seven"
    style="@style/keypad"
    android:layout_alignParentLeft="true"
    android:layout_below="@id/key_four"
    android:text="@string/number_seven"
    android:textIsSelectable="false"
    app:layout_heightPercent="25%"
    app:layout_widthPercent="33%" />

<TextView
    android:id="@+id/key_eight"
    style="@style/keypad"
    android:layout_below="@id/key_four"
    android:layout_toLeftOf="@id/key_three"
    android:layout_toRightOf="@id/key_one"
    android:text="@string/number_eight"
    android:textIsSelectable="false"
    app:layout_heightPercent="25%"
    app:layout_widthPercent="33%" />

<TextView
    android:id="@+id/key_nine"
    style="@style/keypad"
    android:layout_alignParentRight="true"
    android:layout_below="@id/key_four"
    android:text="@string/number_nine"
    android:textIsSelectable="false"
    app:layout_heightPercent="25%"
    app:layout_widthPercent="33%" />

<ImageView
    android:id="@+id/key_clear"
    style="@style/keypad"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_below="@id/key_seven"
    android:src="@drawable/keypad_delete_selector"
    android:textIsSelectable="false"
    app:layout_heightPercent="25%"
    app:layout_widthPercent="33%" />

<TextView
    android:id="@+id/key_zero"
    style="@style/keypad"
    android:layout_alignParentBottom="true"
    android:layout_below="@id/key_eight"
    android:layout_toLeftOf="@id/key_three"
    android:layout_toRightOf="@id/key_one"
    android:text="@string/number_zero"
    android:textIsSelectable="false"
    app:layout_heightPercent="25%"
    app:layout_widthPercent="33%" />

<com.myapp.Fab
    android:id="@+id/fab"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:layout_below="@id/key_nine"
    android:src="@drawable/ic_action_send_now"
    app:layout_heightPercent="25%"
    app:layout_widthPercent="33%"
    app:pressedTranslationZ="5dp" />
</android.support.percent.PercentRelativeLayout>

com.myapp.Fab> 扩展了支持设计库 FAB，因此我可以实现库工作所需的 AnimatedFab 接口。

由于它不适用于百分比布局，因此会发生这种情况

在此处输入图像描述

如果我不将 FAB 与底部对齐，那么它只会位于右上角，我找不到将其居中在 0 和 9 之间的方法，但大小是正确的......

如果我尝试在 0 的右边对齐它，它不会改变任何东西。

我也尝试将 FAB 包装在框架布局中，但这也破坏了动画。

有什么方法可以让百分比与 FAB 一起工作（如果这甚至可以解决它，我觉得 FAB 会很大吗？）或者在保持 FAB 处于相对布局的同时解决这个问题，所以表格动画工作正常吗？

如果不是 - 我已经查看了其他选项，例如下面列出的可绘制背景，但它只是填满了整个空间，我无法将其调整到 FAB 合适的大小。

http://www.android4devs.com/2015/03/how-to-make-floating-action-button-fab.html

我也尝试在其中放置一个图像视图而不是 FAB，同样的问题。

任何帮助，将不胜感激。

谢谢！

4

0 回答 0