Как реализовать материал дизайн круговой индикатор выполнения в android



Я хочу сделать материал дизайн круговой прогресс бар, как тот, в Inbox by Gmail android app. Как этого добиться (в устройствах pre-lollipop)?



Я пытаюсь добиться подобного эффекта, как это.
входящие по Gmail материал дизайн круговой индикатор выполнения

960   7  

7 ответов:

<ProgressBar
android:id="@+id/loading_spinner"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:indeterminateTintMode="src_atop"
android:indeterminateTint="@color/your_customized_color"
android:layout_gravity="center" />

эффект выглядит так:

img

хорошая реализация для материала дизайн круговой индикатор выполнения (от rahatarmanahmed / CircularProgressView),

<com.github.rahatarmanahmed.cpv.CircularProgressView
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/progress_view"
    android:layout_width="40dp"
    android:layout_height="40dp"
    app:cpv_indeterminate="true"/>

enter image description here

Я возвратил три материала прогресса дизайна drawables для Android 4.0, которые могут быть использованы в качестве замены для регулярныхProgressBar, с точно таким же внешним видом.

эти чертежи также вернули API тонировки (и поддержку RTL) и используют ?colorControlActivated как оттенок по умолчанию. А MaterialProgressBar виджет, который расширяет ProgressBar также было введено для удобства.

DreaminginCodeZH / MaterialProgressBar

этот проект также был принят afollestad / material-dialogs в диалоге прогресса.

На Android 4.4.4:

Android 4.4.4

На Android 5.1.1:

Android 5.1.1

вот удивительная реализация кругового промежуточного индикатора выполнения material design https://gist.github.com/castorflex/4e46a9dc2c3a4245a28e. реализация только не хватает возможности добавлять различные цвета, как в inbox от android приложения, но это делает довольно большую работу.

кроме cozeJ4 это ответ тут обновленная версия этого gist

в оригинале отсутствовал импорт и содержались некоторые ошибки. Это один готов к использованию.

платформа использует векторное рисование, поэтому вы не можете использовать его, как в старых версиях.
Тем не менее, поддержка lib v4 содержит задний порт этого drawable : http://androidxref.com/5.1.0_r1/xref/frameworks/support/v4/java/android/support/v4/widget/MaterialProgressDrawable.java Он имеет @hide аннотация (это здесь для SwipeRefreshLayout), но ничто не мешает вам скопировать этот класс в вашей кодовой базе.

искал способ сделать это с помощью простого xml, но не смог найти никаких полезных ответов, поэтому придумал это.

это работает и на предварительных версиях lollipop, и довольно близко к индикатору прогресса material design. Вам просто нужно использовать это drawable как indeterminate drawable на ProgressBar макет.

<?xml version="1.0" encoding="utf-8"?><!--<layer-list>-->
<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:fromDegrees="0"
    android:toDegrees="360">
    <layer-list>
        <item>
            <rotate xmlns:android="http://schemas.android.com/apk/res/android"
                android:fromDegrees="-90"
                android:toDegrees="-90">
                <shape
                    android:innerRadiusRatio="2.5"
                    android:shape="ring"
                    android:thickness="2dp"
                    android:useLevel="true"><!-- this line fixes the issue for lollipop api 21 -->

                    <gradient
                        android:angle="0"
                        android:endColor="#007DD6"
                        android:startColor="#007DD6"
                        android:type="sweep"
                        android:useLevel="false" />
                </shape>
            </rotate>
        </item>
        <item>
            <rotate xmlns:android="http://schemas.android.com/apk/res/android"
                android:fromDegrees="0"
                android:toDegrees="270">
                <shape
                    android:innerRadiusRatio="2.6"
                    android:shape="ring"
                    android:thickness="4dp"
                    android:useLevel="true"><!-- this line fixes the issue for lollipop api 21 -->
                    <gradient
                        android:angle="0"
                        android:centerColor="#FFF"
                        android:endColor="#FFF"
                        android:startColor="#FFF"
                        android:useLevel="false" />
                </shape>
            </rotate>
        </item>
    </layer-list>
</rotate>

установите выше drawable в ProgressBar следующим образом:

  android:indeterminatedrawable="@drawable/above_drawable"

Comments

    Ничего не найдено.