I am currently working with a dynamically updating ProgressBar. Through certain percentages, the progessbar sets a drawable of a different color. We currently have various colored clip drawable defined in a drawable xml. The one entitled progressbar_blue_states is detailed as follows:
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:id="#android:id/background"
android:drawable="#drawable/progressbar_grey">
</item>
<item android:id="#android:id/progress">
<clip android:drawable="#drawable/progressbar_blue" />
</item>
</layer-list>
Whenever we need to update the dialog, we call the following code:
progressBar.setProgressDrawable(getResources().getDrawable(R.drawable.progressbar_blue_states));
However, not only does this not update the ProgressBar, but also it takes out the progress bar altogether where whitespace is left in it's place. However, if I set android:progressDrawable="#drawable/progressbar_blue_states" in the xml and take out this setProgressDrawable() call, it loads correctly. We need the setProgressDrawable to update the colors as needed.
This call works fine in Android 4.0+ however in Android 2.3 we're running into some trouble. Any ideas?
Edit
This is how we set up the ProgressBar in the xml:
<ProgressBar android:id="#+id/progress"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginBottom="2dp"
android:indeterminate="false"
android:indeterminateOnly="false"
android:progress="24"
android:max="100"
android:progressDrawable="#drawable/progressbar_red_states" />
I have got the same bug, but it is solved by using this answer
This means there is a new drawable set to the seekbar, but the size of the drawable is 0, you won't see anything.
Rect bounds = mySeekBar.getProgressDrawable().getBounds();
mySeekBar.setProgressDrawable(newSeekBarBackground);
mySeekBar.getProgressDrawable().setBounds(bounds);
According to this post https://stackoverflow.com/a/6953534/3223742
a good solution is to set progress to 1; re-set max progress, and then set the real progress :
progressBar.setProgressDrawable(...);
progressBar.setProgress(1);
progressBar.setMax(maxProgress);
progressBar.setProgress(progress);
Related
I am relatively new to android styling techniques and I am trying to wrap my head around reusable components. My app has many buttons scattered throughout its' view hierarchy and they are all almost exactly the same (variable font color and button color). Is it possible to define one button drawable that can then have different styles applied to it such that, a button has one drawable definition that is applied as a background to a Button xml attribute like so <Button> android:background="#drawable/basic_btn"</Button> and then customize lets say the button color through styling, something like
<Button
style="#style/Button.Green"
android:background="#drawable/basic_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
then if I want a blue button using the same drawable I can set something like:
<Button
style="#style/Button.Blue"
android:background="#drawable/basic_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
is this possible? I currently do not get the result I want when trying this.
Edit with answer:
Looking back on my post, I don't believe I described my initial issue well enough and I appreciate everyone who has responded in between. My initial problem was attempting to apply different <styles> to a drawable to achieve different background colors, was not in fact changing the background color. My solution that I went with goes like this.
Define the drawable shape:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#ffffff"/>
<corners android:radius="3dp" />
Next, assign the drawable as a background
<Button style="#style/Button.basic
android:background="#drawable/btn_basic"
/>
Now for the heart of the trick:
<Button style="#style/Button.basic
android:background="#drawable/btn_basic"
android:backgroundTint="#color/seafoam"
/>
backgroundTint by default seems to add the color tint on top of the drawable. This allowed me to define one shape but apply any color to it when used in an xml file. backgroundTint
Use TextView Like This:-
<TextView
android:id="#+id/reviewsTitleTxt"
style="#style/txt_style_16sp_white_color_ffffff"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textAllCaps="true"
android:gravity="center"
android:text="#string/reviews_txt"
android:layout_gravity="center_vertical"/>
Where Style file is:-
Define style in style file
<style name="txt_style_16sp_white_color_ffffff">
<item name="android:textSize">#dimen/txt_size_16sp</item>
<item name="android:textColor">#color/white_color_ffffff</item>
</style>
Since we were commenting and you weren't able to solve this via the posted answer I'm going to try to help you out.
First, you should define all the common attributes on a #style/ .xml
Secondly, define a #drawable/ as your background for each button:
Background drawable:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="#dimen/button_round_radius"/>
<solid android:color="#color/background_color"/>
</shape>
The bad thing about this is you'll have to create a new drawable with somewhat the same properties just to change the color.
Also look into the already created themes/style that might help you on the reference of this answer.
Now on your button's XML declaration:
<Button
style="#style/YourCommonAttributesStyling"
android:background="#drawable/a_drawable_shape_like_the_above"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
Reference: Android Material Design Button Styles
I am having trouble customizing the look of an Android Switch widget. I have custom xml drawables that I want to use for the thumb (the little button part that usually says On or Off) and the track (the background that the thumb slides across). When I set just the thumb using android:thumb, it works fine. When I set the track (whether or not the thumb is set), the switch disappears entirely and I'm left with only the text showing.
Here is my code when just the thumb is applied:
<com.blahblahblah.blah.CustomSwitch
android:id="#+id/switch_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textOff="Off"
android:textOn="On"
android:text="Something Awesome"
android:textColor="#android:color/black"
android:thumb="#drawable/custom_switch_thumb" />
Here is what it looks like in the preview window:
And with the track applied:
<com.blahblahblah.blah.CustomSwitch
android:id="#+id/switch_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textOff="Off"
android:textOn="On"
android:text="Something Awesome"
android:textColor="#android:color/black"
android:track="#color/track_color" />
Preview window with track applied:
For reference I am using Android Studio 0.2.3 on OSX 10.7.5.
I just stumbled upon the same problem and found a fix through on the HoloEverywhere issue tracker. You'll need to set the <size> of the drawable XML shape you are using.
Not working (the widget is there and I can interact with it, but I can't see it, it's hidden):
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#color/black_50" />
</shape>
Working (not the added <size>):
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#color/black_50" />
<size android:width="56dp" android:height="20dp" />
</shape>
In general just for changing an image you don't need to subclass a control you can style it e.g. with the style attribute.
About your problem there are several controls which expect a drawable and not a plain color. In the control definition (the xml part) you can just define that you allow a reference but you cannot limit it to drawable references. So just avoid to use colors directly. If you don't want to add a image you could also define it with xml, but note that this does not work in all cases.
I have a horizontal ProgressBar that works great.
<ProgressBar
android:id="#+id/progressBar1"
style="?android:attr/progressBarStyle"
android:layout_width="match_parent"
android:layout_height="15dp"
android:layout_marginBottom="5dp"
android:background="#drawable/progress_radial_background"
android:progressDrawable="#drawable/custom_progress_bar" />
I do this:
pb.setMax(100);
pb.set(point);
And it shows the status of a user's level. When it fills all the way, they reach a new level and it starts over. It will only move/increase when the user do some action to increase points.
However, I'd like to make this circular instead of horizontal. But when I do, it wont stop the spinning animation (like a loading animation). Can I make the circular ProgressBar the same way?
Custom Progress Bar code in my Drawable folder:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#android:id/background"
android:drawable="#drawable/list_press">
<corners android:radius="6dp" />
</item>
<item android:id="#android:id/progress">
<clip android:drawable="#drawable/progress_bar_green" />
</item>
</layer-list>
There is no standard Android widget that does what you want.
However you could use this library that does it: https://github.com/Todd-Davies/ProgressWheel.
This poster seems to have found an answer.
It seems like they took the android drawables for the circular progress bar and filling, specified in xml layout that it was a horizontal progress bar and made it determinate.
Please take a look to this GitHub library called RefreshActionItem, I think it is exactly what you are looking for:
https://github.com/ManuelPeinado/RefreshActionItem?source=cc
You have as well this one for another idea or just check it out:
https://github.com/f2prateek/progressbutton?source=c
I'm working with a Progress Bar in Android, the XML declaration is below:
<ProgressBar
android:id="#+id/progress"
style="?android:attr/progressBarStyleHorizontal"
android:progressDrawable="#color/green" <!-- See below about this line -->
android:max="10000"
android:progress="10000"
android:layout_width="fill_parent"
android:layout_height="3dp"
android:layout_alignParentTop="true"/>
So the progress bar shows up fine in its full glory or whatever. But I have an ASyncTask which will reset the progress bar's progress to 0, then load it back up to it's max. This doesn't work. Instead, the progress bar just remains at it's maximum value. I went ahead and logged the progress bar's progress when it is supposed to reset to 0 and update, and according to the progress bar's getProgress() method, it does in fact go to 0 then build back up to 10000. When you actually look at the phone though it just remains full.
So look back at the XML and you'll see that I noted the line android:progressDrawable. This is where I change the color of the progress bar. If I remove that line, the progress bar behaves as expected. However when the progress bar's drawable is set to the color I want, it just sits there will full progress on the screen.
I've used that progressDrawable attribute before without a hitch, but in this case it's just giving me a big headache. Any experience or ideas on how to fix this? Thanks!
The problem is the android:progressDrawable attribute. In this case you should use layer-list drawable.
Horizontal ProgressBar utilizes up to 3 different layers - background, progress and secondaryProgress (you don't need secondaryProgress in your case). Since you used simple color I suspect the color is used for the background and the other two colors remain unset and transparent.
All you need is a drawable like this one:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="#android:id/background"
android:drawable="#android:color/transparent"/>
<item android:id="#android:id/progress">
<clip android:drawable="#color/green" />
</item>
</layer-list>
I have a listbox with a custom background. It displays a thin white line on either side with a black background. Works great on all my test phones (Galaxy Captivate, Vibrant, Nexus 1, G Tablet, Archos 32, Droid). I just got a Droid 3 to test on, and on this one phone, the background of the listview where there are no items is grey. The list items have the correct black background.
Here's the layout containing the list view. The listview has white background text box above and below, and the background for the listview is the drawable (I know it's called a three border, but it's only a two border).
<RelativeLayout
android:layout_below="#id/divider01"
android:layout_above="#id/save_current_button"
android:id="#+id/profile_middle_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingTop="3dip"
android:orientation="vertical">
<TextView android:id="#+id/user_profile_row"
android:text="#string/user_profiles_label"
android:layout_alignParentTop="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="#android:color/black"
android:background="#drawable/roundedtop"/>
<TextView android:id="#+id/current_profile_name"
android:layout_alignParentBottom="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="#2B497B"
android:background="#drawable/roundedbottom"/>
<ListView android:id="#id/android:list"
android:layout_below="#id/user_profile_row"
android:layout_above="#id/current_profile_name"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:paddingLeft="3dip"
android:paddingRight="3dip"
android:drawSelectorOnTop="false"
android:background="#drawable/three_side_border"
android:cacheColorHint="#ffffffff"/>
</RelativeLayout>
Here's the drawable - this should force the background to black.
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item>
<shape android:shape="rectangle">
<solid android:color="#FFFFFFFF" />
</shape>
</item>
<item android:left="3dp" android:right="3dp">
<shape android:shape="rectangle">
<solid android:color="#FF000000" />
</shape>
</item>
</layer-list>
I noticed that in my list item xml, I don't have the alpha layer specified in my colors, so I tried taking off the leading FF on my drawable, but it came out the same.
Anyone have any ideas where I can look to fix this? It looks really ugly on a nice phone.
Thanks,
Greg
A buddy found a comment on a Motorola forum:
Motorola changed attribute values for built-in themes on Moto devices
with 2.3. "If you set overScrollFooter to #null, the bottom-of-list
background becomes transparent and your background image shows
through.... If you want a bottom-of-list background, but a different
one, you can set overScrollFooter to a color or drawable..."
android:overScrollFooter="#aa000000"
android:overScrollFooter="#drawable/my_drawable"
http://community.developer.motorola.com/t5/MOTODEV-Blog/Why-Does-My-ListView-Look-Different/ba-p/17462
I'm still not entirely sure what they are doing when rendering this space, but I can get it to work. If I use the drawable option, and give it my drawable with the left and right borders, that object gets drawn inside the border from the listview background - i.e. it is somehow still showing the first item in my two-layer background drawable, so the space below my list items now has a wider border, but it is black. This is at least consistent with my earlier test when I changed the first layer to blue, and got a blue line the entire height of the listview. If I just go with a straight black #ff000000, then the listview looks the same as all my other phones. So I'm not sure how they are calculating the footer space - I don't see how they would know that I have a two-layer object and just be replacing the second layer. Something else must be going on that I just don't understand, but it does work.
There was a also a comment that you would need to select a theme based on the android version, but so far in my testing all the platforms take the new tag without complaining.