ShapeableImageView的描边被边框裁剪了

Question

我这里有一个 ShapeableImageView，它有 5dp 的描边：

我有一个 ShapeableImageView，具有 5dp 的描边：

<com.google.android.material.imageview.ShapeableImageView
    android:id="@+id/profile_picture"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_marginTop="20dp"
    android:scaleType="centerCrop"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@id/profile_toolbar"
    app:shapeAppearanceOverlay="@style/circular"
    app:strokeColor="@color/dark_blue"
    app:strokeWidth="5dp" />

这是结果：

- Nasreddine Bouchemel

---

https://github.com/material-components/material-components-android/issues/1329 - Uuu Uuu

Answer 1

我一直在尝试一些东西，最终，在视图中添加填充解决了这个问题。

- Nasreddine Bouchemel

---

需要翻译的内容：One thing to mention on the ShapeableImageView is that it has two padding options. 1- app:contentPadding set is for padding its content like images we use. 2- android:padding set is for padding imageview itself. So what makes it work here is the android:padding。ShapeableImageView 需要提及的一点是它有两个填充选项。1 - 设置 app:contentPadding 用于填充其内容，例如我们使用的图像。2 - 设置 android:padding 用于填充 ImageView 本身。所以在这里起作用的是 android:padding。 - Kozmotronik

Answer 2

如果您提供了描边宽度，则必须提供与描边宽度相等的内边距，以便描边可见。

            android:strokeWidth="5dp"
            android:padding="5dp"

- Himanshu Yadav Anshu

Answer 3

只需为它添加填充，或许5dp会比较合适（多一点或少一点都可以）。

- Noah Mohamed

Answer 4

我认为ShapeableImageView不应该用于绘制边框描边，它应该只是将其图像资源剪切到指定的形状。

<com.google.android.material.imageview.ShapeableImageView
    android:id="@+id/profile_picture"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:layout_marginTop="20dp"
    android:background="#FF0000"
    android:scaleType="centerCrop"
    android:src="@drawable/ic_launcher_foreground"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:shapeAppearanceOverlay="@style/circular" />

- hata

---

是的，但您也可以为其设置描边。 - Nasreddine Bouchemel