Android自定义星星可滑动评分控件

概述本文实例为大家分享了Android自定义星星可滑动评分控件的具体方法，供大家参考，具体内容如下

本文实例为大家分享了AndroID自定义星星可滑动评分控件的具体方法，供大家参考，具体内容如下

此控件通过线性布局结合ImageVIEw来实现。

具有展示分数，滑动评分功能，可设置0-10分，自行设置星星图片，是否可点击与滑动，星星间距。

效果如下：

需准备好下面三张图片

先看自定义属性：

<?xml version="1.0" enCoding="utf-8"?><resources>  <declare-styleable name="StarratingVIEw">    <!--星星点亮-->    <attr name="stat_on" format="reference"></attr>    <!--星星关闭-->    <attr name="stat_off" format="reference"></attr>    <!--半颗星星-->    <attr name="stat_half" format="reference"></attr>    <!--是否可以点击滑动评分-->    <attr name="ratable" format="boolean"></attr>    <!--星星之间间距-->    <attr name="star_padding" format="dimension"></attr>  </declare-styleable></resources>

布局文件

<?xml version="1.0" enCoding="utf-8"?><relativeLayout xmlns:androID="http://schemas.androID.com/apk/res/androID"  xmlns:star="http://schemas.androID.com/apk/res/com.le.star"  androID:ID="@+ID/activity_main"  androID:layout_wIDth="match_parent"  androID:layout_height="match_parent"  androID:gravity="center_horizontal">  <com.le.star.StarratingVIEw    androID:ID="@+ID/srv"    androID:layout_wIDth="wrap_content"    androID:layout_height="wrap_content"    androID:layout_margintop="20dp"    star:stat_on="@drawable/frodo_rate_star_small_on_holo_light"    star:stat_off="@drawable/frodo_rate_star_small_off_holo_light"    star:stat_half="@drawable/frodo_rate_star_small_half_holo_light"    star:star_padding="10dp"    star:ratable="false"    >  </com.le.star.StarratingVIEw>  <button    androID:ID="@+ID/btn"    androID:layout_wIDth="wrap_content"    androID:layout_height="wrap_content"    androID:layout_margintop="20dp"    androID:layout_below="@ID/srv"    androID:text="click"    />  <TextVIEw    androID:ID="@+ID/tv"    androID:layout_wIDth="wrap_content"    androID:layout_height="wrap_content"    androID:layout_margintop="50dp"    androID:layout_below="@ID/btn"    androID:textSize="20sp"    />  <com.le.star.StarratingVIEw    androID:ID="@+ID/srv_ratable"    androID:layout_wIDth="wrap_content"    androID:layout_height="wrap_content"    androID:layout_below="@ID/tv"    androID:layout_margintop="20dp"    star:stat_on="@drawable/frodo_rate_star_big_on_holo_light"    star:stat_off="@drawable/frodo_rate_star_big_off_holo_light"    star:stat_half="@drawable/frodo_rate_star_big_half_holo_light"    star:star_padding="10dp"    star:ratable="true"    >  </com.le.star.StarratingVIEw></relativeLayout>

第一个控件star:ratable设置为false，只具备展示功能。第二个为true，可进行滑动评分并把分数显示到TextVIEw上。

下面是控件代码

public class StarratingVIEw extends linearLayout{  private Drawable on,off,half;  //星星三种图片  private boolean ratable;  //是否点击滑动  private float padding; //星星之间间距  private List<ImageVIEw> List;  //存放五颗星星  private float points[] = new float[11];  //0-10分点的x坐标，index为分数，值为此分数为坐标  private float starWIDth;  //设置的星星图片宽度  private float halfStarWIDth;  //半个星星宽度  private int paddingleft;    //控件左padding  private OnRatechangelistener onRatechangelistener;  public StarratingVIEw(Context context) {    super(context);  }  public StarratingVIEw(Context context,AttributeSet attrs) {    super(context,attrs);    TypedArray array = context.obtainStyledAttributes(attrs,R.styleable.StarratingVIEw);    on = array.getDrawable(R.styleable.StarratingVIEw_stat_on);    off = array.getDrawable(R.styleable.StarratingVIEw_stat_off);    half = array.getDrawable(R.styleable.StarratingVIEw_stat_half);    ratable = array.getBoolean(R.styleable.StarratingVIEw_ratable,false);    halfStarWIDth = on.getIntrinsicWIDth() / 2;    starWIDth = on.getIntrinsicWIDth();    padding = array.getDimension(R.styleable.StarratingVIEw_star_padding,starWIDth / 3);    paddingleft = getpaddingleft();    List = new ArrayList<>();    ImageVIEw imageVIEw;    //初始化五个星星，并通过points数组把分数与坐标对应起来    for(int i=0;i<5;i++){      imageVIEw = new ImageVIEw(context);      linearLayout.LayoutParams layoutParams = new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);      if(i!=0&&i!=4) {        //设置间距        layoutParams.setmargins((int) padding / 2,(int) padding / 2,0);        //分数点所在的x坐标        points[i*2] = i*starWIDth+i*padding;        points[i*2+1] = points[i*2]+halfStarWIDth/2;      }      //第一个左边和最后一个右边不设置间距      if(i==0){        layoutParams.setmargins(0,0);        points[0] = 0;        points[1] = halfStarWIDth;      }      if(i==4){        layoutParams.setmargins((int) padding / 2,0);        points[i*2] = i*starWIDth+i*padding;        points[i*2+1] = points[i*2]+halfStarWIDth/2;        points[10] = points[9]+halfStarWIDth/2;      }      imageVIEw.setLayoutParams(layoutParams);      imageVIEw.setimageDrawable(off);      List.add(imageVIEw);      addVIEw(List.get(i));    }    setorIEntation(linearLayout.HORIZONTAL);    array.recycle();  }  /**   *根据分数显示星星   * @param rate   */  public voID setRate(int rate){    removeAllVIEws();    int count = rate/2;    boolean isOdd;    if(rate%2==0){      isOdd = false;    }else{      isOdd = true;    }    for(int i=0;i<List.size();i++){      if(i<count){        List.get(i).setimageDrawable(on);      }else{        List.get(i).setimageDrawable(off);      }      if(isOdd&&i==count){        List.get(i).setimageDrawable(half);      }      addVIEw(List.get(i));    }    if(ratable&&onRatechangelistener!=null){      onRatechangelistener.onRateChange(rate);    }  }  public voID setonRatechangelistener(OnRatechangelistener l){    onRatechangelistener = l;  }  @OverrIDe  public boolean ontouchEvent(MotionEvent event) {    //设置不可以滑动则不处理事件    if(!ratable){      return super.ontouchEvent(event);    }    setRate(calculateStar(event.getX()));    return true;  }  /**   * 根据坐标计算分数   * @param x   * @return   */  private int calculateStar(float x) {    //减去控件左padding    float realposition = x-paddingleft;    for(int i = 0;i<points.length;i++){      if(points[i]>realposition){        return i;      }    }    //如果循环结束即为右滑超出最大值，返回10分    return 10;  }  /**   * 评分改变的回调   */  public interface OnRatechangelistener{    voID onRateChange(int rate);  }}

基本实现原理是通过坐标计算分数，然后根据分数设置每个ImageVIEw显示不同三张星星图片，根据ratable变量判断是否处理触摸事件，通过触摸位置在坐标数组point[]的位置，确定index，即为分数。并通过OnRatechangelistener通知分数的改变。

最后为Activity代码

public class MainActivity extends AppCompatActivity { private int count; @OverrIDe protected voID onCreate(Bundle savedInstanceState) {  super.onCreate(savedInstanceState);  setContentVIEw(R.layout.activity_main);  final StarratingVIEw srv = (StarratingVIEw) findVIEwByID(R.ID.srv);  findVIEwByID(R.ID.btn).setonClickListener(new VIEw.OnClickListener() {   @OverrIDe   public voID onClick(VIEw v) {    count++;    srv.setRate(count);   }  });  final TextVIEw tv = (TextVIEw) findVIEwByID(R.ID.tv);  StarratingVIEw srv_ratable = (StarratingVIEw) findVIEwByID(R.ID.srv_ratable);  srv_ratable.setonRatechangelistener(new StarratingVIEw.OnRatechangelistener() {   @OverrIDe   public voID onRateChange(int rate) {    tv.setText(rate+"分");   }  }); }}

GitHub地址StarRatingView

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程小技巧。

您可能感兴趣的文章:Android星级评分条控件RatingBar使用详解Android RatingBar星星评分控件实例代码Android UI控件RatingBar实现自定义星星评分效果Android自定义星星评分控件Android评分控件RatingBar使用实例解析Android控件之RatingBar自定义星级评分样式 总结

以上是内存溢出为你收集整理的Android自定义星星可滑动评分控件全部内容，希望文章能够帮你解决Android自定义星星可滑动评分控件所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。