如何更改 Material Design 3 中的按鈕半徑？

Question

谷歌告訴我我可以改變按鈕半徑，如下圖所示，但沒有解釋如何

我想從圓形完整（7）更改為圓形小（3），如下圖所示

這是按鈕

<com.google.android.material.button.MaterialButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:insetLeft="0dp"
        android:insetTop="0dp"
        android:insetRight="0dp"
        android:insetBottom="0dp"
        android:text="..." />

Answer 1

您需要使用MaterialButton的app:cornerRadius="10dp"屬性來應用cornerRadius

<com.google.android.material.button.MaterialButton
  android:layout_width="wrap_content"
  android:layout_height="wrap_content"
  android:insetLeft="0dp"
  android:insetTop="0dp"
  android:insetRight="0dp"
  android:insetBottom="0dp"
  app:cornerRadius="10dp"
  android:text="..." />

如果你想削減邊界半徑那么請試試這個

創造這樣的風格

<style name="ShapeAppearance.MyApp.SmallComponent" parent="ShapeAppearance.MaterialComponents.SmallComponent">
    <item name="cornerFamily">cut</item>
    <item name="cornerSize">10dp</item> // change cornerSize as per your requiremnt 
 </style>

然后像這樣在按鈕中應用這種樣式

<com.google.android.material.button.MaterialButton
      app:layout_constraintStart_toStartOf="parent"
      app:layout_constraintEnd_toEndOf="parent"
      app:layout_constraintTop_toTopOf="parent"
      app:layout_constraintBottom_toBottomOf="parent"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:insetLeft="0dp"
      android:insetTop="0dp"
      android:insetRight="0dp"
      android:insetBottom="0dp"
      android:layout_margin="30dp"
      android:padding="30dp"
      app:shapeAppearanceOverlay="@style/ShapeAppearance.MyApp.SmallComponent"
      android:text="..."
      />

輸出