Android 学习笔记—— SeekBar(进度条)/RatingBar(星级评分条)

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Android 学习笔记—— SeekBar(进度条)/RatingBar(星级评分条)相关的知识,希望对你有一定的参考价值。

作者:夏至  欢迎转载,也请保留这段申明,谢谢

1.SeekBar(进度条)

  SeekBar即所谓的进度条啦,大家应该对它都不陌生,我们的音乐播放器中的音量调节和视频播放时的进度条都是用它来显示的,这里我们简单的应用这个Demo实现上诉的内容。先来看个效果图和API中的关系图
技术分享技术分享

    可以看到第二个继承关系图中,seekbar是属于progressbar的子类,那我们上一节progressbar中的属性,这里都是可以调用的。
    Ok,这里我们先来写布局程序
    
  1. <TextView
  2.     android:id="@+id/text1"
  3.     android:layout_width="match_parent"
  4.     android:layout_height="wrap_content"/>
  5. <TextView
  6.     android:id="@+id/text2"
  7.     android:layout_width="match_parent"
  8.     android:layout_height="wrap_content"/>

  9. <SeekBar
  10.     android:id="@+id/seekbar1"
  11.     android:layout_width="match_parent"
  12.     android:layout_height="wrap_content"
  13.     android:max="100"
  14.     android:progress="20"
  15. />
  16. <SeekBar
  17.     android:id="@+id/seekbar2"
  18.     android:layout_width="match_parent"
  19.     android:layout_height="wrap_content"
  20.     android:layout_marginTop="10dp"
  21.     android:max="100"
  22.     android:progress="20"
  23.     android:secondaryProgress="30"
  24. />

其中,如果我们觉得上面的空间太难看,也可以用android:thumb="@drawable/" 来自定义图片,不过一般图片太大,又不能自动缩放,所以也少用就是了。

SeekBar的方法
     onProgressChanged:进度发生改变时会触发
    onStartTrackingTouch:按住SeekBar时会触发
    onStopTrackingTouch:放开SeekBar时触发

那么我们来看主活动的程序
  1. textView1 = (TextView)findViewById(R.id.text1);
  2. textView2 = (TextView)findViewById(R.id.text2);
  3. seekBar1 = (SeekBar)findViewById(R.id.seekbar1);
  4. seekBar2 = (SeekBar)findViewById(R.id.seekbar2);
  5. seekBar1.setOnSeekBarChangeListener(this);
  6. seekBar2.setOnSeekBarChangeListener(this);
  7. //当滑条发生变化时的事件
  8. public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
  9. switch (seekBar.getId()){
  10.     case R.id.seekbar1:
  11.         textView1.setText("滑条1当前进度 : "+progress+"%");
  12. break;
  13. case R.id.seekbar2:
  14.         textView2.setText("滑条2当前进度 : " + progress + "%");
  15.         //seekBar2.getProgress()+(int)(seekBar2.getProgress()*0.3) 显示缓冲条
  16.         seekBar2.setSecondaryProgress(seekBar2.getProgress()+(int)(seekBar2.getProgress()*0.3));
  17. break;
  18.     }
  19. }
  20. @Override
  21. public void onStartTrackingTouch(SeekBar seekBar) {
  22. switch (seekBar.getId()){
  23.     case R.id.seekbar1:
  24.         textView1.setText("滑条1开始滑动" );
  25. break;
  26. case R.id.seekbar2:
  27.         textView2.setText("滑条2开始滑动 ");
  28. break;
  29.     }
  30. }
  31. @Override
  32. public void onStopTrackingTouch(SeekBar seekBar) {
  33. switch (seekBar.getId()){
  34.     case R.id.seekbar1:
  35.         textView1.setText("滑条1停止滑动" );
  36. break;
  37. case R.id.seekbar2:
  38.         textView2.setText("滑条2停止滑动 ");
  39. break;
  40.     }
  41. }

这样就实现上面的功能啦。效果如图:
技术分享

2.RatingBar(星级评分条)
    星级评分条,对我们这些宅男来说,淘宝某道具店里,总能看到我们的评分。由于ratingbar都是progressbar的子类,很多东西都是一样。
技术分享

我们来实现上面的功能。首先,还是先写布局文件
  1. <TextView
  2.     android:layout_width="match_parent"
  3.     android:layout_height="wrap_content"
  4.     android:text="请为我的Demo评分"
  5.     android:textSize="24sp"
  6. />
  7. <RatingBar
  8.     android:id="@+id/ratingbar"
  9.     android:layout_width="wrap_content"
  10.     android:layout_height="wrap_content"
  11. />

接着就是主活动的程序,这里只需要在SeekBar 那里修改一下就行。
  1. RatingBar ratingBar = (RatingBar)findViewById(R.id.ratingbar);
  2. ratingBar.setOnRatingBarChangeListener(this);
  3. }
  4. @Override
  5. //ratingBar 几星
  6. public void onRatingChanged(RatingBar ratingBar, float rating, boolean fromUser) {
  7. Toast.makeText(MainActivity.this,"你的评分是: "+rating+"星",
  8. Toast.LENGTH_SHORT).show();
  9. }

是不是超级简单 ,好了,实践一下吧。
技术分享


如有错误,欢迎指出,如果喜欢,欢迎收藏!































































以上是关于Android 学习笔记—— SeekBar(进度条)/RatingBar(星级评分条)的主要内容,如果未能解决你的问题,请参考以下文章

android自己定义进度值可拖动的seekbar

android自定义进度值可拖动的seekbar

android自定义进度值可拖动的seekbar

Android SeekBar,动态显示进度且随SeekBar一起移动

Android ProgressBar SeekBar

Android Seekbar进度条末端显示不全的解决方法