Блог

У меня есть круговой индикатор выполнения, который состоит из двух рисоваемых xml-файлов.

—Один содержит сплошной круг плюс кольцо на внешней окружности.

—Другой-это кольцо, которое идет поверх вышеупомянутого. Это индикатор выполнения, который постепенно исчезает, показывая изображение ниже.

Я заставил его работать с layout_width и layout_height=160dp (см. Изображение), но когда я увеличиваю его до 260dp, по какой-то причине сплошной круг и кольца больше не «синхронизированы»: оба кольца остаются на своих правильных позициях, но сплошной круг растет немного больше, чем должен, создавая нежелательный «обод» (см. Другое изображение).

Я перепробовал всевозможные варианты с размером и толщиной, innerRadius вместо innerRadiusRatio, также wrap_content, отступы… все параметры, которые я мог придумать, но, похоже, ничего не работает.

Я также попытался использовать .png круга вместо фона, и у меня возникла та же проблема: когда вы увеличиваете размеры, круг становится слишком большим, создавая обод.

Я уверен, что это должно быть что-то очень простое, но я не могу его найти; кто-нибудь может мне помочь? Любая идея была бы очень признательна…

Соответствующий код:

activity_main.xml:

 <ProgressBar
    android:id="@ id/progressBarCircle"
    style="?android:attr/progressBarStyleHorizontal"
    android:layout_width="260dp"
    android:layout_height="260dp"
    android:layout_centerHorizontal="true"
    android:layout_centerVertical="true"
    android:layout_marginTop="16dp"
    android:layout_marginBottom="16dp"
    android:background="@drawable/rosco_vacio_y_fondo"
    android:indeterminate="false"
    android:max="100"
    android:progress="100"
    android:progressDrawable="@drawable/rosco_lleno"
    android:rotation="-90"
    app:layout_constraintBottom_toTopOf="@ id/adView"
    app:layout_constraintHorizontal_bias="0.5"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@ id/contadorM"
    app:layout_constraintVertical_bias="0.0"
    app:layout_constraintVertical_chainStyle="packed" />
 

rosco_lleno.xml:

 <?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadiusRatio="2.3"

    android:shape="ring"
    android:thickness="10dp"
    android:useLevel="true">
    <gradient android:startColor="@color/barraLlena"
        android:endColor="#701914"/>
</shape>
    </item>

</layer-list>
 

rosco_vacio_y_fondo.xml:

 <?xml version="1.0" encoding="utf-8"?>
<layer-list>
<item>
    <shape xmlns:android="http://schemas.android.com/apk/res/android"
        android:innerRadiusRatio="2.3"
        android:shape="oval"
        android:useLevel="true">
        <solid android:color="@color/fondoRosco" />
    </shape>
</item>

<item>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:innerRadiusRatio="2.3"
    android:shape="ring"
    android:thickness="10dp"
    android:useLevel="false"
    >

    <solid android:color="@color/roscoVacio" />

</shape>
</item>
<