I'm displaying a seekbar inside a fragment. The seekbar has custom thumb and progress drawables. They display fine, however when I pause the activity and return to it, the progress bar width strangely increases to the same height of the thumb ! I can't find the problem for this abnormal behavior.
how it displays normally
after activity pause
my code :
// inside fragment onStart
seekBar.setThumb(getResources().getDrawable(R.drawable.form_bg));
seekBar.setProgressDrawable(getResources().getDrawable(R.drawable.progress));
// seekBar xml
<SeekBar
android:id="#+id/seekBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:indeterminate="false"
android:layout_marginTop="5dp"
android:max="100"
android:maxHeight="6dp"
android:progress="50" />
// thumb drawable
<?xml version="1.0" encoding="utf-8"?>
<shape android:shape="oval"
xmlns:android="http://schemas.android.com/apk/res/android"
>
<size android:height="#dimen/seekbar_tumb_size" android:width="#dimen/seekbar_tumb_size" />
<solid android:color="#color/form_color" />
</shape>
// progress drawable
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:top="0dp" android:bottom="0dp" android:gravity="center_vertical" android:id="#android:id/background">
<shape>
<solid android:color="#color/activity_bg" />
</shape>
</item>
<item android:gravity="center_vertical" android:id="#android:id/progress">
<clip>
<shape>
<solid android:color="#color/form_color_syrup" />
</shape>
</clip>
</item>
Finally found the solution to this.
Rect bounds = seekBar.getProgressDrawable().getBounds();
seekBar.setThumb(getResources().getDrawable(R.drawable.form_bg));
seekBar.setProgressDrawable(getResources().getDrawable(R.drawable.progress));
seekBar.getProgressDrawable().setBounds(bounds);
Related
In my project I want to make a horizontal progress bar similar to the following.
I've tried a lot of libraries but none of them have this feature. Is there any way to make this?
Here is my code:
dialog = new ProgressDialog(Context.this);
dialog.setIndeterminate(true);
dialog.setMessage("Some Text");
dialog.show();
You should use seekBar instead of progressDialog. And you can add android:thumb icon.
<SeekBar
android:id="#+id/seekBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:thumb="#drawable/icon"
android:max="10"
android:progress="5"
android:progressDrawable="#drawable/custom_seekbar" />
custom-seekbar.xml:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#android:id/progress">
<clip>
<shape android:shape="rectangle">
<size
android:width="12dp"
android:height="12dp" />
<corners android:radius="15dp" />
<solid android:color="#4fc3f7" />
<gradient
android:angle="270"
android:centerColor="#4fc3f7"
android:endColor="#4fc3f7"
android:startColor="#4fc3f7" />
</shape>
</clip>
</item>
</layer-list>
I have created my own custom styling for a vertical SeekBar, however there is a small gap between the thumb and the progress part of the SeekBar as shown here: http://i.imgur.com/gnGnuPb.png?1
Even more interesting though is that the further you drag the thumb the smaller the gap becomes until about 50% - 60% full when it disappears: http://i.imgur.com/6r0E2kZ.png?1
Everything is done using xml and shapes, no pngs. Any idea what could be causing this? I've tried messing around with the different paddings and thumb offset but I obviously must be missing something.
Below is the xml for the SeekBar, the Progress Drawable and the Thumb Drawable.
<SeekBar
android:layout_width="320dp"
android:layout_height="wrap_content"
android:background="#drawable/volume_shading"
android:id="#+id/volume"
android:rotation="270"
android:progressDrawable="#drawable/blue_slider"
android:paddingTop="20dp"
android:paddingBottom="20dp"
android:paddingLeft="20dp"
android:paddingRight="20dp"
android:thumb="#drawable/thumb"
android:thumbOffset="0dp"
android:layout_marginTop="220dp"
android:layout_marginRight="-100dp"
android:layout_alignParentRight="true"/>
<?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/grey_bar" />
<item android:id="#android:id/progress">
<scale android:scaleWidth="100%"
android:drawable="#drawable/blue_bar" />
</item>
</layer-list>
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#android:color/white" />
<size android:width="8dp"
android:height="40dp" />
<corners android:radius="4dp" />
</shape>
This question already has answers here:
How to increase height of ProgressBar in ICS/JB
(2 answers)
Closed 18 days ago.
I am working with a SeekBar that works perfectly fine. But I want to increase the height of the Progress bar, as the native height is not as high.
So how can I change the height of the progress bar, either dynamically or through XML?
To create custom seekbar, add in your xml file below code:
<androidx.appcompat.widget.AppCompatSeekBar
android:id="#+id/seek_homelayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/_10sdp"
android:maxHeight="8dip"
android:minHeight="8dip"
android:progressBackgroundTint="#color/thumb"
android:progressDrawable="#drawable/sb_progress_drawable"
android:progressTint="#color/black"
android:secondaryProgressTint="#color/colorPrimary"
android:thumb="#drawable/sb_thumb"
android:thumbTint="#color/colorPrimary" />
Create sb_progress_drawable.xml file in drawable:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:id="#android:id/background">
<shape android:shape="rectangle">
<solid android:color="#26FFFFFF"/>
</shape>
</item>
<item android:id="#android:id/secondaryProgress">
<scale
android:scaleWidth="100%" >
<shape android:shape="rectangle">
<solid android:color="#26FFFFFF"/>
</shape>
</scale>
</item>
<item android:id="#android:id/progress">
<scale
android:scaleWidth="100%" >
<shape android:shape="rectangle">
<solid android:color="#FFFFFF"/>
</shape>
</scale>
</item>
</layer-list>
If you want to use thumb on to seekbar then add sb_thumb.xml file in your drawable:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval">
<size android:width="12dp"
android:height="12dp" />
<solid android:color="#color/colorPrimary" />
</shape>
You have maxHeigh and minHeight attributes.
This attributes will determinate the height of your seekbar.
android:maxHeight="3dp"
android:minHeight="3dp"
https://www.lvguowei.me/post/customize-android-seekbar-color/
Cheers.
None of the above works, simply set android:layout_height="10dp" to whatever value you want!
<SeekBar
android:id="#+id/seekBar"
style="?android:attr/progressBarStyleHorizontal"
android:layout_width="0dp"
android:layout_height="10dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent" />
I have a very strange problem - I defined a custom progress drawable for a progress bar and
sometimes it shows and sometimes its not.
I tried cleaning my project, restarting eclipse and even restart the computer.
its still happens.
here is the progress drawable xml:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="#android:id/background">
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="5dp" />
<gradient
android:startColor="#6f7754"
android:endColor="#858762"
android:angle="90"/>
</shape>
</item>
<item android:id="#android:id/secondaryProgress">
<clip>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners android:radius="5dp" />
<gradient
android:startColor="#ffba00"
android:endColor="#af6c03"
android:angle="90"/>
</shape>
</clip>
</item>
<item android:id="#android:id/progress">
<clip>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners
android:radius="5dp" />
<gradient
android:startColor="#ffba00"
android:endColor="#af6c03"
android:angle="90" />
</shape>
</clip>
and here's the xml where I use it:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_marginBottom="2dp"
android:background="#drawable/quick_action_item_btn">
<ImageView
android:id="#+id/icon"
android:layout_width="21dp"
android:layout_height="21dp"
android:scaleType="centerInside"/>
<ProgressBar
android:id="#+id/progress"
android:layout_width="20dp"
android:layout_height="4dp"
android:layout_marginTop="2dp"
style="#android:style/Widget.ProgressBar.Horizontal"
android:progressDrawable="#drawable/achievement_progress_bar"/>
</LinearLayout>
try with this
android:indeterminateDrawable="#drawable/yourXML"
it is working for me..
Its working fine for me. Just set your indeterminateDrawable to your custum xml file.It should be fine..
Perhaps this a similar problem to this one... SharedPreferences.onSharedPreferenceChangeListener not being called consistently
Is the custom xml defined as a variable of the activity? If not, perhaps it is being collected by the garbage collector. My suggestion is to make it a field variable of the class (the activity class).
Shadow property in Button view gives shadow to text. How can I give shadow to right and bottom border of a Button?As shown below:
You can try it. I use it in my project. I give shadow to right and bottom border of a Button.
Button xml
<Button
android:id="#+id/buttonSignIn"
android:layout_width="fill_parent"
android:layout_height="50dp"
android:background="#drawable/button_dropshadow"
android:textColor="000000"
android:text="Sign In" />
In drawable file add button_dropshadow.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<layer-list>
<item android:left="5dp" android:top="5dp">
<shape>
<corners android:radius="3dp" />
<solid android:color="#000000" />
</shape>
</item>
<item android:bottom="2dp" android:right="2dp">
<shape>
<gradient android:angle="270"
android:endColor="#ffffff" android:startColor="#ffffff" />
<stroke android:width="1dp" android:color="#000000" />
<corners android:radius="4dp" />
<padding android:bottom="10dp" android:left="10dp"
android:right="10dp" android:top="10dp" />
</shape>
</item>
</layer-list>
</item>
</selector>
Thank you.
Try making your own button 9-patch image with selector:
btn_normal.9.png:
btn_pressed.9.png:
btn_focused.9.png:
btn_selector.xml:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="#drawable/btn_focused" />
<item android:state_focused="true" android:drawable="#drawable/btn_focused" />
<item android:state_pressed="true" android:drawable="#drawable/btn_pressed" />
<item android:drawable="#drawable/btn_normal" />
</selector>
and add android:background="#drawable/btn_selector" in button's attributes.
Here is a blob post that I found and could help. It will only work in a RelativeLayout. Create a View component with the same size as your button and place it immediately below:
<Button
android:id="+#id\my_button"
android:layout_below="#id/some_layout_item"
android:layout_width="100dp"
android:layout_height="5dp"
>
</Button>
<View
android:layout_below="#id/my_button"
android:layout_width="100dp"
android:layout_height="5dp"
android:background="#drawable/drop_shadow"
>
</View>
Create the shadow as a drawable (drop_shadow.xml):
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android=”http://schemas.android.com/apk/res/android”>
<gradient
android:startColor="#color/cream_dark"
android:endColor="#color/cream"
android:angle="270"
>
</gradient>
</shape>
My button's background is set like this
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<gradient
android:startColor="#android:color/holo_green_dark"
android:endColor="#android:color/holo_green_light"
android:angle="90">
</gradient>
<stroke
android:width="1px"
android:color="#android:color/darker_gray" />
</shape>
The effect of the shadow can be done by adding a second shape under the original button shape, changing its color to a darker one either black or grey. But the shadow should be of the same shape as that of the button.
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
<solid android:color="#android:color/darker_gray"/>
</shape>
To overlap different items we have to use a “layer-list” resource and include the previous shapes. The shadow should appear in first place and then the original button with some displacement. In this example, we are creating the shadow at the bottom of the button and an offset of 4px.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >
<item android:drawable="#drawable/shadow"/>
<item
android:drawable="#drawable/button"
android:bottom="4px"
android:right="4px"
/>
</layer-list>
Now set the background of the button as the layerlist drawable. This should do it partially.