How to custom button multiple colors in Android - Insurance Finances

Xin chào các bạn hôm nay Thủ thuật lập trình Android sẽ trình bày cho các bạn về how to custom button multiple colors in android một cách đơn giản nhất, hiện nay có nhiều chức năng sử dụng nút button in Android rất nhiều bởi nó có nhiều công dụng để thực hiện bên cạnh đó nó dễ custom button in Android, để thực hiện nay bạn cần tìm hiểu từ khóa button gradient in Android như thế nào, sau đó là nội dung thực hiện Android example như sau:

Để thực hiện các bạn cần có những vấn đề sau đây :

 Tìm kiếm màu sắc đẹp nhất
 Cài đặt Android studio
 Cài đặt genymotion hoặc thực hiện máy áo trong Android studio.

 Các bước thực hiện custom button multipe color in android

 Step 1. Tạo một Project MultipeColor in Android studio như sau:

 Step 2. Chọn màu sắc vào trong Value -> Color.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#008577</color>
    <color name="colorPrimaryDark">#00574B</color>
    <color name="colorAccent">#D81B60</color>
        <color name="red">#F6402C</color>
        <color name="pink">#EB1460</color>
        <color name="purple">#9C1AB1</color>
        <color name="deep_purple">#6633B9</color>
        <color name="indigo">#3D4DB7</color>
        <color name="blue">#1093F5</color>
        <color name="light_blue">#00A6F6</color>
        <color name="cyan">#00BBD5</color>
        <color name="teal">#009687</color>
        <color name="green">#46AF4A</color>
        <color name="light_green">#9acd32</color>
        <color name="lime">#CCDD1E</color>
        <color name="yellow">#FFEC16</color>
        <color name="amber">#FFC100</color>
        <color name="orange">#FF9800</color>
        <color name="deep_orange">#FF5505</color>
        <color name="brown">#7A5547</color>
        <color name="grey">#9D9D9D</color>
        <color name="blue_grey">#5E7C8B</color>
        <color name="white">#ffffff</color>
        <color name="black">#000000</color>
        <color name="crop__button_bar">#f3f3f3</color>
        <color name="crop__button_text">#666666</color>
        <color name="crop__selector_pressed">#1a000000</color>
        <color name="crop__selector_focused">#77000000</color>
    </resources>

 Step 3. Thực hiện custom buttom color in folder drawable
  Custom_buttom_color_1.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <gradient
                android:angle="180"
                android:centerColor="@color/deep_purple"
                android:centerX="50%"
                android:endColor="@color/light_green"
                android:startColor="@color/blue_grey"
                ></gradient>
            <corners android:radius="15dp" />
        </shape>
    </item>
</selector>

Kết quả:

  Custom_buttom_color_2.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <gradient
                android:angle="180"
                android:centerColor="@color/red"
                android:centerX="50%"
                android:endColor="@color/lime"
                android:startColor="@color/white"
                ></gradient>
            <corners android:radius="15dp" />
        </shape>
    </item>
</selector>

Kết quả:

  Custom_buttom_color_3.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <gradient
                android:angle="180"
                android:centerColor="@color/brown"
                android:centerX="50%"
                android:endColor="@color/yellow"
                android:startColor="@color/crop__button_text"
                ></gradient>
            <corners android:radius="15dp" />
        </shape>
    </item>
</selector>

Kết quả:

  Custom_buttom_color_4.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item>
        <shape android:shape="rectangle">
            <gradient
                android:angle="180"
                android:centerColor="@color/indigo"
                android:centerX="50%"
                android:endColor="@color/purple"
                android:startColor="@color/colorPrimary"
                ></gradient>
            <corners android:radius="15dp" />
        </shape>
    </item>
</selector>

Kết quả:

 Step 4. Thực hiện thêm Button in Android tại file activity_main.xml in folder layout

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">
    <Button
        android:id="@+id/btn_1"
        android:text="Color Button"
        android:textColor="@color/white"
        android:layout_width="250dp"
        android:layout_margin="10dp"
        android:layout_centerHorizontal="true"
        android:background="@drawable/custom_button_color"
        android:layout_height="150dp" />

    <Button
    android:id="@+id/btn_2"
    android:text="Color Button"
    android:textColor="@color/white"
    android:layout_width="250dp"
    android:layout_below="@+id/btn_1"
    android:layout_margin="10dp"
    android:layout_centerHorizontal="true"
    android:background="@drawable/custom_button_color_2"
    android:layout_height="150dp" />
    <Button
        android:id="@+id/btn_3"
        android:text="Color Button"
        android:textColor="@color/white"
        android:layout_width="250dp"
        android:layout_below="@+id/btn_2"
        android:layout_margin="10dp"
        android:layout_centerHorizontal="true"
        android:background="@drawable/custom_button_color_3"
        android:layout_height="150dp" />
    <Button
        android:id="@+id/btn_4"
        android:text="Color Button"
        android:textColor="@color/white"
        android:layout_width="250dp"
        android:layout_below="@+id/btn_3"
        android:layout_margin="10dp"
        android:layout_centerHorizontal="true"
        android:background="@drawable/custom_button_color_4"
        android:layout_height="150dp" />
</RelativeLayout>

 Step 5. Thực hiện gọi Button Android example in class MainActivity.java

@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
    }

 Trên đây là bài viết giới thiệu cho các bạn về cách custom buttom gradient in android với nhiều màu sắc khác nhau, nếu bài viết có ích cho bạn hãy like và share bài viết của mình, nếu có vấn đề gì các bạn cứ phản hồi cho mình nhé. Xin cảm ơn.

Related Posts