Индикатор выполнения
Для визуального отображения выполнения процесса используется индикатор выполнения.
Индикатор удобно применять для длительных операций — заполняющаяся область индикатора (полоса прогресса выполнения) и меняющееся значение счетчика информируют пользователя, что процесс не "завис", и показывают, сколько времени осталось до завершения процесса.
Документация API Спецификация Axure
Базовый индикатор выполнения процесса
Базовый индикатор выполнения процесса реализован в классе Controls/progress:Bar. Отображает полосу прогресса выполнения, значение которой (в процентах) определяется опцией value.
<!-- WML -->
<Controls.progress:Bar
name="ProgressBar"
value="{{80}}"/>
Стандартная раскладка индикатора
Стандартная раскладка индикатора реализована в классе Layout/progress:Default. Содержит полосу прогресса выполнения, и под полосой: текст слева, текст справа, процент выполнения.
Заполненность полосы прогресса, а также процент выполнения (отображается под полосой) определяются опцией value.
Значение текста слева и справа от полосы прогресса определяются, соответственно, опциями infoLeft и infoRight.
<!-- WML -->
<div>
<Layout.progress:Default value="{{ _value }}">
<ws:infoLeft>infoLeft</ws:infoLeft>
<ws:infoRight>infoRight</ws:infoRight>
</Layout.progress:Default>
<Controls.input:Number bind:value="_value" precision="{{ 0 }}" />
</div>
Компактная раскладка индикатора
Компактная раскладка индикатора реализована в классе Layout/progress:Compact. Отличается от стандартной отсутствием текста слева от полосы прогресса. Вместо текста слева отображается процент выполнения.
Соответственно, отображение компактного индикатора определяется опциями value и infoRight.
<!-- WML -->
<div>
<Layout.progress:Compact value="{{ _value }}">
<ws:infoRight>infoRight</ws:infoRight>
</Layout.progress:Compact>
<Controls.input:Number bind:value="_value" precision="{{ 0 }}" />
</div>