帶有5個進度條的評分進度圖

Question

我需要為應用程序上的評論繪制評分表。 對於像1,2,3,4，和5這樣的每顆星，分別提供參考。

Answer 1

嗨，您可以執行以下操作，例如使用5 RatingBar和5 ProgressBar。

 <?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:padding="10dp"> <RatingBar android:id="@+id/rating_5" style="@style/Widget.AppCompat.RatingBar.Small" android:layout_width="wrap_content" android:layout_height="wrap_content" android:isIndicator="true" android:numStars="5" android:rating="5" /> <ProgressBar android:id="@+id/progress_5" style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_marginLeft="5dp" android:layout_toRightOf="@+id/rating_5" android:progress="50" /> <RatingBar android:id="@+id/rating_4" style="@style/Widget.AppCompat.RatingBar.Small" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/rating_5" android:layout_alignRight="@+id/rating_5" android:isIndicator="true" android:numStars="4" android:rating="4" /> <ProgressBar android:id="@+id/progress_4" style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/rating_5" android:layout_marginLeft="5dp" android:layout_toRightOf="@+id/rating_5" android:progress="50" /> <RatingBar android:id="@+id/rating_3" style="@style/Widget.AppCompat.RatingBar.Small" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/rating_4" android:layout_alignRight="@+id/rating_5" android:isIndicator="true" android:numStars="3" android:rating="3" /> <ProgressBar android:id="@+id/progress_3" style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/rating_4" android:layout_marginLeft="5dp" android:layout_toRightOf="@+id/rating_5" android:progress="30" /> <RatingBar android:id="@+id/rating_2" style="@style/Widget.AppCompat.RatingBar.Small" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/rating_3" android:layout_alignRight="@+id/rating_5" android:isIndicator="true" android:numStars="2" android:rating="2" /> <ProgressBar android:id="@+id/progress_2" style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/rating_3" android:layout_marginLeft="5dp" android:layout_toRightOf="@+id/rating_5" android:progress="20" /> <RatingBar android:id="@+id/rating_1" style="@style/Widget.AppCompat.RatingBar.Small" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/rating_2" android:layout_alignRight="@+id/rating_5" android:isIndicator="true" android:numStars="1" android:rating="1" /> <ProgressBar android:id="@+id/progress_1" style="@style/Base.Widget.AppCompat.ProgressBar.Horizontal" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@+id/rating_2" android:layout_marginLeft="5dp" android:layout_toRightOf="@+id/rating_5" android:progress="10" /> </RelativeLayout> 

這是輸出：

希望對您有幫助。 謝謝。