Android入门（37）——第十四章 使用SeekBar制作可拖动的进度条

1.简介：



2.主要属性和方法：



3. 主要事件：



4. 案例一：

第一步：设置布局文件main：添加一个seekBra控件和两个TextView控件。

<?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" >

<SeekBar
android:id="@+id/seekBra"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:max="100"
android:progress="50" />

<TextView
android:id="@+id/tv1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>

<TextView
android:id="@+id/tv2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>

第二步：设置MainActivity活动文件：

package com.example.seekbar;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.widget.SeekBar;
import android.widget.SeekBar.OnSeekBarChangeListener;
import android.widget.TextView;

public class MainActivity extends Activity implements OnSeekBarChangeListener {

private SeekBar seekBar;
private TextView tv1;
private TextView tv2;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

tv1 = (TextView) findViewById(R.id.tv1);
tv2 = (TextView) findViewById(R.id.tv2);
seekBar = (SeekBar) findViewById(R.id.seekBra);
seekBar.setOnSeekBarChangeListener(this);
}

// 数值改变调用
@Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
// TODO Auto-generated method stub
tv2.setText("当前数值：" + progress);
tv1.setText("正在拖动");
}

// 开始拖动调用
@Override
public void onStartTrackingTouch(SeekBar arg0) {
// TODO Auto-generated method stub
tv1.setText("开始拖动");
}

// 停止拖动调用
@Override
public void onStopTrackingTouch(SeekBar arg0) {
// TODO Auto-generated method stub
tv1.setText("停止拖动");
}

}

效果图：





5. 自定义SeekBar进度条：



案例二：

第一步：首先学会查看默认的进度条的设置：对于第一个属性style，后面现在跟的就是默认的样式，通过ctrl+左键便可以访问样式的定义。

<SeekBar
style="@android:style/Widget.SeekBar"
android:id="@+id/seekBra"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:max="100"
android:progress="50" />

默认样式定义：其中我们要修改的是progressDrawable和thumb属性：

<style name="Widget.SeekBar">
<item name="android:indeterminateOnly">false</item>
<item name="android:progressDrawable">@android:drawable/progress_horizontal</item>
<item name="android:indeterminateDrawable">@android:drawable/progress_horizontal</item>
<item name="android:minHeight">20dip</item>
<item name="android:maxHeight">20dip</item>
<item name="android:thumb">@android:drawable/seek_thumb</item>
<item name="android:thumbOffset">8dip</item>
<item name="android:focusable">true</item>
<item name="android:mirrorForRtl">true</item>
</style>

然后继续查看progressDrawable属性后面的值

@android:drawable/progress_horizontal

可以查看具体的设置文件progress_horizontal.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.
-->

<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>

注意点：thumb属性后面的那个文件无法通过ctrl+左键来访问，那么可以去那个什么帮助文档里去寻找，具体寻找方式看视频吧。

注意点二：关于这里这个thumb样式的修改，我们可以用选择器，设置按下和未按下时图案的变化，之前有介绍过的。





然后去main布局文件中修改SeekBar的属性：