Indeterminate progress bar android

ProgressBar — Индикатор прогресса

Основы

Компонент ProgressBar (Индикатор прогресса) применяется в тех случаях, когда пользователю нужно показать, что программа не зависла, а выполняет продолжительную работу.

Находится в категории Widgets.

Студия предлагает несколько видов индикаторов: ProgressBar и ProgressBar (Horizontal). В свою очередь компонент имеет несколько модификаций и их отличия заложены в стилях, если посмотреть XML-описание компонентов. Стили постоянно меняются, поэтому проще выбрать атрибут style и посмотреть предлагаемые варианты из выпадающего списка на текущий момент.

Методы для работы с ProgressBar:

• setProgress() — устанавливает заданное значение индикатора прогресса;
• getProgress() — возвращает текущее значение индикатора прогресса;
• incrementProgressBy() — устанавливает величину дискретизации приращения значения индикатора;
• setMax() — устанавливает максимальное значение величины прогресса.

Круговые индикаторы Normal, Small и Large можно просто разместить на экране, и они будут бесконечно выводить анимацию вращения без единой строчки кода.

Как правило, «бесконечный» индикатор выводят в нужный момент, а когда задача выполнена, то его скрывают. Видимость можно установить через XML и программно.

В коде используется метод setVisibility()

Сейчас проекты в студии используют Material Design, поэтому цвет индикатора будет соответствовать ресурсу colorAccent.

Можно переопределить цвет, если вы хотите отказаться от этой связи с colorAccent, задав свой стиль.

Подключаем через тему.

Другая настройка связана с Tint — оттенками цвета (Android 5.0).

Стилизация

Если вам не нравится внешний вид стандартных индикаторов, то можете придумать свой. Есть два варианта для реализации этой цели. В первом случае можно подготовить готовый png-файл (spin_custom.png) и поместить его в ресурс, например, в папку res/drawable.

Затем в этой же папке создаём xml-файл spinner_png.xml с таким содержанием:

Теперь в разметке активности можно определять ProgressBar так:

Если запустить проект, то увидим такой индикатор:

В реальности индикатор выглядит немного корявым, подёргиваясь на экране. Кроме того, изображение можно улучшить, уменьшив количество цветов и сократив размер файла.

Второй вариант выглядит предпочтительней. На этот раз мы обойдёмся без графических файлов, а будем использовать только XML-разметку. В этой же папке поместим файл spinner_ring.xml следующего содержания:

Теперь в разметке активности пропишем строки:

Получим следующий результат:

Индикатор с текстом

К сожалению, индикатор не выводит текст во время работы, что не очень удобно. Можно создать свой ProgressBar из TextView или создать свой компонент на основе ProgressBar. Другой простой способ — наложить текстовый блок прямо на индикатор, используя RelativeLayout. Пример для пояснения.

Код, чтобы увидеть работу индикатора. При каждом щелчке кнопки значение индикаторов увеличиваются на 10 процентов.

Индикаторы прогресса также можно использовать в заголовках приложения у старых устройств, а также в ActionBar и ToolBar у новых устройств.

Компонент постоянно дорабатывается. Например, в Android 8 появились новые методы isAnimating(), getMin(), setMin().

Анимация ObjectAnimator

Можно подключить готовую анимацию для визуализации компонента.

Дополнительное чтение

Material ProgressBar — статья про создание собственного индикатора в стиле Material Design

Indeterminate — серия статей на тему создания индикаторов прогресса, ссылка на первую часть.

Источник

ProgressBar (Horizontal) — горизонтальный индикатор прогресса

Основы

Компонент ProgressBar (Horizontal) (Индикатор прогресса) применяется в тех случаях, когда пользователю нужно показать, что программа не зависла, а выполняет продолжительную работу.

Находится в категории Widgets.

Студия предлагает несколько видов индикаторов: ProgressBar и ProgressBar (Horizontal). В свою очередь компонент имеет несколько модификаций и их отличия заложены в стилях, если посмотреть XML-описание компонентов. Стили постоянно меняются, поэтому проще выбрать атрибут style и посмотреть предлагаемые варианты из выпадающего списка на текущий момент.

Методы для работы с ProgressBar:

• setProgress() — устанавливает заданное значение индикатора прогресса;
• getProgress() — возвращает текущее значение индикатора прогресса;
• incrementProgressBy() — устанавливает величину дискретизации приращения значения индикатора;
• setMax() — устанавливает максимальное значение величины прогресса.

Горизонтальный индикатор обычно используют, чтобы показать индикатор в действии. При длительной операции пользователь видит, что полоска индикатора постоянно увеличивается.

Нужно задать верхнюю границу диапазона max и начальное значение progress и затем программно работать с этими данными.

Атрибут android:secondaryProgress=»50″ создаёт эффект буфера, когда рисуется ещё одна полоска, опережающая основной цвет. Ей можно управлять через метод setSecondaryProgress().

Отдельный поток

Выполнение длительных операций предпочтительнее производить в отдельном потоке. Android имеет специальный класс Handler для создания фоновых потоков и их взаимодействия с пользовательским интерфейсом. Либо используется AsyncTask и другие способы выполнения в другом потоке.

Запустим индикатор через кнопку.

Будем усыплять поток на небольшой промежуток времени.

Часто нужно выводить не круглое число 100, а что-то другое (размер файла). Тогда нужно сделать небольшие вычисления, чтобы выводились данные в процентах.

Допустим размер файла 365 Мб. Запускаем и смотрим — вся жизнь пробежала перед глазами, ну или год.

Пунктирный ProgressBar

Изменим обычную линию на пунктир. Создадим файл res/drawable/dash_progressbar.xml.

Подключим через атрибут progressDrawable.

Режим Indeterminate

Существует режим неопределённости (indeterminate), когда индикатор работает постоянно. Для этого нужно установить соответствующие атрибуты.

При запуске индикатор прогресса без всякого кода будет выводить бесконечную анимацию.

Переключение между режимами программно — метод setIndeterminate(boolean indeterminate).

Аккуратнее с атрибутом indeterminateOnly, если он будет установлен, то анимацию программно уже не приостановить. В этом случае просто не используйте атрибут. Несмотря на анимацию, индикатор по прежнему меняет свои показания. Если брать предыдущий пример с процентами и установить атрибуты, указанные выше (кроме indeterminateOnly), то программно можно остановить анимацию следующим образом.

Также часто используют изменение видимости — когда индикатор не нужен, его просто прячут.

Настройка через XML

Индикатор прогресса работает в стиле Material Design на Lollipop-устройствах и выше. На старых устройствах выводится другой цвет.

Можно задать свои настройки для цвета.

Для тонкой настройки компонента под себя следует использовать файл в ресурсах с использованием LayerDrawable. Файл ресурсов должен использовать системный идентификатор @android:id/background для фона, а также идентификатор @android:id/progress для самого индикатора. Также можно использовать ещё один необязательный идентификатор @android:id/secondaryProgress для дополнительного индикатора. Пример ниже.

Вертикальный индикатор прогресса

По умолчанию используется горизонтальный индикатор. Можно создать собственный индикатор с вертикальной ориентацией.

Рассмотрим пример с обычной вертикальной линией. Создадим файл res/drawable/vert_progressbar.xml.

Задействуем атрибут android:progressDrawable. Есть определённая сложность размещения компонента на экране. Хотя мы хотим видеть вертикальный индикатор, студия воспринимает его по-прежнему горизонтальным и в режиме дизайна отображает его соответствующим образом. Попробуем следующий вариант.

Код можно взять из примера с процентами. Там всё без изменений.

Вариант не слишком удобный, так как не интуитивен при визуальном размещении.

Другой вариант вертикального индикатора, который гораздо лучше справляется со своей задачей. Кроме того, индикатор будет не виде линии, а полноценным жирным прямоугольником. В папке res/drawable подготовим два файла:

verticalprogressbar.xml

verticalprogressbar2.xml

Разница между двумя файлами только в цвете, которым закрашивается индикатор во время работы. Я создал второй файл только для демонстрации программного изменения индикатора — когда значение индикатора достигнет отметки 50, то цвет поменяется на зелёный.

Код можно вставить после строчки из предыдущего примера:

Также можно использовать атрибут XML.

Круговые индикаторы прогресса

Несмотря на то, что компонент называется горизонтальным индикатором прогресса, мы уже изменили его на вертикальный. Но это не предел, мы можем сделать индикатор круговым.

Сначала покажу неудачный пример, который попался в интернете. Создадим файл res/drawable/circular_progressbar.xml.

Снова используем атрибут android:progressDrawable. Чтобы пример работал должным образом, нужно следить за размерами индикатора — ширина и высота должны быть одинаковыми. Если забыть об этом, то получим следующее.

Попробуем установить одинаковые размеры, а также добавить пунктир и градиент.

Для примера с обратным отсчётом я использовал индикатор с двумя drawable-ресурсами, используя shape с другими параметрами.

Индикатор с текстом

К сожалению, индикатор не выводит текст во время работы, что не очень удобно. Можно создать свой ProgressBar из TextView или создать свой компонент на основе ProgressBar. Другой простой способ — наложить текстовый блок прямо на индикатор, используя RelativeLayout. Пример для пояснения.

Код, чтобы увидеть работу индикатора. При каждом щелчке кнопки значение индикаторов увеличиваются на 10 процентов.

Программное создание индикатора

Данный способ уже устарел, так как через XML намного удобнее. Для общего развития.

Индикаторы прогресса также можно использовать в заголовках приложения у старых устройств, а также в ActionBar и ToolBar у новых устройств.

Компонент постоянно дорабатывается. Например, в Android 8 появились новые методы isAnimating(), getMin(), setMin().

Анимация ObjectAnimator

Можно подключить готовую анимацию для визуализации компонента.

Дополнительное чтение

Material ProgressBar — статья про создание собственного индикатора в стиле Material Design

Indeterminate — серия статей на тему создания индикаторов прогресса, ссылка на первую часть.

Источник

Android Indeterminate Circular Progress Bar Programmatically | Animation

We will develop Android Indeterminate Circular Progress Bar in this post.

When you want to tell user that some process is going on and he need to wait till the end of that process, progress bar is the best way to do so.

Progress bar can be of two types regarding the progress status.

YouTube Output

Watch how does all four progress bars looks like

Determinate Progress bar and Indeterminate Progress bar.

Determinate Progress bar

When you know the exact time ratio of the loading process, you should use determinate progress bar.

In the determinate progress bar you need to show to user that how much that process has done it’s operations.

Generally, developers use percentage as an indicator to tell user that how much percentage of the process has done it’s operation.

If you want to use determinate circular progress bar checkout how to create custom circular determinate progress bar example.

Read Other Examples On Progress Bar

Indeterminate Progress bar

Indeterminate progress bar means that you do not know how much the process will take.

So this type of progress bar just shows some loading animations without any percentage.

We will develop four types of circular indeterminate progress bars in this example tutorial.

Step 1. Drawable files

For developing custom progress bars, we need to create some drawable xml files to define various properties.

Create a new xml file under res->drawable file and name it “first.xml”

Add below source code in first.xml

Now prepare another xml file named second.xml in the same directory.

Copy the following code in it

Create new xml file in the same directory named “third.xml” and write below lines

Let us understand properties from above three files.

android:shape=”oval”

In the tag, android:shape=”oval” will define the shape of the progress bar.

Value of shape can be ring, rectangle, line or oval.

android:thichness=”20dp”

This property defines the thickness of the circular progress bar.

android:startcolor & android:endcolor

These two properties are from the tag.

First one defines the starting color and second one defines the end color of the gradient effect.

• There is also a third property called centerColor which defines middle color of the gradient effect.

Now make new xml file again in the same directory and name it “fourth.xml”

Enter below code in fourth.xml

In the fourth.xml file. there is reference to the image file.

Download this image by clicking the below link

[sociallocker] Download Red Progress bar Image [/sociallocker]

Above image will rotate constantly.

Image is developed in such way that when it rotates, it creates a shape like circular progress bar.

Step 2. Create All Four Activities

Prepare a new activity named “FirstActivity”.

You will have now two files activity_first.xml and FirstActivity.java

We do need to do anything with FirstActivity.java here.

Just add the following source code in activity_first.xml

We setting the progress bar in the middle of the screen. In the LinearLayout, gravity=”center” is doing this task for us.

In the Progress bar, we have set the drawable as the first.xml file which have created in Step 1.

• I have set the indeterminateDuration property as 2000. It is defining the speed of the circular progress bar.
• If you want to increase the speed then increase this property. Decrease this property to slow down the progress bar.

Second Activity

Now create another activity called “Second Activity.”

Here you will have activity_second.xml and SecondActivity.java files.

Add below code in activity_second.xml

Third Activity

Create new empty activity named third activity.

Add below code in activity_third.xml

Fourth Activity

Prepare another new activity and name it Fourth Activity.

Write down following code in activity_fourth.xml

Step 3. Towards End

Last thing is to add some code in activity_main.xml and MainActivity.java

Write down below source code in activity_main.xml

Code for MainActivity.java is as follows

• I have taken four buttons in this activity.
• Each activity will be open on each button click.

Источник