圆形进度条大小对齐

Question

这是一段时间我坚持这个问题。可能有些人可以帮忙。

问题是我的android圆形进度条的背景根据手机屏幕大小有不同的大小。

屏幕快照应该说明问题。

蓝不完整的圆是圆形进度条（动画）。它应该实际上运行在白色圆圈之上。它只适用于特定的屏幕尺寸。

将白色圆圈设置为进度条的背景可绘制。

以下是代码。 （我已经把需要的只是代码）

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（背景绘制）

<?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> 

我试图根据这个https://stackoverflow.com/a/9362168/3929188根据屏幕大小缩放circular_shape.xml（进度条的背景）。但是从drawable创建一个位图xml对我来说是一个挑战，我根本无法做到这一点（noobie developer）。

我试图为circular_progress_bar.xml放置背景，以便蓝色圆圈动画位于白色圆圈之上，但失败。

欢迎任何想法！

Answer 1

终于解决了引起的。我在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（绘制）

<?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（背景绘制）

<?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> 

这使得它根据手机屏幕尺寸进行缩放。但规模很小。我必须把它变得更大一点。所以我在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); 

希望它可以帮助别人。 :)

Answer 2

我不知道为什么你从fromDegrees 0至0 toDegrees旋转，可以通过这个

rotate xmlns:android="http://schemas.android.com/apk/res/android" 
android:fromDegrees="0" 
android:toDegrees="0"