京東商城的底部布局的選擇效果看上去很復雜，其實很簡單，這主要是要感謝 selector 選擇器，本文將講解仿照京東商城的底部布局的選擇效果，如何實現 selector 選擇器，在不同的狀態下，給 view 設置不同的背景。
京東商城底部布局的選擇效果如下。
View主要的幾種狀態
主要狀態有8種，設置狀態的代碼以及相應的含義如下。
android:state_pressed = "true/false" //true表示按下狀態，false表示非按下狀態。 android:state_focused = "true/false" //true表示焦點聚集狀態，false表示非焦點聚集狀態。 android:state_selected = "true/false" //true表示選中狀態，false表示非選中狀態。 android:state_activated = "true/false" //true表示激活狀態，false表示非激活狀態。 android:state_checkable = "true/false" //true表示可以勾選狀態，false表示不可以勾選。 android:state_checked = "true/false" //true表示被勾選狀態，false表示未被勾選狀態。 android:state_enabled = "true/false" //true表示可用狀態，fasle表示不可用狀態。 android:state_window_focused = "true/false" //true表示應用程序窗口獲取焦點狀態，false表示應用程序窗口非獲取焦點狀態。
設置不同狀態下的圖標背景
首先準備好不同狀態下的同一類型的圖標分別兩張，復制到 mipmap 文件下，然后在 drawable 文件下新建 Drawable resource file 文件，命名為 selector_icon_home.xml。
之后在 selector 下寫入不同狀態下的背景圖，這里是首頁模塊的 Selector 設置的源代碼。其他模塊的 Selector 圖標設置和首頁模塊一致。
<selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- Non focused states --> <item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="@mipmap/icon_home" /> <item android:state_focused="false" android:state_selected="true" android:state_pressed="false" android:drawable="@mipmap/icon_home_press" /> <!-- Focused states --> <item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="@mipmap/icon_home_press" /> <item android:state_focused="true" android:state_selected="true" android:state_pressed="false" android:drawable="@mipmap/icon_home_press" /> <!-- Pressed --> <item android:state_selected="true" android:state_pressed="true" android:drawable="@mipmap/icon_home_press" /> <item android:state_pressed="true" android:drawable="@mipmap/icon_home_press" /> </selector>
所有模塊下的 Selector 圖片文件都添加完成后，最后設置 ImageView 的背景為 R.drawable.selector_icon_home，代碼如下。
imageView.setBackgroundResource(R.drawable.selector_icon_home);
運行后得到效果圖如下。
設置不同狀態下的文字顏色
新建 color 文件，然后新建 Color resource file 文件，命名為 selector_tab_text.xml。
這里各個模塊的選擇效果下文本顏色變化是一樣的，只需要在該文件中寫入不同狀態下的文字的顏色就可以了，其源代碼如下。
<selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- Selected --> <item android:state_selected="true" android:color="#eb4f38" /> <!-- Active --> <item android:state_active="true" android:color="#eb4f38"/> <item android:state_selected="false" android:color="#a9b7b7" /> <item android:state_active="false" android:color="#a9b7b7"/></selector>
然后在布局文件 layout 中設置 TextView 的文字顏色為 R.color. selector_tab_text 就大功到成了。
android:textColor="@color/selector_tab_text
運行后得到效果圖如下。
最終效果
selector 選擇器在點擊事件狀態變化時基本上都會使用到，既開發方便，又交互效果好，已經是必不可少的，更多的用處和用法可以參考 Android developer 官方文檔。
以上所述是小編給大家介紹的Android 仿京東商城底部布局的選擇效果(Selector 選擇器的實現)，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復大家的。在此也非常感謝大家對武林網網站的支持！
新聞熱點
疑難解答
