“This is the 29th day of my participation in the First Challenge 2022. For details: First Challenge 2022.”

👉 About the author

As we all know, life is a long process of constantly overcoming difficulties and reflecting on progress. In this process, there will be a lot of questions and thoughts about life, so I decided to share my thoughts, experiences and stories to find resonance!!

Focus on Android/Unity and various game development tips, as well as various resource sharing (websites, tools, materials, source code, games, etc.)

Welcome to pay attention to the public account [Mr. Empty name] for more resources and communication!

👉 premise

This is small empty insist to write Android novice series, welcome to taste.

Big guy (×)

Novice (√)

👉 Practice

😜 met

RatingBar is an extension of SeekBar and ProgressBar that uses a star to display ratings.

Usually the application scenario is in the user evaluation that, such as Taobao evaluation, taxi ordering evaluation and so on.

Using the default size of the RatingBar, users can touch/drag or use keys to set ratings. There are two styles (ratingBarStyleSmall for small styles and ratingBarStyleIndicator for large styles). The large one is only suitable for indicating, not for user interaction.

😜 Basic Attributes

Whether the android: isIndicatorRatingBar 】 【 as the indicator, is true, the user will not be able to interactions, the default is false.

The number of stars displayed must be an integer, such as “50”, although it can be set to a large number, usually 5-10 stars.

[Android :rating] Set the default rating.

[Android :stepSize] Score the value increased each time. A value between 0 and 1 is recommended.

There are three built-in styles:

style=”? Attr /ratingBarStyle” : default style

style=”? Android: attr/ratingBarStyleSmall “: small style

style=”? Android: attr/ratingBarStyleIndicator “: the indicator style

But it doesn’t feel pretty to use, as shown in the following example:

<RatingBar
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

<RatingBar
    style="? android:attr/ratingBarStyleSmall"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:isIndicator="false"
    android:numStars="5"
    android:rating="4"
    android:stepSize="1" />

<RatingBar
    style="? android:attr/ratingBarStyleIndicator"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:isIndicator="false"
    android:numStars="5"
    android:rating="3"
    android:stepSize="1" />

<androidx.appcompat.widget.AppCompatRatingBar
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />
Copy the code

😜 Click events

RatingBar ratingBar = findViewById(R.id.rating);
ratingBar.setOnRatingBarChangeListener(new RatingBar.OnRatingBarChangeListener() {
    @Override
    public void onRatingChanged(RatingBar ratingBar, float rating, boolean fromUser) {
        Log.e("TAG"."OnRatingChanged: Current click rating:"+ rating); }});Copy the code

😜 Custom styles

<RatingBar
    android:layout_width="wrap_content"
    android:progressDrawable="@drawable/ratingbar_bg"
    android:layout_height="wrap_content" />
Copy the code

ratingbar_bg.xml

I used three images above. / background 】 【 @ android: id attribute as the default diagram, for the selected @ android: id/progress 】 【 figure after the @ android: id/secondaryProgress 】 for chosen half of the figure.

If you change only the layout_width and layout_height properties to fixed values, you will find that the rating component is again displaying the wrong values, filling the entire size.

The width and height property should always be wrap_content

But that’s not all. There can be a height bug at different resolutions: drawable images are stretched vertically

So let’s change it as above:

<RatingBar
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    style="@style/RatingBar_CustomDrawable" />
Copy the code
<style name="RatingBar_CustomDrawable" parent="@android:style/Widget.Holo.RatingBar.Indicator">
    <item name="android:progressDrawable">@drawable/ratingbar_bg</item>
    <item name="android:minHeight">50dp</item>
    <item name="android:maxHeight">50dp</item>
</style>
Copy the code

Fix the dead height.

👉 other

📢 author: Kom and Kom in Kom

📢 reprint instructions – be sure to specify the source: Zhim Granular’s personal home page – column – Nuggets (juejin. Cn)

📢 the road friend please stay ☁️, I see you extraordinary, talk between the faint king imperious 💚, in the future will have a great as 📝!! Next to a little like 👍 collect 🌟 pass you today, point it, in the future you successful ☀️, I do not take a cent, if not successful ⚡ 🌟, or come back to me.