2016-08-01 2 views
2

Это время, я застрял в этой проблеме. Может быть, кто-то может помочь.Круговой прогресс выравнивание размера бара

Проблема заключается в том, что мой круговой индикатор хода Android имеет разные размеры в соответствии с размерами мобильного экрана.

Снимок экрана должен объяснить проблему.

enter image description here

Синий неполна круг круговой прогресс бар (анимации). Он должен фактически бежать поверх белого круга. Он работает только с определенным размером экрана.

Белый круг установлен в качестве фона, пригодного для выполнения индикатора выполнения.

Вот коды. (Я поставил только необходимый код)

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> 

Я попытался сделать circle_shape.xml (фон индикатора прогресса) в соответствии с размером экрана в соответствии с этим https://stackoverflow.com/a/9362168/3929188. Но создание bitmap xml из drawable было для меня сложным, что я просто не мог этого сделать (разработчик noobie).

Я попытался поместить фон для circle_progress_bar.xml, чтобы анимация синего круга опустилась поверх белого круга, но не удалась.

Любые идеи приветствуются!

ответ

2

окончательно решён. Я помещал фоновый рисунок кругового прогресса как отдельный вид в 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); 

Надеюсь, что это кому-то поможет. :)

0

я не знаю, почему вы повернете от fromDegrees 0 до toDegrees 0, может быть вызвано этим

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

нет! на самом деле анимация вращения управляется из кода. Я думаю, что это не имеет никакого отношения к масштабированию фонового изображения. –

+0

вы попробовали это. view.setScaleType (ScaleType.FIT_XY); – lanniaoyidingying

+0

Мне нужно больше объяснений. Мой вопрос заключался в том, как масштабировать фоновые рисунки. Как вы можете получить фоновый drawable (circle_shape.xml в этом случае) в коде как объект вида, чтобы его можно масштабировать? я noobie. любезно прощай, если я спросил что-то не так. –