I got a circular ProgressBar.
I want the circular not to rotate, but to fill in. Like say maxvalue is 100... let's say setprogress(10) then 10 % of the progress bar is colored... and so on
how can this be done? How can I handle it? it keeps rotating over and over....
progress_bar.xml
<ProgressBar
android:id="#+id/progress"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_marginBottom="20dp"
android:indeterminate="false"
android:indeterminateDrawable="#drawable/progress_bar"
android:max="100" />
progress_bar.xml
<?xml version="1.0" encoding="utf-8"?>
<animated-rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:pivotX="50%"
android:pivotY="50%">
<shape android:shape="ring" android:innerRadiusRatio="4"
android:thicknessRatio="48" android:useLevel="false">
<size android:width="18dip" android:height="18dip" />
<gradient android:type="sweep" android:useLevel="false"
android:startColor="#52c1b1" android:centerColor="#52c1b1"
android:endColor="#ffffff" android:centerY="0.50" />
</shape>
</animated-rotate>
There is not direct way to achieve what you want. The only way, AFAIK, is to have a custom ProgressBar and override onDraw. Through the canvas you get as parameter you can draw an arc, for instance representing the percentage of your progress.
Related
I need to create spinner circulate progressbar that circulate starting from bottom (progress go from 0 to max) to top and when reaches to top starting to minimized(progress max to 0) and then stating again from bottom.
Here is my prgressbar
<ProgressBar
style="?android:attr/progressBarStyle"
android:layout_width="70dp"
android:layout_height="70dp"
android:id="#+id/progressBar2"
android:indeterminateDrawable="#drawable/progressbar_circle"
android:progressTintMode="src_atop"
android:layout_centerInParent="true"
android:indeterminateDuration="500"
android:layout_marginTop="189dp"
android:indeterminateOnly="true"
/>
Here is the drawable progressbar_circle.xml
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:pivotX="50%" android:pivotY="50%" android:fromDegrees="90"
android:toDegrees="270">
<shape android:shape="ring"
android:thicknessRatio="13" android:useLevel="false">
<size android:width="76dip" android:height="76dip" />
<gradient android:type="sweep" android:useLevel="false"
android:centerColor="#000cbdfb"
android:endColor="#f168c1"
android:angle="0"
/>
</shape>
</rotate>
When in my progressbar I give drawable as indeterminateDrawable. It's only circulate from bottom to top and begin from bottom immediately(I can't reach to effect when in top it starts to minimized).
change your rotate drawable parameters like this
android:fromDegrees="90"
android:toDegrees="450"
I am using a custom progress bar which works fine.
I used start, center, end color in code.
But need to change color of progress bar on every rotation. (Every time when progress bar reaches 360 degree rotation, the color has to be changed.)
Please find the code below with single color rotation.
progressdialog.xml
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="1"
android:toDegrees="1080" >
<shape
android:innerRadiusRatio="3"
android:shape="ring"
android:thicknessRatio="20"
android:useLevel="false" >
<size
android:height="48dip"
android:width="48dip" />
<gradient
android:centerColor="#color/translucent_red"
android:centerY="0.50"
android:endColor="#color/translucent_red"
android:startColor="#4fff"
android:type="sweep"
android:useLevel="false" />
</shape>
main_layout.xml
<ProgressBar
android:id="#+id/progressBar"
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:visibility="gone"
android:indeterminateDrawable="#drawable/progressdialog" >
</ProgressBar>
Any help would be really thankful.
this is the normal loading "image" is shown in android
I want to customization for example change it to ..
or
how do we replace the first loading for them? do we need pics? or some xml file?
res/layout.xml
<ProgressBar
android:id="#+id/progressBar"
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:visibility="gone"
android:indeterminateDrawable="#drawable/progress" >
</ProgressBar>
drawable/progress.xml This is a custom ProgressBar that i use to change the default colors.
<?xml version="1.0" encoding="utf-8"?>
<!--
Duration = 1 means that one rotation will be done in 1 second. leave it.
If you want to speed up the rotation, increase duration value.
in example 1080 shows three times faster revolution.
make the value multiply of 360, or the ring animates clunky
-->
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="0"
android:pivotX="50%"
android:pivotY="50%"
android:duration="1"
android:toDegrees="360" >
<shape
android:innerRadiusRatio="3"
android:shape="ring"
android:thicknessRatio="8"
android:useLevel="false" >
<size
android:height="48dip"
android:width="48dip" />
<gradient
android:centerColor="#color/color_preloader_center"
android:centerY="0.50"
android:endColor="#color/color_preloader_end"
android:startColor="#color/color_preloader_start"
android:type="sweep"
android:useLevel="false" />
</shape>
</rotate>
this is my code from layout...
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/rotate"
android:layout_centerInParent="true"
android:progressDrawable="#drawable/b"
android:visibility="gone" />
(b is a PNG)
android still showing default one
then tried this
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/rotate"
android:layout_centerInParent="true"
android:progressDrawable="#drawable/rotate"
android:visibility="gone" />
as you can see I set progressDrawable to an drawable XML which I tried to copy from everywhere so I think the problem cant be there.
but anyway I will post it
<rotate
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="90"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="360">
<shape
android:innerRadiusRatio="3"
android:shape="ring"
android:thicknessRatio="7.0">
<gradient
android:centerColor="#007DD6"
android:endColor="#007DD6"
android:startColor="#007DD6"
android:angle="0"
android:type="sweep"
android:useLevel="false" />
</shape>
this is an extract from tutorials point
but android still showing the default one
also I made this but I have a suspicion that is a terrible mistake
<?xml version="1.0" encoding="utf-8"?>
<rotate
xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="90"
android:pivotX="50%"
android:pivotY="50%"
android:toDegrees="360">
<bitmap android:src="#drawable/b"/>
</rotate>
but there is no way...
I am stuck no matter what I do Android still showing default one. anyone can help?
Use indeterminateDrawable , not progressDrawable.
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/rotate"
android:layout_centerInParent="true"
android:indeterminateDrawable="#drawable/b"
android:visibility="gone" />
You cant use android:progressDrawable="some value" for animation.
1)Assign some id to rotate tag
2)write this in your activity.java file
Animation anim=AnimationUtils.loadAnimation(this,R.anim.id_of_your_rotate)
3)Retrieve the reference of ProgressBar
ProgressBar demo=new ProgressBar(this);
demo.setAnimation(anim);
I have created circular progress bar and its working fine but the problem is that the left and right edge gets cut.
i cant figure out why is it happening or how to fix it.
Its in a relative layout
Relativelayout containing progressbar
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/Button_searchdriver_Cancel"
android:layout_below="#id/searchDriver_center"
android:padding="3dp"
>
<ProgressBar
android:id="#+id/Progressbar_searchdriver_timer"
style="#android:style/Widget.ProgressBar.Horizontal"
android:layout_width="120dp"
android:layout_height="120dp"
android:layout_alignParentBottom="true"
android:layout_alignParentTop="true"
android:layout_centerInParent="true"
android:background="#drawable/progressbackground"
android:indeterminate="false"
android:max="60"
android:progressDrawable="#drawable/circularprogress" />
</RelativeLayout>
For background and progress i have the following code -
Progress drawable
<?xml version="1.0" encoding="utf-8"?>
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
android:fromDegrees="270"
android:toDegrees="270">
<shape
android:innerRadiusRatio="2.5"
android:shape="ring"
android:thicknessRatio="7.0">
<gradient
android:centerColor="#ffffff"
android:endColor="#ffffff"
android:startColor="#ffffff"
android:angle="0"
android:type="sweep"
android:useLevel="false" />
</shape>
</rotate>
progressbar background
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:innerRadiusRatio="2.5"
android:shape="ring"
android:useLevel="false"
android:thicknessRatio="7.0">
<gradient
android:centerColor="#000000"
android:endColor="#000000"
android:startColor="#000000"
android:angle="0"
android:type="sweep"
android:useLevel="false" />
</shape>
Can any one tell me what am i doing wrong..??
set
android:innerRadiusRatio="3.0"
According to the docs
innerRadiusRatio is the radius for the inner part of the ring, expressed as a ratio of the
ring's width. For instance, if android:innerRadiusRatio="5", then the
inner radius equals the ring's width divided by 5. This value is
overridden by android:innerRadius. Default value is 9.