如何制作与屏幕成比例的浮动操作按钮?

时间:2017-06-21 18:16:05

标签: android floating-action-button

我希望在更大的屏幕上观看时增大尺寸的FAB。可能吗?如果是这样,我可以添加到正常的FAB代码中。

编辑: - 我的意思是我的意思是我不想在5英寸和10英寸的屏幕上使用相同的尺寸。我希望FAB根据屏幕大小自动更改其大小。

感谢。

3 个答案:

答案 0 :(得分:0)

您可以通过将以下内容添加到values / dimens.xml:

来覆盖普通和迷你尺寸
  <!-- Overriding sizes of the FAB -->
  <dimen name="design_fab_size_normal">90dp</dimen>
  <dimen name="design_fab_size_mini">30dp</dimen>

如果您需要超过2个晶圆厂尺寸,那将是棘手的事情,在这种情况下,我猜您需要创建一个扩展晶圆厂的自定义视图。

您必须为不同的屏幕创建不同的值文件夹。像:

values-sw720dp          10.1” tablet 1280x800 mdpi

values-sw600dp          7.0”  tablet 1024x600 mdpi

values-sw480dp          5.4”  480x854 mdpi 
values-sw480dp          5.1”  480x800 mdpi 

values-xxhdpi           5.5"  1080x1920 xxhdpi
values-xxhdpi           5.5"  1440x2560 xxhdpi

values-xhdpi            4.7”   1280x720 xhdpi 
values-xhdpi            4.65”  720x1280 xhdpi 

values-hdpi             4.0” 480x800 hdpi
values-hdpi             3.7” 480x854 hdpi

values-mdpi             3.2” 320x480 mdpi

values-ldpi             3.4” 240x432 ldpi
values-ldpi             3.3” 240x400 ldpi
values-ldpi             2.7” 240x320 ldpi


This is how it will look like

还有另一个技巧来完成这项任务,
选择LinearLayout并将android:layout_weight="n"用于不同的观看次数,以便自动增加其尺寸。

这个答案由 - @ Javier Mendonca,@ IntelliJ Amiya和我提供

答案 1 :(得分:0)

来自文档:

  

浮动操作按钮有两种尺寸:默认和迷你。   可以使用fabSize属性控制大小。

当然,这与您提供给fab ImageView支持本身的图像资源的尺寸无关。

如果使用默认的浮动操作按钮图像,则其大小在多个屏幕分辨率下将显示一致,因为其资产由设计支持库管理。如果您为浮动操作按钮提供自定义图像,请务必提供必要的资产维度。

有关更多信息,请参阅: https://developer.android.com/reference/android/support/design/widget/FloatingActionButton.html#attr_android.support.design:fabSize

答案 2 :(得分:0)

试试这个希望这会有所帮助:

         <android.support.design.widget.FloatingActionButton
            android:id="@+id/floating_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|end"
            android:layout_margin="@dimen/fab_margin" //16dp
            android:background="?attr/colorPrimary"
            android:src="@drawable/ic_arrow_forward_white_24dp" />