Question

我如何创建这种类型的按钮，请帮助我接触android并练习UI设计

this is the login button and also similar style for other buttons also like registration submit etc.

Answer 1

<Button android:layout_width="wrap_content" 
  android:layout_height="wrap_content"
  android:background="@drawable/________">

将iamge添加到您的可绘制对象中，并在上方的空行中添加其名称

这将添加显示的ui

Answer 2

您需要创建一个类似于以下内容的自定义绘图

<?xml version="1.0" encoding="utf-8"?>
<!-- use layer list to apply your background -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
    <item android:drawable="@drawable/image_name_here" /> <!-- your background here -->
    <item>
        <shape android:shape="rectangle" android:padding="10dp">

        <!-- To have rounded corner -->
            <corners
                 android:bottomRightRadius="5dp"
                 android:bottomLeftRadius="5dp"
                 android:topLeftRadius="5dp"
                 android:topRightRadius="5dp"/>
         </shape>
   </item>

</layer-list>

Answer 3

我花了将近1个小时自行设计。希望这会对您有所帮助。

button_background.xml

audioManager.isBluetoothScoOn

RelativeLayout

layout.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="#99ffffff" />
            <corners android:radius="15dp" />
            <padding android:right="70dp" />
        </shape>
    </item>

    <item>
        <shape android:shape="rectangle">
            <solid android:color="#fdffa811" />
            <corners
                android:bottomLeftRadius="15dp"
                android:radius="90dp"
                android:topLeftRadius="15dp" />
        </shape>
    </item>


</layer-list>

TextView的矢量图标。

forward_black_24dp.xml

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:layout_width="200dp"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignParentTop="true"
        android:layout_marginEnd="76dp"
        android:layout_marginTop="238dp"
        android:text="Login Now"
        android:textColor="@android:color/white"
        android:textAllCaps="false"
        android:background="@drawable/button_background"
        android:id="@+id/button" />

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/button"
        android:layout_alignBottom="@+id/button"
        android:layout_alignEnd="@+id/button"
        android:layout_marginEnd="16dp"
        android:background="@drawable/forward_black_24dp" />


</RelativeLayout>

输出

如何创建这种类型的按钮？

3 个答案: