android - Circular progress bar size alignment -


it's while stuck issue. may 1 can help.

the problem background of android circular progress bar has different sizes according mobile screen sizes.

the screen shot should explain issue.

enter image description here

the blue incomplete circle circular progress bar(animating). should run on top of white circle. works right on particular screen size.

the white circle set background drawable of progress bar.

here codes. (i have put needed code)

acivity_countdown.xml

<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android"     android:layout_height="fill_parent"     android:layout_width="fill_parent"     android:orientation="vertical"     android:background="#fd4c0d"     >     <framelayout         android:id="@+id/countdownproress"     android:layout_width="fill_parent"     android:layout_height="wrap_content"     android:layout_weight="1"     android:background="#fd4c0d"     >         <progressbar         android:id="@+id/progressbar"         style="?android:attr/progressbarstylehorizontal"         android:layout_width="match_parent"         android:layout_height="match_parent"         android:indeterminate="false"         android:progressdrawable="@drawable/circular_progress_bar"         android:layout_alignparentbottom="true"         android:background="@drawable/circular_shape"         android:layout_centerhorizontal="true"         android:max="500"         android:progress="0"         ></progressbar>         <linearlayout.../><!--this layout contains text inside circular progress -->     </framelayout>     <framelayout.../><!--this layout contains button under circular progress --> </linearlayout> 

circular_progress_bar.xml

<?xml version="1.0" encoding="utf-8"?> <rotate xmlns:android="http://schemas.android.com/apk/res/android"     android:fromdegrees="0"     android:todegrees="0">     <shape         android:innerradiusratio="2.5"         android:shape="ring"         android:thickness="3dp"         android:uselevel="true">         <gradient             android:angle="0"             android:endcolor="#005b7f"             android:startcolor="#005b7f"             android:type="sweep"             android:uselevel="false">         </gradient>     </shape> </rotate> 

circular_shape.xml(the background drawable)

<?xml version="1.0" encoding="utf-8"?> <shape     xmlns:android="http://schemas.android.com/apk/res/android"     android:uselevel="false"     android:innerradius="145dp"     android:shape="ring"     android:thickness="0.8dp"     >     <solid android:color = "#ffffff"/> </shape> 

i have tried make circular_shape.xml (background of progress bar) scale according screen size according https://stackoverflow.com/a/9362168/3929188. creating bitmap xml drawable challenging me couldn't (noobie developer).

i have tried put background circular_progress_bar.xml blue circle animation goes on top of white circle, failed.

any ideas welcomed!

solved finally. put background drawable of circular progress separate view in framelayout.

acivity_countdown.xml

<?xml version="1.0" encoding="utf-8"?> <linearlayout xmlns:android="http://schemas.android.com/apk/res/android"     android:layout_height="fill_parent"     android:layout_width="fill_parent"     android:orientation="vertical"     android:background="#fd4c0d"     >     <framelayout         android:id="@+id/countdownproress"     android:layout_width="fill_parent"     android:layout_height="wrap_content"     android:layout_weight="1"     android:background="#fd4c0d"     >         <imageview             android:id="@+id/progressbackground"             android:src="@drawable/circular_shape"             android:layout_width="fill_parent"             android:layout_height="fill_parent"             ></imageview>         <progressbar         android:id="@+id/progressbar"         style="?android:attr/progressbarstylehorizontal"         android:layout_width="fill_parent"         android:layout_height="fill_parent"             android:layout_gravity="center"         android:indeterminate="false"         android:progressdrawable="@drawable/circular_progress_bar"         android:layout_alignparentbottom="true"          android:layout_centerhorizontal="true"         android:max="500"         android:progress="0"         ></progressbar>         <linearlayout.../><!--this layout contains text inside circular progress -->     </framelayout>     <framelayout.../><!--this layout contains button under circular progress --> </linearlayout> 

circular_progress_bar.xml (drawable)

<?xml version="1.0" encoding="utf-8"?> <rotate xmlns:android="http://schemas.android.com/apk/res/android"     android:fromdegrees="0"     android:todegrees="0">     <shape         android:shape="ring"         android:thickness="3dp"         android:uselevel="true">         <gradient             android:angle="0"             android:endcolor="#005b7f"             android:startcolor="#005b7f"             android:type="sweep"             android:uselevel="false">         </gradient>     </shape> </rotate> 

circular_shape.xml(the background drawable)

<?xml version="1.0" encoding="utf-8"?>  <shape xmlns:android="http://schemas.android.com/apk/res/android"     android:uselevel="false"     android:shape="ring"     android:thickness="0.8dp" >     <solid android:color="#ffffff"/> </shape> 

this made scale according mobile screen size. size small. had little more big. added code in oncreate()

        framelayout frame=(framelayout) findviewbyid(r.id.countdownproressframe);         linearlayout.layoutparams lp = new linearlayout.layoutparams(displaymetrics.widthpixels +150 , displaymetrics.heightpixels-300);         lp.weight = 1;         lp.gravity = gravity.center;         frame.setlayoutparams(lp);         imageview img=(imageview) findviewbyid(r.id.progressbackground);         framelayout.layoutparams framelp = new framelayout.layoutparams(displaymetrics.widthpixels +155 , displaymetrics.heightpixels-280);         framelp.gravity = gravity.center;         img.setlayoutparams(framelp); 

hope helps someone. :)


Comments