Custom RatingBar effect in Android

Sometimes the ratingbar provided by the android system does not meet our requirements. In this case, you can customize your favorite ratingbar.
From the above results, we can see that two images are required for customizing such components :. One is used for unselected effects and the other is used for display. What about the half in the middle? In fact, after you write such a component, the system will automatically help you automatically parse and generate that effect.
Entire project layout:

We will analyze it step by step:

Xml Code <RatingBar
 
Style = "@ style/roomRatingBar"
 
Android: layout_marginLeft = "10dip"
 
Android: layout_width = "wrap_content" android: layout_height = "wrap_content"
 
Android: id = "@ + id/room_ratingbar"> </RatingBar>

 

From the above, we can see that the custom ratingbar mainly refers to this section of style = "@ style/roomRatingBar", so we can find this section of code.

//// // Styles. xml

Xml Code <? Xml version = "1.0" encoding = "UTF-8"?>
 
<Resources>
 
<Style name = "roomRatingBar" parent = "@ android: style/Widget. RatingBar">
 
<Item name = "android: progressDrawable"> @ drawable/room_rating_bar </item>
 
<Item name = "android: minHeight"> 16dip </item>
 
<Item name = "android: maxHeight"> 16dip </item>
 
</Style>
 
</Resources>

 

The above means to inherit @ android: style/Widget. RatingBar, rewrite the android: progressDrawable attribute, and replace it with the custom @ drawable/room_rating_bar file.

Controls the maximum and minimum heights of the component. Next, go to the custom file @ drawable/room_rating_bar.

//// Room_rating_bar.xml

Xml Code <? Xml version = "1.0" encoding = "UTF-8"?>
 
<! --
 
This is the rating bar drawable that is used to show a room num.
 
-->
 
<Layer-list xmlns: android = "http://schemas.android.com/apk/res/android">
 
<Item android: id = "@ + android: id/background"
 
Android: drawable = "@ drawable/room_unselect"> </item>
 
<Item android: id = "@ + android: id/secondaryProgress"
 
Android: drawable = "@ drawable/room_unselect"> </item>
 
<Item android: id = "@ + android: id/progress"
 
Android: drawable = "@ drawable/room_select"> </item>
 
</Layer-list>

 

Well, it's getting closer and closer to the truth. Here, we define the background image of the component, the first-level progress background image, and the second-level progress background image (these IDs are system IDs, when the system runs here, it will automatically redraw the component based on this id)

I will probably understand how to use it here. In fact, many components can be used in this way, but if you understand the whole process, you will feel at least a little handy in other aspects. Good! I can only talk about my opinions, because my understanding of android is not very deep.

The premise is to download the android source code. I will not talk about it here. Find styles in the directory of android framework \ base \ core \ res \ values (android framework is the directory where I save the source code. xml file, which is the file to be loaded when the android system is running. It stores the style definitions of all components. You can find <style name = "Widget. ratingBar "> one of the component styles we inherited earlier has other <style name =" widgets. ratingBar. small ">, <style name =" Widget. seekBar ">, <style name =" Widget. progressBar. small "> and so on. In this way, attributes can be rewritten into other attributes after being inherited.

 

From ygc974257893