如何在我的视图左上角绘制一个三角形可绘制对象？

Question

我已经创建了这个可绘制对象：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item  >
        <rotate
            android:fromDegrees="45"
            android:toDegrees="10"
            android:pivotX="100%"
            android:pivotY="-0%" >
            <shape
                android:shape="rectangle"   >
                <solid
                    android:color="@color/color_primary"  />
            </shape>

        </rotate>
    </item>
</layer-list>

在预览中，它看起来像这样： 我已经将其放入了这个View中：

        <View
        android:id="@+id/my_view"
        android:layout_width="32dp"
        android:layout_height="32dp"
        android:background="@drawable/triangle"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        />

这个 View 在预览（和手机上）看起来像这样：

为什么 View 没有像三角形预览中的那样只显示在角落里？另外，我想提一下，我希望它填充一半的 View 正方形，基本上从右上角到左下角。

谢谢。

编辑：有人建议我使用：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item  >
        <rotate
            android:fromDegrees="45"
            android:toDegrees="-135"
            android:pivotX="90%"
            android:pivotY="-45%" >
            <shape
                android:shape="rectangle"   >
                <solid
                    android:color="@color/color_primary"  />
            </shape>

        </rotate>
    </item>
</layer-list>

这确实会产生一个角三角形，但它并没有填满 View 正方形的一半。它的效果如下所示：

- casolorz

Answer 1

我会通过使用<vector>可绘制对象来解决这个问题，而不是使用<layer-list>。

<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="@color/color_primary"
        android:pathData="M0 24v-24h24z"/>

</vector>

- Ben P.

---

我该如何使用矢量制作一个圆角三角形？你能帮忙吗？ - insa_c

如果你想把它放在视图的右侧，你可以将它旋转90度。 - neilQ5

@neilQ5，你可以将pathData更改为M0 0h24v24z，这样就可以在右上方绘制三角形（即从0,0开始，水平线长为24，垂直线长为24，闭合形状）。 - Ben P.

在我看来，这个语法非常愚蠢...花了我5分钟才找到其他方法。 android:pathData="M0,24 h24 v-24 z" - SpaceDust__

这段代码可能不是最易读的，但如果你把它看作一个自动笔，我觉得会有所帮助。原始代码可以理解为“将笔移动到0,24位置并放在纸上”，然后“将笔向上移动24个单位”，接着“将笔向右移动24个单位”，最后“将笔移回起始位置并离开纸面”（隐含了“填充形状”的操作）。对于你来说，你需要“移动到0,24位置”，“向右移动24个单位”，“向上移动24个单位”，然后“返回起始位置”。 - Ben P.

如何将圆角添加到三角形的左边缘？ - Sasank Sunkavalli

Answer 2

将您的XML更改为以下内容，它将按您所需的方式工作。

triangle.xml

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item  >
        <rotate
            android:fromDegrees="45"
            android:toDegrees="-135"
            android:pivotX="90%"
            android:pivotY="-45%" >
            <shape
                android:shape="rectangle"   >
                <solid
                    android:color="@color/color_primary"  />
            </shape>

        </rotate>
    </item>
</layer-list>

预览
设备截图：

- Lalit Fauzdar

---

虽然它被放在了角落，但它并没有填满我想要的“View”正方形的一半。我会在我的帖子中添加一张图片。 - casolorz