Слияние кода завершено, страница обновится автоматически
| Добавление состояния загрузки для AbilityУспешная загрузка | Ошибка загрузки Клик для повторной попытки |
Успешная загрузка Нет данных |
Использование специальной View загрузки для некоторых страниц |
|---|---|---|---|
 |
 |
 |
 Добавление состояния загрузки для компонента |
| Для Slice | Для ScrollView | Для ListContainer |
|---|---|---|
 |
 |
 |
Анимация загрузки присутствует практически во всех проектах HMS HAP.
Обычно она используется в ситуациях, требующих ожидания пользователя, чтобы показать ему, что приложение загружает данные, а не зависло, обеспечивая тем самым лучший опыт использования.
То же самое относится к ситуации, когда данные загружаются, но они отсутствуют — лучше показывать пользователю сообщение "нет данных", а также UI ошибки загрузки со способностью кликнуть для повторной попытки вместо белого экрана.
Стили UI для состояний "загрузка", "ошибка загрузки" и "отсутствия данных" обычно должны быть едиными для всех страниц внутри одного приложения, то есть должно быть глобальное единство.#### Традиционный подход1. Определите один или несколько компонентов отображения различных состояний загрузки (или XML-разметки) (например: LoadingComponent)
2. В разметке каждого экрана включите этот компонент
3. Упакуйте логику инициализации LoadingComponent и логику изменения состояния загрузки в BaseAbility/BaseSlice, выведите следующие методы для использования потомками:
void showLoading(); // Вызов этого метода показывает анимацию загрузкиvoid showLoadFailed(); // Вызов этого метода показывает страницу с сообщением об ошибке при загрузкеvoid showEmpty(); // Вызов этого метода показывает пустую страницуvoid onClickRetry(); // Реализация в потомках, обратный вызов нажатия кнопки "Повторить"BaseAbility/BaseSlice можно легко использовать функцию отображения состояния загрузки благодаря вышеупомянутому упаковываниюЭтот способ имеет слишком высокую связанность: каждый экран должен иметь в своей разметке компонент LoadingComponent. Это затрудняет использование и увеличивает стоимость поддержки. При необходимости дизайнер UI может столкнуться с трудностями при изменении разметки.LoadingComponent)LoadingUtil) для управления LoadingComponent, который будет менять состояние UI (или переключаться между различными компонентами)LoadingUtil в BaseAbility/BaseSlice, выведите следующие методы для использования потомками:
void showLoading(); // Вызов этого метода показывает анимацию загрузкиvoid showLoadFailed(); // Вызов этого метода показывает страницу с сообщением об ошибке при загрузкеvoid showEmpty(); // Вызов этого метода показывает пустую страницуvoid onClickRetry(); // Реализация в потомках, обратный вызов нажатия кнопки "Повторить"<font color="red">абстрактный int getContainerId();</font> // Реализация в потомках, LoadingUtil динамически создает LoadingComponent и добавляет его в контейнер с указанным IDBaseAbility/BaseSlice можно легко использовать функцию отображения состояния загрузки благодаря вышеупомянутому упаковываниюПреимущество такого подхода заключается в том, что он позволяет динамически создавать LoadingComponent и добавлять его в указанный родительский контейнер, позволяя конкретным страницам не беспокоиться о реализации LoadingComponent, а просто указывать, где именно он должен отображаться. Это значительно снижает связанность. Если компания использует это только в одном HAP, то это должно быть достаточно. Однако, такой способ упаковки всё ещё влечёт за собой связанность: страница и её используемый LoadingComponent всё ещё связаны друг с другом. Если требуется повторное использование в других HAP, то из-за различных стилей пользовательского интерфейса каждого приложения, соответствующий LoadingComponent также может иметь различные макеты. Для достижения повторного использования необходимо сначала разорвать связь между страницей и LoadingComponent.LoadingComponent страницы без изменения кода самой страницыLoadingComponent на странице (например, не хотим, чтобы LoadingComponent скрывал заголовок навигационной панели)LoadingComponent HAP, реализованный на основе подхода адаптера (включает всего один файл на языке Java с менее чем 300 строками, где комментарии занимают более 100 строк, а размер файла aar составляет 6К).1. Внедрение зависимостиallprojects{
repositories{
mavenCentral()
}
}
implementation 'io.openharmony.tpc.thirdlib:Gloading:1.0.3'
getComponent. Gloading не вторгается в разметку UI, полностью предоставляя возможность пользователю самостоятельно определять.public class GlobalAdapter implements Gloading.Adapter {
@Override
public Component getComponent(Gloading.Holder holder, Component convertComponent, int status) {
GlobalLoadingStatusView loadingStatusView = null;
// convertComponent — это переиспользуемый макет
// Holder хранит кэшированные представления для каждого состояния
// Если компонент для данного состояния равен null, то convertComponent будет представлять собой компонент предыдущего состояния
// Если компонент предыдущего состояния также равен null, то convertComponent будет равен null
if (convertComponent != null && convertComponent instanceof GlobalLoadingStatusView) {
loadingStatusView = (GlobalLoadingStatusView) convertComponent;
}
if (loadingStatusView == null) {
loadingStatusView = new GlobalLoadingStatusView(holder.getContext(), holder.getRetryTask());
}
loadingStatusView.setStatus(status);
return loadingStatusView;
}
class GlobalLoadingStatusView extends DependentLayout {
GlobalLoadingStatusView
public GlobalLoadingStatusView(Context context, Runnable retryTask) {
super(context);
// Инициализация компонента LoadingComponent
// Если требуется поддержка повторной попытки, при необходимости добавьте событие клика к соответствующему элементу управления
}
```### Установка состояния
```java
public void setStatus(int status) {
// Устанавливает текущее состояние загрузки: загрузка в процессе, загрузка завершилась ошибкой, отсутствие данных и т.д.
// В случае ошибочной загрузки можно проверить наличие интернет-соединения и показывать сообщение "нет сети"
// Это является одним из вариантов состояния ошибки загрузки, которое можно реализовать по желанию
}
3. Инициализация стандартного адаптера Gloading
Gloading.initDefault(new GlobalAdapter());
```
4. В местах использования компонента `LoadingComponent` получите объект `Holder`.
```java
// Отображается в Ability, родительский контейнер — mLayout
Gloading.Holder holder = Gloading.getDefault().wrap(ability, mLayout);
// Поддержка повторной попытки при ошибке загрузки
Gloading.Holder holder = Gloading.getDefault().wrap(ability, mLayout).withRetry(retryTask);
```
или
```java
// Отображение состояния загрузки для какого-либо компонента
// Gloading автоматически создает FrameLayout, который оборачивает указанный компонент, а также отображает LoadingComponent внутри него
Gloading.Holder holder = Gloading.getDefault().wrap(component);
// Поддержка повторной попытки при ошибке загрузки
Gloading.Holder holder = Gloading.getDefault().wrap(component).withRetry(retryTask);
```
4.1 Если родительским контейнером является `DependentLayout`, то использование метода `cover` позволит сохранить связь с другими элементами управления.
```java
Gloading.Holder holder = Gloading.getDefault().cover(component);
// или
Gloading.Holder holder = Gloading.getDefault().cover(component).withRetry(retryTask);
```5. Используйте `Holder` для отображения различных состояний загрузки.
```java
//Отображение состояния загрузки (обычно это показывает анимацию загрузки)
holder.showLoading();
//Отображение успешного завершения загрузки (обычно это скрытие LoadingComponent)
holder.showLoadSuccess();
//Отображение неудачной загрузки
holder.showFailed();
//Загрузка данных завершена, но данные пустые
holder.showEmpty();
//Если вышеуказанные состояния недостаточны, используйте этот метод для вызова других состояний
holder.showLoadingStatus(status);
```
6. Поддержка многопроцессного режима для страниц и компонентов
Каждый HAP может иметь свой уникальный `LoadingComponent`. Для каждого HAP требуется предоставление разных адаптеров (`Adapter`). Различные приложения могут использовать различные `Gloading.initDefault(new GlobalAdapter());`. Код использования конкретных страниц остаётся без изменений.
## Включение/отключение режима отладки
```java
//Установка значения true приведёт к выводу логов в Logcat
Gloading.debug(trueOrFalse);
```
## Различия в вызовах
```java
Gloading.Holder holder = Gloading.getDefault().wrap(activity);
```
заменено на
```java
//Необходимо передать родительский контейнер
Gloading.Holder holder = Gloading.getDefault().wrap(ability, mLayout);
```
## Пример требований для запуска entry
Используйте DevEco Studio и скачайте SDK.
В файле build.gradle проекта измените версию зависимости classpath на соответствующую версию (такую же, как используется в новом проекте IDE).
Вы можете оставить комментарий после Вход в систему
Неприемлемый контент может быть отображен здесь и не будет показан на странице. Вы можете проверить и изменить его с помощью соответствующей функции редактирования.
Если вы подтверждаете, что содержание не содержит непристойной лексики/перенаправления на рекламу/насилия/вульгарной порнографии/нарушений/пиратства/ложного/незначительного или незаконного контента, связанного с национальными законами и предписаниями, вы можете нажать «Отправить» для подачи апелляции, и мы обработаем ее как можно скорее.
Комментарии ( 0 )