Android中的自定义评分栏

时间:2014-04-16 15:41:23

标签: android ratingbar

我需要制作自定义评级栏,如下图所示。

正如你所看到的,我需要制作这些彩色矩形而不是星星。每种颜色代表一些评级。

正如您所看到的,目前的评级是3.5,它的浅绿色。以前的评级为3.0,其较浅的绿色。下一个评级是4.0,它是灰色的,因为用户没有选择该评级。

我怎么能做出这样的事情?

enter image description here

1 个答案:

答案 0 :(得分:0)

我使用视图完成了此自定义评级栏。我同意这是粗暴的做法,但我相信它可以做得更好。你现在可以用它。如果您需要源代码,请告诉我。

<LinearLayout
        android:id="@+id/linearLayout1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:weightSum="17" >

        <View
            android:id="@+id/View01"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:background="#ff888888"
            android:clickable="true" />

        <Space
            android:layout_width="5dp"
            android:layout_height="40dp"
            android:layout_weight="1" />

        <View
            android:id="@+id/View02"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:background="#ff888888"
            android:clickable="true" />

        <Space
            android:layout_width="5dp"
            android:layout_height="40dp"
            android:layout_weight="1" />

        <View
            android:id="@+id/View03"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:background="#ff888888"
            android:clickable="true" />

        <Space
            android:layout_width="5dp"
            android:layout_height="40dp"
            android:layout_weight="1" />

        <View
            android:id="@+id/View04"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:background="#ff888888"
            android:clickable="true" />

        <Space
            android:layout_width="5dp"
            android:layout_height="40dp"
            android:layout_weight="1" />

        <View
            android:id="@+id/View05"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:background="#ff888888"
            android:clickable="true" />

        <Space
            android:layout_width="5dp"
            android:layout_height="40dp"
            android:layout_weight="1" />

        <View
            android:id="@+id/View06"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:background="#ff888888"
            android:clickable="true" />

        <Space
            android:layout_width="5dp"
            android:layout_height="40dp"
            android:layout_weight="1" />

        <View
            android:id="@+id/View07"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:background="#ff888888"
            android:clickable="true" />

        <Space
            android:layout_width="5dp"
            android:layout_height="40dp"
            android:layout_weight="1" />

        <View
            android:id="@+id/View08"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:background="#ff888888"
            android:clickable="true" />

        <Space
            android:layout_width="5dp"
            android:layout_height="40dp"
            android:layout_weight="1" />

        <View
            android:id="@+id/View09"
            android:layout_width="40dp"
            android:layout_height="40dp"
            android:layout_weight="1"
            android:background="#ff888888"
            android:clickable="true" />
    </LinearLayout>

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.MainActivity);

        view01 = (View) findViewById(R.id.View01);
    view02 = (View) findViewById(R.id.View02);
    view03 = (View) findViewById(R.id.View03);
    view04 = (View) findViewById(R.id.View04);
    view05 = (View) findViewById(R.id.View05);
    view06 = (View) findViewById(R.id.View06);
    view07 = (View) findViewById(R.id.View07);
    view08 = (View) findViewById(R.id.View08);
    view09 = (View) findViewById(R.id.View09);
    tv = (TextView) findViewById(R.id.textView);

    view01.setOnClickListener(this);
    view02.setOnClickListener(this);
    view03.setOnClickListener(this);
    view04.setOnClickListener(this);
    view05.setOnClickListener(this);
    view06.setOnClickListener(this);
    view07.setOnClickListener(this);
    view08.setOnClickListener(this);
    view09.setOnClickListener(this);
}

@Override
public void onClick(View v) {
    switch (v.getId()) {
    case R.id.View01:
        view01.setBackgroundColor(0xffff0000);
        view02.setBackgroundColor(Color.GRAY);
        view03.setBackgroundColor(Color.GRAY);
        view04.setBackgroundColor(Color.GRAY);
        view05.setBackgroundColor(Color.GRAY);
        view06.setBackgroundColor(Color.GRAY);
        view07.setBackgroundColor(Color.GRAY);
        view08.setBackgroundColor(Color.GRAY);
        view09.setBackgroundColor(Color.GRAY);
        tv.setText("0.5");
        break;
    case R.id.View02:
        view01.setBackgroundColor(0xffff0000);
        view02.setBackgroundColor(0xffff8000);
        view03.setBackgroundColor(Color.GRAY);
        view04.setBackgroundColor(Color.GRAY);
        view05.setBackgroundColor(Color.GRAY);
        view06.setBackgroundColor(Color.GRAY);
        view07.setBackgroundColor(Color.GRAY);
        view08.setBackgroundColor(Color.GRAY);
        view09.setBackgroundColor(Color.GRAY);
        tv.setText("1.0");
        break;
    case R.id.View03:
        view01.setBackgroundColor(0xffff0000);
        view02.setBackgroundColor(0xffff8000);
        view03.setBackgroundColor(0xffffff00);
        view04.setBackgroundColor(Color.GRAY);
        view05.setBackgroundColor(Color.GRAY);
        view06.setBackgroundColor(Color.GRAY);
        view07.setBackgroundColor(Color.GRAY);
        view08.setBackgroundColor(Color.GRAY);
        view09.setBackgroundColor(Color.GRAY);
        tv.setText("1.5");
        break;
    case R.id.View04:
        view01.setBackgroundColor(0xffff0000);
        view02.setBackgroundColor(0xffff8000);
        view03.setBackgroundColor(0xffffff00);
        view04.setBackgroundColor(0xff80ff00);
        view05.setBackgroundColor(Color.GRAY);
        view06.setBackgroundColor(Color.GRAY);
        view07.setBackgroundColor(Color.GRAY);
        view08.setBackgroundColor(Color.GRAY);
        view09.setBackgroundColor(Color.GRAY);
        tv.setText("2.0");
        break;
    case R.id.View05:
        view01.setBackgroundColor(0xffff0000);
        view02.setBackgroundColor(0xffff8000);
        view03.setBackgroundColor(0xffffff00);
        view04.setBackgroundColor(0xff80ff00);
        view05.setBackgroundColor(0xff00ff00);
        view06.setBackgroundColor(Color.GRAY);
        view07.setBackgroundColor(Color.GRAY);
        view08.setBackgroundColor(Color.GRAY);
        view09.setBackgroundColor(Color.GRAY);
        tv.setText("2.5");
        break;
    case R.id.View06:
        view01.setBackgroundColor(0xffff0000);
        view02.setBackgroundColor(0xffff8000);
        view03.setBackgroundColor(0xffffff00);
        view04.setBackgroundColor(0xff80ff00);
        view05.setBackgroundColor(0xff00ff00);
        view06.setBackgroundColor(0xff00ff80);
        view07.setBackgroundColor(Color.GRAY);
        view08.setBackgroundColor(Color.GRAY);
        view09.setBackgroundColor(Color.GRAY);
        tv.setText("3.0");
        break;
    case R.id.View07:
        view01.setBackgroundColor(0xffff0000);
        view02.setBackgroundColor(0xffff8000);
        view03.setBackgroundColor(0xffffff00);
        view04.setBackgroundColor(0xff80ff00);
        view05.setBackgroundColor(0xff00ff00);
        view06.setBackgroundColor(0xff00ff80);
        view07.setBackgroundColor(0xff00ffff);
        view08.setBackgroundColor(Color.GRAY);
        view09.setBackgroundColor(Color.GRAY);
        tv.setText("3.5");
        break;
    case R.id.View08:
        view01.setBackgroundColor(0xffff0000);
        view02.setBackgroundColor(0xffff8000);
        view03.setBackgroundColor(0xffffff00);
        view04.setBackgroundColor(0xff80ff00);
        view05.setBackgroundColor(0xff00ff00);
        view06.setBackgroundColor(0xff00ff80);
        view07.setBackgroundColor(0xff00ffff);
        view08.setBackgroundColor(0xff0080ff);
        view09.setBackgroundColor(Color.GRAY);
        tv.setText("4.0");
        break;
    case R.id.View09:
        view01.setBackgroundColor(0xffff0000);
        view02.setBackgroundColor(0xffff8000);
        view03.setBackgroundColor(0xffffff00);
        view04.setBackgroundColor(0xff80ff00);
        view05.setBackgroundColor(0xff00ff00);
        view06.setBackgroundColor(0xff00ff80);
        view07.setBackgroundColor(0xff00ffff);
        view08.setBackgroundColor(0xff0080ff);
        view09.setBackgroundColor(0xff0000ff);
        tv.setText("4.5");              
        break;
    }
}