Android UI(RatingBar)详解

来源:互联网 发布:匹诺曹软件下载 编辑:程序博客网 时间:2024/06/03 02:30
目录
    1.概述与应用场景
    2.常用的xml属性和方法
    3.简单实用
    4.自定义RatingBar
    
1.概述与应用场景
    RatingBar(评分条)他是progressbar和seekbar的扩展,用星型来表示评分等级,同时它有两种风格,一种可与用户交互,另一种
只是用于指示,不提供交互(后面会提及)。

2.常用的xml属性和方法
 2.1)常用xml属性
    android:isIndicator="false":设置是否为指示器,true表示不可与用户交互    android:rating="":默认的评分数    android:stepSize="":步长(点击一次增长的长度)    android:numStars="":表示星星的数量,超出显示范围是他会以最大数量显示,然后把星星分成numStars/stepSize份    style="?android:ratingBarStyleSmall|?android:ratingBarStyleIndicator|?android:ratingBarStyle":风格

 2.2)常用方法
         //设置是否为指示器模式,及不可交互        ratingBar1.setIsIndicator(false);        //设置评分条的最大范围        ratingBar1.setMax(20);        //设置星星数量        ratingBar1.setNumStars(10);        //设置当前等级        ratingBar1.setRating(1);        //设置步长        ratingBar1.setStepSize(1);        //获取星星数量        int num = ratingBar.getNumStars();        //获取步长        float step = ratingBar.getStepSize();        //获取当前评分,与参数rating一致        float currentRating = ratingBar.getRating();

        
3.简单实用
    3.1)布局文件
    <?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:paddingBottom="@dimen/activity_vertical_margin"    android:paddingLeft="@dimen/activity_horizontal_margin"    android:paddingRight="@dimen/activity_horizontal_margin"    android:paddingTop="@dimen/activity_vertical_margin"    tools:context="com.example.ratingbar.MainActivity">    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="SimpleRatingBar:"        android:id="@+id/SimpleRatingBar" />    <RatingBar        android:layout_marginTop="10dp"        style="?android:ratingBarStyle"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:isIndicator="false"        android:rating="1.0"        android:stepSize="1.0"        android:numStars="5"        android:id="@+id/ratingBar" />    <TextView        android:layout_marginTop="10dp"        android:layout_below="@+id/ratingBar"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="SmallRatingBar:"        android:id="@+id/SmallRatingBar" />    <RatingBar        android:layout_marginTop="10dp"        android:layout_below="@+id/SmallRatingBar"        style="?android:ratingBarStyleSmall"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:id="@+id/ratingBar1" />    <TextView        android:layout_marginTop="10dp"        android:layout_below="@+id/ratingBar1"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="ratingBarStyleIndicator:"        android:id="@+id/IndicatorRating" />    <RatingBar        android:layout_below="@+id/IndicatorRating"        android:layout_marginTop="10dp"        style="?android:ratingBarStyleIndicator"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:rating="1.0"        android:numStars="5"        android:id="@+id/ratingBar2" />    <TextView        android:layout_marginTop="10dp"        android:layout_below="@+id/ratingBar2"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="Hello World!"        android:id="@+id/textView" /></RelativeLayout>
   
    3.2)java类文件
package com.example.ratingbar;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.util.Log;import android.widget.RatingBar;import android.widget.TextView;public class MainActivity extends AppCompatActivity {    private RatingBar ratingBar,ratingBar1;    private TextView textView;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        //初始化控件        ratingBar = (RatingBar) findViewById(R.id.ratingBar);        ratingBar1 = (RatingBar) findViewById(R.id.ratingBar1);        textView = (TextView) findViewById(R.id.textView);        //ratingbar的常用方法        //设置是否为指示器模式,及不可交互        ratingBar1.setIsIndicator(false);        //设置评分条的最大范围        ratingBar1.setMax(20);        //设置星星数量        ratingBar1.setNumStars(10);        //设置当前等级        ratingBar1.setRating(1);        //设置步长        ratingBar1.setStepSize(1);        //设置监听器        ratingBar.setOnRatingBarChangeListener(new RatingBar.OnRatingBarChangeListener() {            @Override            public void onRatingChanged(RatingBar ratingBar, float rating, boolean fromUser) {                //获取星星数量                int num = ratingBar.getNumStars();                //获取步长                float step = ratingBar.getStepSize();                //获取当前评分,与参数rating一致               // float currentRating = ratingBar.getRating();                Log.d("debug","num="+num+",step="+step+",rating="+rating);                textView.setText(""+rating);            }        });    }}
 
    3.3)效果截图

4.自定义RatingBar
    4.1)导入两张分别为选择和未选中的图片rating.png rating_selected.png
    
    4.2)定义rating_layer.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"    android:drawable="@drawable/rating" /><item android:id="@android:id/secondaryProgress"    android:drawable="@drawable/rating" /><item android:id="@android:id/progress"    android:drawable="@drawable/rating_selected" /></layer-list>
   
    4.3)在styles.xml实现自定义的RatingBar style
 
<resources>    <!-- Base application theme. -->    <style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">        <!-- Customize your theme here. -->        <item name="colorPrimary">@color/colorPrimary</item>        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>        <item name="colorAccent">@color/colorAccent</item>    </style>    <!--    注意:@android:style/Widget.Material.RatingBar必须minSdkVersion 21及以上      才能用,目前由于需要向下兼容的问题也不太推荐使用,这里我们用@android:style/Widget.RatingBar      或其他style    -->    <style name="MyRatingBarStyle" parent="@android:style/Widget.RatingBar">        <item name="android:progressDrawable">@drawable/rating_layer</item>        <item name="android:minHeight">48dp</item>        <item name="android:maxHeight">48dp</item>    </style></resources>
    
    4.4)主布局activity_second中应用style  
<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"    xmlns:tools="http://schemas.android.com/tools"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:paddingBottom="@dimen/activity_vertical_margin"    android:paddingLeft="@dimen/activity_horizontal_margin"    android:paddingRight="@dimen/activity_horizontal_margin"    android:paddingTop="@dimen/activity_vertical_margin"    tools:context="com.example.ratingbar.MainActivity">    <TextView        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:text="SimpleRatingBar:"        android:id="@+id/SimpleRatingBar" />    <RatingBar        android:layout_marginTop="20dp"        style="@style/MyRatingBarStyle"        android:layout_width="wrap_content"        android:layout_height="wrap_content"        android:isIndicator="false"        android:rating="1.0"        android:stepSize="1.0"        android:numStars="6"        android:id="@+id/ratingBar" /></RelativeLayout>
  
    4.5)主Activity的java类SecondActivity.java
    
package com.example.ratingbar;import android.os.Bundle;import android.support.v7.app.AppCompatActivity;import android.util.Log;import android.widget.RatingBar;import android.widget.TextView;import android.widget.Toast;public class SecondActivity extends AppCompatActivity {    private RatingBar ratingBar,ratingBar1;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_second);        //初始化控件        ratingBar = (RatingBar) findViewById(R.id.ratingBar);        //设置监听器        ratingBar.setOnRatingBarChangeListener(new RatingBar.OnRatingBarChangeListener() {            @Override            public void onRatingChanged(RatingBar ratingBar, float rating, boolean fromUser) {                Toast.makeText(SecondActivity.this,"点击了RatingBar",Toast.LENGTH_SHORT).show();            }        });    }}


    4.6)效果截图    
   
0 0
原创粉丝点击