[Android] SeekBar の配列をコードで記述、ツマミとProgress barのカスタマイズ

SeekBarのツマミを変更したり、プログレスバーの色や形をカスタマイズしてみます。それらを配列にしてコードで記述してみるとこうなりました。

Android Studio
2021.2.1




SeekBar カスタマイズ

 

SeekBarの基本的なところはSeekBar でボリューム入力にあるように設定していきますが、つまみやプログレスバーはカスタマイズしたくなるのではないでしょうか。

1x1.trans - [Android] SeekBar の配列をコードで記述、ツマミとProgress barのカスタマイズ


 
 

背景色の変更

 

簡単にカスタマイズできるところを変更してみます。
 
高さと横幅は
layout_height
layout_width
で設定でき、背景色は
backgroundでカスタマイズします。
 

 
1x1.trans - [Android] SeekBar の配列をコードで記述、ツマミとProgress barのカスタマイズ

 

ツマミを画像に変更

 

ツマミをアイコン画像にすることも可能です。
例えば \res\mipmap\ic_launcher にあるdroidくんの画像を利用します

 

 
1x1.trans - [Android] SeekBar の配列をコードで記述、ツマミとProgress barのカスタマイズ

 

shapeを使ってカスタマイズ

 

progress bar とツマミをshapeを使ってカスタマイズしてみたいと思います。
 
ツマミのshapeは
custom_thumb.xml としてdrawableに入れます。

custom_thumb.xml

 
またprogress barの部分は
custom_progress.xml として同様にdrawableに入れます。

custom_progress.xml

 
ツマミの移動を追随させるためにclipを使っています。
 
activity_main.xml

 

SeekBar 配列

 

配列はボタン配列のように、レイアウトファイルを使わずにfor文で作成していきます。
 

 

サンプルコード

 

以上をまとめて、レイアウトファイルを使わず配列として記述してみます。

MainActivity.java

 
progressの部分はshapeファイルで記述しています。
custom_progress.xml

 

サンプル動画

 

  

関連ページ:

 

Reference:
SeekBar | Android Developers

シェアする

  • このエントリーをはてなブックマークに追加

フォローする