Android：使用形状绘制“X”

Question

需要在一个View中使用形状绘制“X”，但是X的边缘必须锚定在视图的左侧、顶部、右侧和底部。

像这样：

- Christian

---

ShapeDrawable并不是很适合这个角色。为什么你觉得你需要使用它们呢？通过自定义View，您可以在Canvas上绘制线条，这似乎会更简单一些。 - CommonsWare

Answer 1

通过在drawable中使用XML：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

<item>
    <rotate
        android:fromDegrees="135"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="135">
        <shape android:shape="line">
            <stroke android:width="1dp" android:color="@color/social_grey" />
        </shape>
    </rotate>
</item>
<item>
    <rotate
        android:fromDegrees="45"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="45">
        <shape android:shape="line">
            <stroke android:width="1dp" android:color="@color/social_grey" />
        </shape>
    </rotate>
</item>


</layer-list>

有填充：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

<item
   android:left="4dp"
    android:right="4dp"
    >
    <rotate
        android:fromDegrees="135"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="135">
        <shape android:shape="line">
            <stroke android:width="1dp" android:color="@color/social_grey" />
        </shape>
    </rotate>
</item>
<item
    android:left="4dp"
    android:right="4dp"
    >
    <rotate
        android:fromDegrees="45"
        android:pivotX="50%"
        android:pivotY="50%"
        android:toDegrees="45">
        <shape android:shape="line">
            <stroke android:width="1dp" android:color="@color/social_grey" />
        </shape>
    </rotate>
</item>
</layer-list>

- Shlomi Fresko

Answer 2

创建一个自定义视图并重写onDraw方法会更容易些。例如：

public class XView extends View {

    @Override
    public void onDraw(Canvas canvas) {
        float width = getMeasuredWidth();
        float height = getMeasuredHeight();
        Paint paint = new Paint();
        paint.setColor(Color.RED);
        canvas.drawLine(0,0,width,height,paint);
        canvas.drawLine(width,0,0,height,paint);
    }
}

- Zaid Daghestani

---

好主意，但如果油漆是半透明的，它就不起作用了。 - bvdb

Answer 3

我遇到了类似的情况，但我的框具有预定义的高度和宽度，我只使用XML完成了它。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item>

        <shape android:shape="rectangle">

            <solid android:color="@color/status_expired_color" />

        </shape>

    </item>

    <item android:top="2dp"
        android:left="2dp"
        android:right="2dp"
        android:bottom="2dp">

        <shape android:shape="rectangle">
            <solid android:color="@color/white" />
        </shape>

    </item>

    <item android:top="14sp"
        android:left="6dp"
        android:right="6dp"
        android:bottom="14sp">

        <rotate
            android:fromDegrees="45"
            android:toDegrees="45"
            android:pivotX="50%"
            android:pivotY="50%" >

            <shape android:shape="rectangle">
                <solid android:color="@color/status_expired_color" />
            </shape>

        </rotate>

    </item>

    <item android:top="6dp"
        android:left="14sp"
        android:right="14sp"
        android:bottom="6dp">

        <rotate
            android:fromDegrees="45"
            android:toDegrees="45"
            android:pivotX="50%"
            android:pivotY="50%" >

            <shape android:shape="rectangle">
                <solid android:color="@color/status_expired_color" />
            </shape>

        </rotate>

    </item>

</layer-list>

---

@color/status_expired_color = #E9510E
@color/white = #ffffff  

输出：

- dsharew