Android中Button實現點擊換圖案及顏色

基本框架

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

    <Button
        android:layout_width="200dp"
        android:layout_height="100dp"/>

</LinearLayout>

基本屬性

在上面的xml文件中Ctrl+左鍵點進Button可以看到該類是繼承自TextView類的,也就是說在TextView部分講到的都可以用在Button上。

在這裡插入圖片描述

文本與背景

在這裡我們就簡單的設置下按鈕上的文本為"Push Me",背景顏色設置為紫色(這兩個資源都被保存在values文件夾的三個xml文件裡),但奇怪的是文本都被強制轉換成瞭大寫,而設置背景也無效。

在這裡插入圖片描述

主題修改

問題出在主題文件themes.xml上,我們需要進入該文件,將textAllCaps設為false,就可以取消強制大寫,即加入下面的代碼:

<item name="textAllCaps">true</item>

然後我們還需要把基礎主題文件由

<style name="Theme.MyButton" parent="Theme.MaterialComponents.DayNight.DarkActionBar">

改為

<style name="Theme.MyButton" parent="Theme.MaterialComponents.DayNight.DarkActionBar.Bridge">

這樣就可以讓我們的設置生效瞭:

在這裡插入圖片描述

雖然設置瞭按鈕的基本屬性,但是現在這個按鈕看上去跟TextView也沒什麼區別,點擊也毫無反應,接下來我們就要設置一下點擊效果。

點擊效果

本次要實現的效果主要是點擊以後按鈕的背景隨之更換,所以我們在res->drawable文件夾下新建一個Drawable Resource文件,起名為background_shift。可以看到,該文件的根節點為圖片選擇器selector

圖片變換

然後我們加入一點圖片資源,點擊res,右鍵new->Vector Asset,進入這個界面後點擊Clip Art選擇一個喜歡的圖標,比如我選擇瞭WiFi:

在這裡插入圖片描述

同時我另導入瞭一張WiFi關閉的圖標。

導入後,就可以在background_shift文件中使用瞭,在這裡我通過state_pressed設置按下時顯示WiFi,不按下時顯示WiFi關閉,代碼如下:

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

    <item android:drawable="@drawable/ic_baseline_wifi_24" android:state_pressed="true"/>
    <item android:drawable="@drawable/ic_baseline_wifi_off_24" android:state_pressed="false"/>

</selector>

寫好瞭background_shift.xml,就可以在activity_main.xml中使用瞭,將Buttonbackground屬性設置為該資源即可實現背景變換。

在這裡插入圖片描述

顏色變換

做顏色變換與圖像變換類似,不同之處在於資源存放位置不同。在res文件夾,我們新建一個color文件夾,右擊rec,在new->Directory中新建文件夾,取名color

在這裡插入圖片描述

之後在color中也建立一個Drawable Resource文件,然後設定按下時為藍色,默認為紅色:

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

    <item android:color="#ff0000ff" android:state_pressed="true"/>
    <item android:color="#ffff0000"/>

</selector>

有瞭這個顏色變換文件,我們就可以在activity_main.xml中將ButtonbackgroundTint設置為該資源從而實現顏色變換。

在這裡插入圖片描述

除瞭背景顏色,還有foregroud前景色,這個是最上層的顏色,會覆蓋整個圖層,不常用。

總結

到此這篇關於Android中Button實現點擊換圖案及顏色的文章就介紹到這瞭,更多相關Android Button點擊換圖案及顏色內容請搜索WalkonNet以前的文章或繼續瀏覽下面的相關文章希望大傢以後多多支持WalkonNet!

推薦閱讀: