如何在Android中使用xml创建具有左右边框的向下箭头指示器

Question

我想为我的观点制作一个像这样的形状。

有没有办法用xml做到这一点？ 感谢

Answer 1

以下是您的自定义可绘制custom_shape_down_arrow.xml：

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

    <!-- Background -->
    <item>
        <shape android:shape="rectangle">
            <size
                android:width="250dp"
                android:height="20dp" />
            <solid android:color="#cdcdcd" />
        </shape>
    </item>

    <!-- Top-Left Line -->
    <item
        android:right="150dp"
        android:bottom="18.7dp">
        <shape android:shape="line">
            <stroke
                android:color="#999999"
                android:width="1dp" />
        </shape>
    </item>

    <!-- Top-Right Line -->
    <item
        android:left="150dp"
        android:bottom="18.7dp">
        <shape android:shape="line">
            <stroke
                android:color="#999999"
                android:width="1dp" />
        </shape>
    </item>

    <!-- Left-Diagonal Line -->
    <item
        android:right="25dp">
        <rotate android:fromDegrees="36">
            <shape android:shape="line">
                <stroke
                    android:color="#999999"
                    android:width="1dp" />
            </shape>
        </rotate>
    </item>

    <!-- Right-Diagonal Line -->
    <item
        android:left="27dp">
        <rotate android:fromDegrees="322">
            <shape android:shape="line">
                <stroke
                    android:color="#999999"
                    android:width="1dp" />
            </shape>
        </rotate>
    </item>

</layer-list>

使用：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_margin="24dp"
    android:gravity="center_horizontal">

    <!-- Custom shape -->
    <LinearLayout
        android:id="@+id/layout_custom_shape"
        android:layout_width="wrap_content"
        android:layout_height="60dp"
        android:paddingTop="10dp"
        android:background="#cdcdcd">

        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:background="@drawable/custom_shape_down_arrow">

        </LinearLayout>
    </LinearLayout>

</LinearLayout>

<强>输出：

希望这会有所帮助〜