Helo,
I've created a custom ratingbar by using to following tutorial: http://kozyr.zydako.net/2010/05/23/pretty-ratingbar/
But now i want to resize my custom rating stars to smaller stars..
i got:
<style name="orangeRatingBar" parent="#android:style/Widget.RatingBar">
<item name="android:progressDrawable">#drawable/orange_ratingbar</item>
<item name="android:minHeight">14dip</item>
<item name="android:maxHeight">14dip</item>
</style>
When i set the minHeight and the maxHeight i see only part of the stars..
The star image is 14px height and 14 width. Why do i only see a part of the image when i set the minheight 14px or 14dip.. When i set it on 19dip i see the whole star..
How can i create smaller stars (the size of default small ratingBar)?
For custom Stars size in your ratingbar use this tag in XML-
for small-style="?android:attr/ratingBarStyleSmall"
for large-style="?android:attr/ratingBarStyle"
for medium-style="?android:attr/ratingBarStyleIndicator"
I came across this previously
<uses-sdk android:minSdkVersion="4"
android:targetSdkVersion="7" />
You might find more info here
Android custom rating bar image size problem
Related
I have included a rating bar in android, and now I need to place a text view to immediate right if the rating bar.But I failed to do the same since, there is a lot of unwanted space (rectangular blue box) around the rating bar, which prevents me from placing the textview to its immediate right side. Is there any way to reduce this space around the rating bar , so that both the textview and the rating bar comes in same line and textview is placed next to the rating bar without a gap.Please help me with a good support! Thanks in advance! Here is my xml code for it.
<RatingBar
android:id="#+id/overall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="70dp"
android:numStars="5"
android:rating="0.0"
android:scaleX="0.4"
android:scaleY="0.4"
android:stepSize="0.01" />
You can use android default styles, Like:
style="#android:style/Widget.Holo.Light.RatingBar.Small"
in you xml layout. I am using above and have no space around it.
You can check variants here
I tried to use different suggestion but i was unsuccessful with the Android Rating bar removal of extra padding. All i did downloaded ic icons from https://material.io/icons/ and use star and star bordered icon and programmed them with switch cases.
While using the base style for the RatingBar, set the minHeight to 0dp. The base minHeight in the style itself was preventing the view from scaling down. Setting it to 0 should work as you expect a normal view (we set ours to wrap_content).
Tried to use the base (#android:style/Widget.RatingBar) and small (#android:style/Widget.DeviceDefault.RatingBar.Small and #android:style/Widget.Holo.Light.RatingBar.Small) but both fixed/limited the size of the the RatingBar regardless of what icon is used. Looking at their codes, it was no surprise.
<style name="Widget.RatingBar">
<item name="indeterminateOnly">false</item>
<item name="progressDrawable">#drawable/ratingbar_full</item>
<item name="indeterminateDrawable">#drawable/ratingbar_full</item>
<item name="minHeight">57dip</item>
<item name="maxHeight">57dip</item>
<item name="thumb">#null</item>
<item name="mirrorForRtl">true</item>
</style>
<style name="Widget.Material.RatingBar.Small" parent="Widget.RatingBar.Small">
<item name="progressDrawable">#drawable/ratingbar_small_material</item>
<item name="indeterminateDrawable">#drawable/ratingbar_small_material</item>
<item name="minHeight">16dp</item>
<item name="maxHeight">16dp</item>
</style>
<style name="Widget.Holo.Light.RatingBar.Small" parent="Widget.RatingBar.Small">
<item name="progressDrawable">#drawable/ratingbar_small_holo_light</item>
<item name="indeterminateDrawable">#drawable/ratingbar_small_holo_light</item>
<item name="minHeight">16dip</item>
<item name="maxHeight">16dip</item>
</style>
Setting the scales didn't work right either.
I am trying to change the color of the little triangle on the Actionbar spinner (sherlock). I have done so using the following code:
<style name="MyTheme" parent="Theme.Sherlock.Light">
<item name="windowActionBarOverlay">true</item>
<item name="homeAsUpIndicator">#drawable/ic_drawer</item>
<item name="actionDropDownStyle">#style/MyActionBarSpinnerStyle</item>
</style>
<style name="MyActionBarSpinnerStyle" parent="#style/Widget.Sherlock.Light.Spinner.DropDown.ActionBar">
<item name="background">#drawable/actionbar_spinner_background</item>
</style>
The icon triangle is changed but it seems to stretch the image to the whole size of the spinner.
image http://dodsonsolutions.com/screens/screen1.png
I am using the patch-9 drawable file that everyone says to use:
spinner http://dodsonsolutions.com/screens/spinner_background_disabled.png
If this is not the correct dimensions of the file then does anyone know what it should be?
Or how do I get it not to stretch and just sit in the bottom right hand corner.
Thank you.
are you using the image that has correct extension?
check the extension of the png file you are using. if it is not ".9.png", change it into .9.png
or if it is .9.png?
there must be a build error of your project. try to rebuild & run. that must be solved.
1.try to define pixel in the area that you want to re-size not all around the image and check pixel more than 3 mostly declaring 1 pixel not working
2.check your xml file to make sure layout_width and layout_height is wrap_content
3.To use 9patch :the image file extension should be png and while you declare area extension become .9.png
I am creating a menu in an Android app with several list items and corresponding icons. The problem that I'm having is that the icons are being stretched beyond the image size for some reason. I have created a menu like this before without such a problem, and I essentially copied the code over to this new project, primarily only changing the image names and string names.
Here is the code from the menu layout for a single list item:
<TextView
android:id="#+id/listItemCardTransactions"
style="#style/NavigationMenuItem"
android:drawableLeft="#drawable/ic_card_transaction_menu_icon_normal"
android:text="#string/card_transactions" />
Here is the NavigationMenuItem style:
<style name="NavigationMenuItem">
<item name="android:layout_width">match_parent</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:paddingTop">#dimen/menu_list_item_padding</item>
<item name="android:paddingBottom">#dimen/menu_list_item_padding</item>
<item name="android:paddingLeft">#dimen/menu_list_item_padding</item>
<item name="android:drawablePadding">#dimen/menu_list_item_left_padding</item>
<item name="android:gravity">center_vertical</item>
<item name="android:clickable">true</item>
<item name="android:background">#drawable/selector_navigation_item</item>
<item name="android:textSize">#dimen/text_size_menu_item</item>
</style>
Here are the dimensions:
<dimen name="text_size_menu_item">18sp</dimen>
<dimen name="menu_list_item_padding">6dip</dimen>
<dimen name="menu_list_item_left_padding">12dip</dimen>
And here is what the menu looks like right now (I know there are several other problems but those aren't my concern right now). You can see the stretching problem best when you drag-and-drop the image to get the full view:
And what the icon is supposed to look like (this one is grey since I wasn't sure how to easily make the white one visible on a white background):
Anyone know what might be causing the image to stretch past its dimensions like this?
I would follow Barry's advise in the comments, ie use an ImageView + TextView inside a LinearLayout for each item. However, to solve the "the height of the list item is smaller", you could try adding the following attribute to the ImageView:
android:adjustViewBounds="true"
If I'm not mistaken, this should effectively make sure that the view bounds is actually based on the content of the image, and not the aspect ratio (ie, it won't change the height beyond the maximum height of the image itself due to "scaling").
Hope that helps (and also makes a bit sense).
What I need to do is have the background image just fill up the natural size of the button, as when no background is specified and the default grey background image is shown. But instead, my button scales up to the size of the background image rather than the text.
There was a previous question, but nobody had a solution.
The button:
<Button
android:id="#+id/morebtn"
style="#style/CustomButton"
android:text="More" />
I have this custom button style (greybutton is a 9-patch):
<resources>
<style name="CustomButton" parent="#android:style/TextAppearance">
<item name="android:textColor">#FFFFFF</item>
<item name="android:layout_marginLeft">10dip</item>
<item name="android:layout_marginRight">10dip</item>
<item name="android:layout_marginBottom">10dip</item>
<item name="android:layout_width">wrap_content</item>
<item name="android:layout_height">wrap_content</item>
<item name="android:layout_centerInParent">true</item>
<item name="android:background">#drawable/greybutton</item>
<item name="android:textSize">20sp</item>
</style>
</resources>
Right now it fills up the screen widthwise, despite being told to wrap_content. When I remove android:background from the Button style, the button shrinks down to wrap the text as expected.
Does anyone see why my background image isn't behaving like the default Button background?
Why don't you use ImageButton instead:
<ImageButton android:src="#drawable/greybutton"
android:scaleType="fitCenter" android:layout_width="wrap_content"
android:layout_height="wrap_content" />
then you can adjust the scaling with the scaleType attribute.
The only downside is you can't set any text.
Damnit. I had an hdpi drawable that hadn't been converted to 9patch, and for some reason that was getting applied instead of the one in the mdpi drawables folder even on my mdpi screen. The background scaling actually does work as expected after all. Sorry!
(So if you're browsing this question with a similar problem, check your drawables folder to make sure you're drawing what you think you are. Also: may wish to be sure the content boundaries in your nine-patch are of the appropriate size. Note that they aren't the same as the stretchable boundaries.)
You could try hard coding the height and width of the buttons using dip. That will be an issue if you need the Text on the buttons to change but it should work to restrain the button from expanding to the size of the image. Of course a large image will make the button larger.. the width / height is wrap_content, and the image is clearly part of the content... try hardcoding width / height parameters.
Add these two items to your CustomButton style
<item name="android:minWidth">0dp</item>
<item name="android:minHeight">0dp</item>
Iam building a custom rating bar. With help of kozyr's article i have created it.
But i have an issue with different image scaling sizes for different screen types.
Below i provide image with screenshots of my custom rating bar in the left, and simple imageview to the right.
This is for HVGA screen.
link to screenshot
As you see, stars in rating bar and in the imageview are the same
And this screenshot from HVGA screen
another link to the screenshot
Android somehow resizes stars in my ratingbar. What is the problem?!!
Here is the code
<RatingBar android:id="#+id/rating_lunch" style="#style/starRatingBar" android:layout_width="wrap_content"
android:layout_height="wrap_content" android:numStars="5" android:stepSize="1.0"/>
Here goes the style:
<style name="starRatingBar" parent="#android:style/Widget.RatingBar">
<item name="android:progressDrawable">#drawable/progress_star_big</item>
<item name="android:minHeight">19px</item>
<item name="android:maxHeight">19px</item>
</style>
Try using device independent pixels instead of actual pixels. e.g.:
<item name="android:maxHeight">19dp</item>
See the docs on this topic.
Problem solved. When i added
<uses-sdk android:minSdkVersion="4"
android:targetSdkVersion="7" />
to the manifest file everything became allright)