Android：＜5＞商品评价页面

我们前面学习了开关按钮和评价条，现在就让我们来练练手，

这个页面有标题、按钮、图片、评价条、评价结果组成，由于界面比较简单，我们可以将布局设定为线性布局；

这里的处理逻辑就是我们在没有打开按钮的时候我们的评价条是不可以操作的，评价条有一个属性是用过来设置评价条为指示模式，也就是不让用户操作的：

android:isIndicator="true"

当我们打开了开关按钮的时候，我们的图片会跟着变换，没有开的时候是一个没有发光的灯泡，开的时候就是现在这样，当我们点击或者滑动评价条的时候，下面的一串红字会显示响应的情况，含有差、一般、好、较好、很好，话不多说，我们直接开整：

1、布局部分

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MySwitchActivity"
    android:orientation="vertical">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="商品评价"
        android:textSize="30sp"

        android:layout_marginTop="20dp"/>
    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_marginTop="10dp"
        >
        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="点击开始评价"
            android:textSize="20dp"/>
        <ToggleButton
            android:layout_width="100dp"
            android:layout_height="50dp"
            android:id="@+id/tgb_mylight2"
            android:textOn=""
            android:textOff=""
            android:background="@drawable/myicon2"/>
    </LinearLayout>
    <ImageView
        android:layout_width="300dp"
        android:layout_height="400dp"
        android:layout_gravity="center_horizontal"
        android:src="@drawable/lightoff2"
        android:id="@+id/iv_myimage2"
        android:layout_marginTop="20dp"/>

    <RatingBar
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="10dp"
        android:numStars="5"
        android:stepSize="1"
        android:rating="0"
        android:isIndicator="true"
        android:id="@+id/rb_mystars2"
        style="?android:indicatorStart"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="您还未评价:    "
        android:textColor="#ff0000"
        android:textSize="20sp"
        android:id="@+id/tv_mycomments"
        android:layout_marginTop="10dp"/>

</LinearLayout>

第一个是TextView我们的标题，第二个用布局嵌套，第三个是Imageview，第四个是评价条Ratinbar,最后一个也可以用文本标签来做，我们后面只需要在我们的评价条监听函数里面对评价结果进行更新操作就可以了；

代码很简单，如果没有素材的话，可以关注公众号：代码栈。回复开关按钮既可以领取源代码和素材；

2、逻辑部分：

我们同样先定义好各个变量，然后通过初始化函数将对象拿到，我们处理的逻辑是监听开关按钮和评价条按钮，如果我们没有开启开关的话，我们将上面的那个属性设置为true如果打开了就设置为false;当然不要忘了设置我们的图片，按钮图片我们用了选择器，如果不懂得话，请看前一期，

    public void initPramarters(){
        tgb_mylight2=findViewById(R.id.tgb_mylight2);
        iv_myimage2=findViewById(R.id.iv_myimage2);
        rb_mystars2=findViewById(R.id.rb_mystars2);
        tv_mycomments=findViewById(R.id.tv_mycomments);
    }
 tgb_mylight2.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            @Override
            public void onCheckedChanged(CompoundButton compoundButton, boolean b) {
                if(b){
                    Toast.makeText(MySwitchActivity.this, "您已经打开评价，可以评价了！", Toast.LENGTH_SHORT).show();
                    //设置为星星为评价作用
                    rb_mystars2.setIsIndicator(false);
                    //设置展示图片为开灯
                    iv_myimage2.setImageResource(R.drawable.lighton2);
                }else{
                    //设置图片为关灯
                    iv_myimage2.setImageResource(R.drawable.lightoff2);
                    //设置为指示作用，不可评价
                    rb_mystars2.setIsIndicator(true);
                    Toast.makeText(MySwitchActivity.this, "评价关闭", Toast.LENGTH_SHORT).show();
                }
            }
        });

在评价条监听函数里面，我们设置一个Switch，里面是对各种评价情况的函数处理，使用settext()函数可以准确的设置各种评分的情况：

 rb_mystars2.setOnRatingBarChangeListener(new RatingBar.OnRatingBarChangeListener() {
            @Override
            public void onRatingChanged(RatingBar ratingBar, float v, boolean b) {
                //获取开关的状态
                myswitch = tgb_mylight2.isChecked();
                //对评分进行处理
                if(myswitch){
                    switch ((int)v){
                        case 1:
                            tv_mycomments.setText(comments+"差");
                            break;
                        case 2:
                            tv_mycomments.setText(comments+"一般");
                            break;
                        case 3:
                            tv_mycomments.setText(comments+"好");
                            break;
                        case 4:
                            tv_mycomments.setText(comments+"较好");
                            break;
                        case 5:
                            tv_mycomments.setText(comments+"很好");
                            break;

                    }
                }
            }
        });

布局的样式其实因人而异，比如我设置字体为30sp,其实你们可以设置50sp，我设置间距为10dp，你们可以20dp，代码其实很灵活，我这里只是给出一个参考，如果你们遇到问题的话，也许可以再我的代码里面找到答案，当然，我相信你们可以做到更好，对于一些比较懒的人我呢也帮大家存储了素材，方便大家学习；

好了，今天分享就到这里，欢迎大家反馈，或许又不懂的可以翻一翻前面的博客，因为知识是积累起来的。