圓形進度條大小對齊

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"