如何在xml中绘制带有插入圆的复杂按钮?

时间:2016-09-26 02:53:09

标签: android xml

如何在xml中绘制如下图像的按钮?基本上,它有两个不同的按钮。一个是I,另一个是Pick Up。感谢。enter image description here

2 个答案:

答案 0 :(得分:3)

试试这个:

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp">

        <TextView
            android:layout_width="match_parent"
            android:layout_height="50dp"
            android:background="@drawable/bg_btn_coner"
            android:gravity="center"
            android:text="Pickup"
            android:textColor="@android:color/white"
            android:textSize="20sp" />

        <TextView
            android:layout_width="50dp"
            android:layout_height="50dp"
            android:background="@drawable/bg_btn_coner"
            android:gravity="center"
            android:text="i"
            android:textColor="@android:color/white"
            android:textSize="20sp" />


    </RelativeLayout>

bg_btn_coner.xml

<solid android:color="#737373" />

<stroke
    android:width="3dp"
    android:color="@android:color/white"></stroke>

<corners android:radius="50dp"></corners>

结果:enter image description here

答案 1 :(得分:3)

试试这个。显示示例图像。

注意:您必须修复路径才能使图像更加完美。

enter image description here

button_circle.xml

<?xml version="1.0" encoding="utf-8"?>

<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="oval">
    <solid android:color="@android:color/darker_gray" />
</shape>

button_rectangle.xml

<?xml version="1.0" encoding="utf-8"?>
<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="720dp"
    android:height="576dp"
    android:viewportWidth="720"
    android:viewportHeight="576">

    <path
        android:fillColor="@android:color/darker_gray"
        android:pathData="M700.461,426.359c0,51.164-7.764,92.641-17.336,92.641H76.369
c-9.575,0,17.191-101.692,17.191-152.855l-1.444-173.699c0-51.164-25.321-136.646-15.747-136.646h606.756
c9.572,0,17.336,41.476,17.336,92.64V426.359z" />
</vector>

您必须修复矢量才能使形状完美。但这是你的一个很好的例子。

my_layout.xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:layout_width="match_parent"
        android:layout_height="42dp"
        android:background="@drawable/button_rectangle"/>

    <Button
        android:layout_width="42dp"
        android:layout_height="42dp"
        android:background="@drawable/button_circle"/>
</RelativeLayout>

希望这有帮助!