android中自定义SeekBar

在实际的工作中经常需要根据美工的设计来改变一些控件的颜色,式样,以及背景图片,下面和大家共同探讨一下在Android中如何自定义SeekBar的背景颜色,进度条的颜色,以及滑块的图片

首先在layout文件夹中的main.xml内容如下

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

   6.         <SeekBar android:id="@+id/seek" android:layout_width="300px"
   7.                 android:layout_height="wrap_content" android:max="100"
   8.                 android:progress="50" android:progressDrawable="@drawable/seekbar_img"
   9.                 android:thumb="@drawable/thumb" />
  10. </LinearLayout>

注意它的 android:progressDrawable="@drawable/seekbar_img" 以及 android:thumb="@drawable/thumb" 它们分别对应的是 进度条的图片以及拖动滑块的图片,这里的图片也可以是我们自定义的drawable中的xml文件,可以理解成这两个属性应该如何显示的意思,而 @drawable/seekbar_img和@drawable/thumb它们分别对应着 drawable 文件夹中的文件seekbar_img.xml和thumb.xml,它们表示着如何去显示进度条与滑块

系统中自带的seek_thumb.xml,内容如下

   1. <?xml version="1.0" encoding="utf-8"?>
   2. <!-- Copyright (C) 2008 The Android Open Source Project
   3.

   4.      Licensed under the Apache License, Version 2.0 (the "License");
   5.      you may not use this file except in compliance with the License.
   6.      You may obtain a copy of the License at
   7.

   8.           http://www.apache.org/licenses/LICENSE-2.0
   9.

  10.      Unless required by applicable law or agreed to in writing, software
  11.      distributed under the License is distributed on an "AS IS" BASIS,
  12.      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  13.      See the License for the specific language governing permissions and
  14.      limitations under the License.
  15. -->
  16.

  17. <!-- This is the thumb on the seek bar. -->
  18. <selector xmlns:android="http://schemas.android.com/apk/res/android">
  19.

  20.     <item android:state_pressed="true"
  21.           android:state_window_focused="true"
  22.           android:drawable="@drawable/seek_thumb_pressed" />
  23.

  24.     <item android:state_focused="true"
  25.           android:state_window_focused="true"
  26.           android:drawable="@drawable/seek_thumb_selected" />
  27.

  28.     <item android:state_selected="true"
  29.           android:state_window_focused="true"
  30.           android:drawable="@drawable/seek_thumb_selected" />
  31.

  32.     <item android:drawable="@drawable/seek_thumb_normal" />
  33.

  34. </selector>

系统中自带的progress_horizontal.xml,内容如下:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <!-- Copyright (C) 2008 The Android Open Source Project

  3.      Licensed under the Apache License, Version 2.0 (the "License");
  4.      you may not use this file except in compliance with the License.
  5.      You may obtain a copy of the License at

  6.           http://www.apache.org/licenses/LICENSE-2.0

  7.      Unless required by applicable law or agreed to in writing, software
  8.      distributed under the License is distributed on an "AS IS" BASIS,
  9.      WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  10.      See the License for the specific language governing permissions and
  11.      limitations under the License.
  12. -->

  13. <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
  14.    
  15.     <item android:id="@android:id/background">
  16.         <shape>
  17.             <corners android:radius="5dip" />
  18.             <gradient
  19.                     android:startColor="#ff9d9e9d"
  20.                     android:centerColor="#ff5a5d5a"
  21.                     android:centerY="0.75"
  22.                     android:endColor="#ff747674"
  23.                     android:angle="270"
  24.             />
  25.         </shape>
  26.     </item>
  27.    
  28.     <item android:id="@android:id/secondaryProgress">
  29.         <clip>
  30.             <shape>
  31.                 <corners android:radius="5dip" />
  32.                 <gradient
  33.                         android:startColor="#80ffd300"
  34.                         android:centerColor="#80ffb600"
  35.                         android:centerY="0.75"
  36.                         android:endColor="#a0ffcb00"
  37.                         android:angle="270"
  38.                 />
  39.             </shape>
  40.         </clip>
  41.     </item>
  42.    
  43.     <item android:id="@android:id/progress">
  44.         <clip>
  45.             <shape>
  46.                 <corners android:radius="5dip" />
  47.                 <gradient
  48.                         android:startColor="#ffffd300"
  49.                         android:centerColor="#ffffb600"
  50.                         android:centerY="0.75"
  51.                         android:endColor="#ffffcb00"
  52.                         android:angle="270"
  53.                 />
  54.             </shape>
  55.         </clip>
  56.     </item>
  57.    
  58. </layer-list>
  59. 有了这两个文件的源代码,我们就可以依样画葫芦了
    首先在自己的工程下drawable文件夹中建立seek_bar.xml文件与thumb.xml文件
    我写的两个文件内容如下seekbar_img.xml
  60.    1. <?xml version="1.0" encoding="utf-8"?>
       2. <layer-list xmlns:android="http://schemas.android.com/apk/res/android">
       3.         <!-- 背景图 -->
       4.         <item android:id="@+android:id/background" android:drawable="@drawable/bg" />
       5.         <!--全部能量图  -->
       6.         <item android:id="@+android:id/SecondaryProgress"
       7.                 android:drawable="@drawable/bg" />
       8.         <!-- 进和能量图 -->
       9.         <item android:id="@+android:id/progress" android:drawable="@drawable/bg2" />
      10. </layer-list>
    thumb.xml
    1. <?xml version="1.0" encoding="UTF-8"?>
    2. <selector xmlns:android="http://schemas.android.com/apk/res/android">
    3.         <!-- 按下状态 -->
    4.         <item android:state_pressed="true" android:drawable="@drawable/bg3" />

    5.         <!-- 普通无焦点状态 -->
    6.         <item android:state_focused="false" android:state_pressed="false"
    7.                 android:drawable="@drawable/bg4" />
    8. </selector>




  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
Android,可以通过自定义SeekBar实现数字滑动功能。首先,在布局文件定义自定义SeekBar的样式,可以使用ProgressBar来实现。如下所示: ``` <ProgressBar android:id="@+id/customSeekBar" style="@style/Widget.AppCompat.ProgressBar.Horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:max="100" android:progress="50" android:progressDrawable="@drawable/custom_seekbar_progress" android:thumb="@drawable/custom_seekbar_thumb" /> ``` 在drawable文件夹下创建custom_seekbar_progress.xml和custom_seekbar_thumb.xml来定义SeekBar的背景和滑块样式。在custom_seekbar_progress.xml,可以使用shape和gradient标签来定义进度条的背景样式。在custom_seekbar_thumb.xml,可以使用shape标签来定义滑块的样式。 接下来,在Activity或Fragment找到SeekBar的实例,并设置OnSeekBarChangeListener监听器。在监听器,通过getProgress方法获取SeekBar的进度值,并根据需要进行相应的处理。例如,可以在TextView显示SeekBar的进度值,如下所示: ``` SeekBar customSeekBar = findViewById(R.id.customSeekBar); final TextView progressTextView = findViewById(R.id.progressTextView); customSeekBar.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() { @Override public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) { progressTextView.setText(String.valueOf(progress)); } @Override public void onStartTrackingTouch(SeekBar seekBar) { // 当开始滑动SeekBar时执行的操作 } @Override public void onStopTrackingTouch(SeekBar seekBar) { // 当结束滑动SeekBar时执行的操作 } }); ``` 通过设置OnSeekBarChangeListener监听器,可以在SeekBar滑动时实时更新进度值,并进行相应的处理操作。根据自己的需求,可以在onProgressChanged、onStartTrackingTouch和onStopTrackingTouch方法添加自定义的逻辑。 以上就是使用自定义SeekBar实现数字滑动的简单方法。可以根据自己的需求进行进一步的定制和优化。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值