在本教程中，我们将使用Kotlin在Android应用程序中讨论和实现RatingBar。

什么是Android RatingBar？

Android RatingBar是SeekBar的扩展。
SeekBar是ProgressBar的扩展。

评级列用于创建审阅/评级UI，用户可以在该UI上拖动鼠标，除非没有明确的拇指图标。

等级列状态

RatingBar具有三种状态：完全，空和部分状态。

等级列的等级是浮点值。

等级列XML属性

等级列的重要XML属性是：

• android：numStars-您希望在屏幕上显示的星级评分。
  如果将RatingBar宽度设置为与父项匹配，则该属性将被忽略，并且星数为10。

• android：rating-这是一个浮点数。
  这里的值充满了那么多星星。

• android：stepSize-每个星星的大小。
  默认情况下，该值为0.5。
  将其设置为1不能再部分填充星星。
  此属性应介于0和1之间。

• android：progressTint-填充的星星的颜色。

• android：progressBackgroundTint-未填充的星星的颜色。

• android：secondaryProgressTint-此处传递的颜色会在部分填充的星星上添加边框。

• android：isIndicator-将其设置为true表示RatingBar仅用于显示。
  您无法填写评分。

• android：progressDrawable-我们在此处传递自定义星星的drawable。

• style-用于在RatingBar上设置自定义/内置样式。
  除了默认的样式外，还有另外两个：Small，Indicator。
  我们也可以创建自己的自定义样式。

Kotlin代码创建评分列

实现了OnRatingBarChangeListener接口，并且必须重写以下Kotlin函数。

override fun onRatingChanged(p0: RatingBar?, p1: Float, p2: Boolean)

如果用户更改了评分，则布尔值为true。

等级列XML示例

让我们看看使用XML代码的不同类型的RatingBar。

1.简单的评分列

<RatingBar
      android:id="@+id/ratingBar1"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:rating="1"
      android:stepSize="1" 

2.带有背景和二次进度色调的评分列

<RatingBar
      android:id="@+id/ratingBar3"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:background="@color/colorPrimary"
      android:numStars="3"
      android:secondaryProgressTint="@android:color/white"
      android:stepSize="0.2" 

3.具有进度和二级进度色调的RatingBar

<RatingBar
      android:id="@+id/ratingBar4"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:numStars="5"
      android:progressBackgroundTint="@android:color/black"
      android:progressTint="@android:color/holo_green_dark"
      android:rating="1"
      android:stepSize="0.5" 

  <RatingBar
      android:id="@+id/ratingBar5"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:numStars="5"
      android:progressBackgroundTint="@android:color/white"
      android:progressTint="@android:color/holo_green_dark"
      android:rating="2.5"
      android:secondaryProgressTint="@color/colorPrimaryDark"
      android:stepSize="0.5" 

默认情况下，辅助进度色是在styles.xml中设置的" colorAccent"。

4.评级列小样式

<RatingBar
      android:id="@+id/ratingBar7"
      style="@android:style/Widget.Material.RatingBar.Small"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginTop="8dp"
      android:isIndicator="false"
      android:numStars="5"
      android:rating="1"
      android:stepSize="0.5" 

5.自定义评分列

Android RatingBar Kotlin项目结构

1. XML布局代码

下面给出了布局activity_main.xml的代码。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:tools="http://schemas.android.com/tools"
  android:id="@+id/linearLayout"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:layout_margin="16dp"
  android:gravity="center"
  android:orientation="vertical"
  tools:context=".MainActivity">

  <TextView
      android:id="@+id/textView"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:text="0"
      android:textSize="32sp"

  <RatingBar
      android:id="@+id/ratingBar1"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:rating="1"
      android:stepSize="1" 

  <RatingBar
      android:id="@+id/ratingBar2"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:numStars="5" 

  <RatingBar
      android:id="@+id/ratingBar3"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:background="@color/colorPrimary"
      android:numStars="3"
      android:rating="0.4"
      android:secondaryProgressTint="@android:color/white"
      android:stepSize="0.2" 

  <RatingBar
      android:id="@+id/ratingBar4"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:numStars="5"
      android:progressBackgroundTint="@android:color/black"
      android:progressTint="@android:color/holo_green_dark"
      android:rating="1"
      android:stepSize="0.5" 

  <RatingBar
      android:id="@+id/ratingBar5"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:numStars="5"
      android:progressBackgroundTint="@android:color/white"
      android:progressTint="@android:color/holo_green_dark"
      android:rating="2.5"
      android:secondaryProgressTint="@color/colorPrimaryDark"
      android:stepSize="0.5" 

  <RatingBar
      android:id="@+id/ratingBar6"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:isIndicator="true"
      android:numStars="5"
      android:rating="0.7"
      android:stepSize="0.7" 

  <RatingBar
      android:id="@+id/ratingBar7"
      style="@android:style/Widget.Material.RatingBar.Small"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginTop="8dp"
      android:isIndicator="false"
      android:numStars="5"
      android:rating="1"
      android:stepSize="0.5" 

  <RatingBar
      android:id="@+id/ratingBar8"
      style="@style/CustomRatingBar"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginTop="8dp"
      android:numStars="5"
      android:progressBackgroundTint="@android:color/holo_orange_dark" 

  <RatingBar
      android:id="@+id/ratingBar9"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:layout_marginTop="8dp"
      android:numStars="5"
      android:progressBackgroundTint="@android:color/black"
      android:progressDrawable="@drawable/ic_action_happy"
      android:progressTint="@color/colorPrimary"
      android:rating="1" 

</LinearLayout>

自定义RatingBar需要在styles.xml中设置progressDrawable及其其他属性，否则它将无法正常工作。
最后的RatingBar在以上布局中不起作用。

在styles.xml文件中添加以下代码。

<style name="CustomRatingBar" parent="Widget.AppCompat.RatingBar">
      <item name="android:progressDrawable">@drawable/custom_ratingbar</item>
      <item name="colorControlNormal">#f57c00</item>
      <item name="colorControlActivated">#c51162</item>
  </style>

我们还创建了一个custom_ratingbar.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">
      <bitmap
          android:src="@drawable/ic_action_happy"
          android:tint="?attr/colorControlNormal" 
  </item>
  <item android:id="@android:id/secondaryProgress">
      <bitmap
          android:src="@drawable/ic_action_happy"
          android:tint="?attr/colorControlHighlight" 
  </item>
  <item android:id="@android:id/progress">
      <bitmap
          android:src="@drawable/ic_action_happy"
          android:tint="?attr/colorControlActivated" 
  </item>
</layer-list>

注意：在位图android：src上，您无法设置可绘制的矢量图像。

在本教程的结尾，您可以找到带有项目源代码的自定义星星的图像资产。

2. Kotlin活动代码

MainActivity.kt文件的代码如下。

package net.androidly.androidlyratingbar

import android.support.v7.app.AppCompatActivity
import android.os.Bundle
import android.widget.RatingBar
import kotlinx.android.synthetic.main.activity_main.*

class MainActivity : AppCompatActivity(), RatingBar.OnRatingBarChangeListener {

  override fun onCreate(savedInstanceState: Bundle?) {
      super.onCreate(savedInstanceState)
      setContentView(R.layout.activity_main)

      ratingBar1.onRatingBarChangeListener = this
      ratingBar2.onRatingBarChangeListener = this
      ratingBar3.onRatingBarChangeListener = this
      ratingBar4.onRatingBarChangeListener = this
      ratingBar5.onRatingBarChangeListener = this
      ratingBar6.onRatingBarChangeListener = this
      ratingBar7.onRatingBarChangeListener = this
      ratingBar8.onRatingBarChangeListener = this
      ratingBar9.onRatingBarChangeListener = this

  }

  override fun onRatingChanged(p0: RatingBar?, p1: Float, p2: Boolean) {

      textView.text = "$p1"
  }
}