【问题标题】:Floating Action Button icon not in the center浮动操作按钮图标不在中心
【发布时间】:2019-09-01 02:22:04
【问题描述】:

SO 上的other answers 都没有帮助我。

这是我的 FAB xml:

<com.google.android.material.floatingactionbutton.FloatingActionButton xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/fabTransfer"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom|end"
    app:fabCustomSize="@dimen/fab_size_normal"
    android:layout_margin="16dp"
    app:srcCompat="@drawable/ic_add_white_24dp" />

这里是 xml 图标:

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="24.0"
    android:viewportHeight="24.0">
<path
    android:fillColor="#FFFFFFFF"
    android:pathData="M19,13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z"/>
 </vector>

然而我的图标看起来像这样!

有什么想法吗?我也尝试过其他图标(png 和矢量),但还是一样。

【问题讨论】:

  • 希望矢量标签在你的实际资源文件中是关闭的,只是在这里被错误地省略了
  • @NikosHidalgo 是的,它只是因为某种原因被遗漏了
  • 我想知道它是否与视口有关,视口本质上是可绘制的画布大小。尝试对这些值进行试验,看看是否有什么不同,或者完全删除它们,看看是否有效。
  • @NikosHidalgo 我尝试摆弄这些值,但它似乎总是偏离中心,几乎就像它的左上角锚定在错误的位置
  • 我能想到的唯一可能的解决方法是将图像资源设置为可绘制而不是矢量资源,然后在布局的设计选项卡上从 android studio 提供的选择菜单中拖动操作按钮您可以看到向导来指导您在工厂的前景上应用可绘制对象。

标签: android xml android-layout floating-action-button


【解决方案1】:

this answer 之后,您应该尝试将app:fabCustomSize 设置为24dp,看看效果是否更好。

【讨论】:

    【解决方案2】:

    解决方案是在 FAB 中添加一个扩展 Widget.MaterialComponents.FloatingActionButton 的样式

    <style name="MyFabStyle" parent="Widget.MaterialComponents.FloatingActionButton">
            <item name="backgroundTint">@color/fab_background</item>
            <item name="rippleColor">#0d9bed</item>
    </style>
    

    【讨论】:

    • 这对我不起作用,我看不出图标的中心对齐如何受到这种自定义样式的影响。
    • 这可行,但是尝试了所有其他建议的答案:fabTransfer.setScaleType(ImageView.ScaleType.CENTER) 我正在从旧的支持库迁移到 28+
    【解决方案3】:
    app:fabCustomSize="48dp"
    

    【讨论】:

      【解决方案4】:

      这可能是因为布局样式覆盖了浮动按钮样式。要解决它,请确保重新建立定义为您自己的样式,如下所示:

      styles.xml

          <style name="AppTheme.NoActionBar" parent="Theme.MaterialComponents.Light.Bridge">
              <item name="windowActionBar">false</item>
              <item name="windowNoTitle">true</item>
              <item name="colorPrimary">@color/colorPrimaryDark</item>
              <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
              <item name="colorAccent">@color/colorPrimaryDark</item>
              <item name="android:windowDrawsSystemBarBackgrounds">true</item>
              <item name="android:statusBarColor">@color/black_app</item>
              <item name="android:textColor">@color/white</item>
              <item name="floatingActionButtonStyle">@style/FabButtonStyle</item>
          </style>
      
          <style name="FabButtonStyle" parent="Widget.MaterialComponents.FloatingActionButton">
              <item name="backgroundTint">@color/teal_200</item>
              <item name="tint">@color/white</item>
          </style>
      

      然后确保视图的布局符合样式:

      AndroidManifiest.xml

      <activity
                  android:name=".OnBoardingActivity"
                  android:configChanges="orientation"
                  android:screenOrientation="portrait"
                  android:theme="@style/AppTheme.NoActionBar"
                  tools:ignore="LockedOrientationActivity" />
      

      【讨论】:

        【解决方案5】:

        尝试将此属性 android:layout_gravity="bottom|end" 更改为 android:layout_gravity="center"

        【讨论】:

        • 不应该影响drawable,而是影响整个按钮在其父布局中的位置
        【解决方案6】:

        是因为你写了:android:layout_gravity="bottom|end",所以它到了最后。

        你应该用“中心”替换它

        如果不起作用,请简单尝试:

        android:gravity="center"

        【讨论】:

        • 不,layout_gravity 会影响小部件在布局中的位置。 android:gravity 在这里没有区别
        猜你喜欢
        • 2019-03-09
        • 2020-02-22
        • 2016-03-02
        • 1970-01-01
        • 1970-01-01
        • 2020-07-17
        • 2015-06-25
        • 1970-01-01
        • 2019-11-28
        相关资源
        最近更新 更多