直播軟體搭建，漸變色按鈕帶陰影樣式

直播軟體搭建，漸變色按鈕帶陰影樣式

實現

在drawable資料夾建立檔案 bg_button_blue_gradient.xml，內容如下：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="
<!-- 陰影 -->
    <item
        android:bottom="0dp"
        android:left="0dp"
        android:right="0dp"
        android:top="0dp">
        <shape android:shape="rectangle">
            <!-- 陰影也可以弄成漸變的陰影，偷了懶，選了很淺的顏色#E7EDFE直接當陰影了，有耐心或者有UI圖的，可以自己吸色做漸變 -->
            <gradient
                android:angle="270"
                android:endColor="#E7EDFE"
                android:startColor="#E7EDFE"
                android:type="linear"/>
            <corners
                android:bottomLeftRadius="@dimen/dp_60"
                android:bottomRightRadius="@dimen/dp_60"
                android:topLeftRadius="@dimen/dp_60"
                android:topRightRadius="@dimen/dp_60"/>
        </shape>
    </item>
<!-- 實心內容 bottom、left、right、top的距離就是陰影顯示的範圍，0就是沒有陰影顯示的範圍-->
    <item
        android:bottom="5dp" 
        android:left="3dp"
        android:right="3dp"
        android:top="0dp">
        <shape android:shape="rectangle">
        <!-- 圓角，想要左右兩邊都是半圓型，大小就要與按鈕的高度一樣，我按鈕高度為dp_60 -->
            <corners android:topLeftRadius="@dimen/dp_60" android:topRightRadius="@dimen/dp_60"
                android:bottomLeftRadius="@dimen/dp_60" android:bottomRightRadius="@dimen/dp_60"/>
        <!-- 漸變的關鍵，具體自己百度文件，可以按照屬性調出你想要的漸變色 -->   
            <gradient android:type="linear" android:useLevel="true" android:startColor="#3D7EFF" android:endColor="#0648F8" android:angle="180" />
        </shape>
    </item>
</layer-list>

使用

建議用LinearLayout當按鈕，因為裡面好新增其他內容，如果沒有其他內容要新增，也可以使用TextView，減少原生控制元件Button的樣式對佈局的困擾。

    <LinearLayout
        android:id="@+id/ly_create_task"
        android:gravity="center"
        android:layout_marginLeft="@dimen/dp_40"
        android:layout_marginRight="@dimen/dp_40"
        android:layout_marginTop="@dimen/dp_20"
        android:layout_marginBottom="@dimen/dp_15"
        android:background="@drawable/bg_button_blue_gradient"
        android:layout_width="match_parent"
        android:layout_height="@dimen/dp_60">
        <!-- 為了按鈕裡的內容垂直居中，需要marginBottom，值大約是陰影高度的一半 -->
        <LinearLayout
            android:layout_marginBottom="@dimen/dp_2"
            android:orientation="horizontal"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">
            <ImageView
                android:layout_width="@dimen/dp_16"
                android:layout_height="@dimen/dp_16"
                android:layout_gravity="center_vertical"
                android:src="@drawable/ic_button_add_circle_border" />
            <TextView
                android:layout_marginLeft="@dimen/dp_3"
                android:layout_width="96dp"
                android:layout_height="22dp"
                android:text="建立盤點任務"
                android:textColor="#ffffffff"
                android:textSize="16sp"
                />
        </LinearLayout>
    </LinearLayout>

以上就是直播軟體搭建，漸變色按鈕帶陰影樣式， 更多內容歡迎關注之後的文章