Android中自定義SeekBar的背景顏色，進度條顏色，以及滑塊的圖片

最近正好有這方面的需要，用了很久時間，找到了改變基本顏色以及圖片的方法
下面以SeekBar為例，為大家描述一下我的做法

首先在layout資料夾中的main.xml內容如下

Xml程式碼

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

="fill_parent">
<SeekBar android:id="@+id/seek" android:layout_width="300px"
android:layout_height="wrap_content" android:max="100"
android:progress="50" android:progressDrawable="@drawable/seekbar_img"
android:thumb="@drawable/thumb" />
</LinearLayout>

很簡單，只有一個SeekBar控制元件，注意它的 android:progressDrawable="@drawable/seekbar_img"

以及android:thumb="@drawable/thumb" 它們分別對應的是進度條的圖片以及拖動滑塊的圖片，這裡的圖片也可以是我們自定義的drawable中的xml檔案，可以理解成這兩個屬性應該如何顯示的意思,而@drawable/seekbar_img和@drawable/thumb它們分別對應著 drawable 資料夾中的檔案seekbar_img.xml和thumb.xml，它們表示著如何去顯示進度條與滑塊

當初我想的是在網上找SeekBar的原始樣式檔案是如何定義，這樣就可以照搬程式碼，修改一些我需要的圖片以及顏色和大小就行了，於是就開始搜尋,這裡要用到的是Android的系統原始碼，具體下載辦法網上很多，需要用到cygwin,大家可以參考

下好源代以後，可以在 C:\cygwin\home\android\frameworks\base\core\res\res\drawable 這個路徑下找到很多圖片與android的原始控制元件樣式（即xml檔案)
找一下，哈哈，好東西可不少，以後要改樣式全靠它們了
我們可以在這是裡面找到seek_thumb.xml，內容如下

Xml程式碼

<?xml version="1.0" encoding="utf-8"?>
<!-- Copyright (C) 2008 The Android Open Source Project
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:state_window_focused="true"
android:drawable="@drawable/seek_thumb_pressed" />
<item android:state_focused="true"
android:state_window_focused="true"
android:drawable="@drawable/seek_thumb_selected" />
<item android:state_selected="true"
android:state_window_focused="true"
android:drawable="@drawable/seek_thumb_selected" />
<item android:drawable="@drawable/seek_thumb_normal" />
</selector>

它定義的是seekbar的滑塊樣式，內容很簡單，大家應該看得懂，分別對應著按下，選中，以及獲得焦點時滑塊的圖片

另外，我們還可以找到 progress_horizontal.xml,內容如下

Xml程式碼

<?xml version="1.0" encoding="utf-8"?>
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background">
<shape>
<corners android:radius="5dip" />
<gradient
android:startColor="#ff9d9e9d"
android:centerColor="#ff5a5d5a"
android:centerY="0.75"
android:endColor="#ff747674"
android:angle="270"
/>
</shape>
</item>
<item android:id="@android:id/secondaryProgress">
<clip>
<shape>
<corners android:radius="5dip" />
<gradient
android:startColor="#80ffd300"
android:centerColor="#80ffb600"
android:centerY="0.75"
android:endColor="#a0ffcb00"
android:angle="270"
/>
</shape>
</clip>
</item>
<item android:id="@android:id/progress">
<clip>
<shape>
<corners android:radius="5dip" />
<gradient
android:startColor="#ffffd300"
android:centerColor="#ffffb600"
android:centerY="0.75"
android:endColor="#ffffcb00"
android:angle="270"
/>
</shape>
</clip>
</item>
</layer-list>

有了這兩個檔案的原始碼，我們就可以依樣畫葫蘆了
首先在自己的工程下drawable資料夾中建立seek_bar.xml檔案與thumb.xml檔案
我寫的兩個檔案內容如下
seekbar_img.xml

Xml程式碼

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@+android:id/background" android:drawable="@drawable/bg" />
<item android:id="@+android:id/SecondaryProgress"
android:drawable="@drawable/bg" />
<item android:id="@+android:id/progress" android:drawable="@drawable/bg2"

相關推薦

Android中自定義SeekBar背景顏色，進度條顏色，滑塊圖片

目錄 Android SeekBar常見問題在使用Android Seekbar大家可能經常遇到下面這幾個問題：如何設定Seekbar進度條的高度？如何設定滑塊的樣式？如何設定進度條的顏色和背景顏色？接下來，針對這三個問題我會

Android中自定義SeekBar的背景顏色，進度條顏色，以及滑塊的圖片

最近正好有這方面的需要，用了很久時間，找到了改變基本顏色以及圖片的方法下面以SeekBar為例，為大家描述一下我的做法首先在layout資料夾中的main.xml內容如下 Xml程式碼   <?xml version="1.0" encoding="utf-8"?>   <

Android中自定義SeekBar的樣式

有時候原生的SeekBar太醜了，已經滿足不了我們的效果，需要我們自定義樣式。第一步：在drawable裡建立一個xml檔案 <?xml version="1.0" encoding="utf-8"?> <layer-list xmlns:android="http://

Android中自定義ScrollView的滑動監聽事件，並在滑動時漸變標題欄背景顏色

效果圖滑動前：滑動中：滑動到底部：專案結構 ObservableScrollView package com.jukopro.titlebarcolor; import android.content.Context; import android.u

Android開發：通過樣式修改SeekBar背景顏色，進度條顏色，滑塊圖片

通過樣式style修改 seekBar 的背景、進度、遊標等圖片。佈局檔案： <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.and

Android中自定義ViewGroup使每行元件數量不確定，並拿到選中資料

1先看效果圖 2專案目錄 3在定義控制元件FlowTagGroup package android.zhh.com.myviewgroup; /** * Created by sky on 2017/3/10. */ import android.conten

Android中自定義頂部狀態列顏色

public class StatusBarUtils { public static void setWindowStatusBarColor(Activity activity, int c

Android 自定義SeekBar背景樣式

自定義Android系統控制元件的背景樣式大同小異,現在以自定義SeekBar背景樣式走下流程: 1.SeekBar的進度條樣式,custom_seekbar_progress.xml: <?xml version="1.0" encoding="utf-8"?&g

Android中自定義Activity和Dialog的位置大小背景和透明度等

1.自定義Activity顯示樣式先在res/values下建colors.xml檔案，寫入： <?xmlversion="1.0"encoding="utf-8"?> <resources>     <!-- 設定透明度為56%

淺析在QtWidget中自定義Model（beginInsertRows()和endInsertRows()是空架子，類似於一種信號，用來通知底層）

cti ron 初學者開發 http 沒有 insert ati 學習 Qt 4推出了一組新的item view類，它們使用model/view結構來管理數據與表示層的關系。這種結構帶來的功能上的分離給了開發人員更大的彈性來定制數據項的表示，它也提供一個標準的model接

android中自定義的dialog中的EditText無法彈出輸入法解決方案

dialog.getWindow().clearFlags(WindowManager.LayoutParams.FLAG_ALT_FOCUSABLE_IM);//彈出輸入法，並且寫在show()方法之後。解決Dialog 消失，輸入法不消失的問題：參考：https://blog.csd

Android中自定義DatePicker

先看一下效果看這個圖很顯然就是一個DatePicker和一個TimePicker組合來實現的 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.a

Android中自定義Dialog樣式

public class MyMiddleDialog extends Dialog { private Context context; public MyMiddleDialog(Context context) { sup

Android中自定義TabLayout指示器長度

效果圖: MainActivity.java檔案 public class MainActivity extends AppCompatActivity { @Override protected void onCreate(@Nullabl

Android中自定義滑動選中控制元件WheelView

WheelView a great functional custom WheelView with demo in dialog and bottomDialog,android 滾動選擇控制元件,滾動選擇器 ========= How to

Android中自定義ProgressBar的樣式

如果想快速獲取水平進度條顯示操作，直接進入第四步和第六步操作就可以了！！首先可以去sdk中檢視 sdk1\platforms\android-23\data\res\values，中的sty

Android中自定義底部彈出框ButtomDialog

先看看效果和你要的是否一樣一、先來配置自定義控制元件需要的資源。 1.在res資料夾下建立一個anim資料夾並建立兩個slide_in_bottom.xml、slide_out_bottom.xml檔案，負責彈框進出動畫。 <?xml version="1.0" enco

Android中自定義控制元件SegmentedGroup

GitHub：https://github.com/Kaopiz/android-segmented-control 一、新增依賴 implementation 'info.hoang8f:android-segmented:1.0.6' 二、佈局中使用 <info.hoan

Android中自定義drawable資源實現佈局的圓角邊框效果

佈局的圓角邊框效果圖如下所示：如上圖紅色標註的部分就是一個圓角邊框效果的自定義搜尋框。實現起來很簡單，讓佈局（Relativelayout或者LinearLayout）的background屬性引用自定義的drawable資源即可。 andro

android中自定義畫布Canvas的實現

一、要求：1.畫布繪製控制元件的方法，控制元件應該是一個可以自定義的；2.畫布是可以縮放，且提供一個縮放的方法供外使用；3.控制元件之間連線的方法；4.畫布縮放之後手勢滑動的識別實現；二、在github裡面種找到了一個類似度挺高的開源專案： github中的第三方的開源專

Android中自定義SeekBar的背景顏色，進度條顏色，以及滑塊的圖片

相關推薦