Графические UI-компоненты

• Обзор

• Содержание

• Ограничения

• Компиляция и сборка

• Описание

  • Описание компонентов
  • Инструкции по использованию

• Связанные репозитории

Обзор

Графические UI-компоненты реализуют набор системных графических движков.

Эти компоненты предоставляют для приложений интерфейс UIKit, включающий анимацию, разметку, графические преобразования, обработку событий и множество богатых UI-компонентов.

Внутри компоненты напрямую используют интерфейсы HAL или клиентские интерфейсы, предоставляемые WMS (Window Manager Service), для взаимодействия с аппаратными средствами, чтобы выполнить обработку событий и рисование изображений.

Рис. 1 Структура графической подсистемы
## Содержание``` /foundation/arkui/ui_lite ├── frameworks # Код фреймворков │ ├── animator # Модуль анимации │ ├── common # Общий модуль │ ├── components # Компоненты │ ├── core # Основной поток UI (рендеринг, управление задачами и т. д.) │ ├── default_resource │ ├── dfx # Функции диагностики │ ├── dock # Слой адаптации драйвера │ │ └── ohos # Адаптация для платформы OHOS │ ├── draw # Логика рисования │ ├── engines # Рисовальные движки │ ├── events # События │ ├── font # Шрифты │ ├── imgdecode # Управление изображениями │ ├── layout # Разметка страниц │ ├── themes # Управление темами │ ├── window # Слой адаптации окон │ └── window_manager │ └── dfb ├── interfaces # Интерфейсы │ ├── innerkits # Интерфейсы между модулями │ │ └── xxx # Интерфейсы подмодулей │ └── kits # Внешние интерфейсы │ └── xxx # Интерфейсы подмодулей ├── test # Тестовые коды │ ├── framework │ │ ├── include # Заголовочные файлы тестового фреймворка │ │ └── src # Исходные файлы тестового фреймворка │ ├── uitest # Тестирование отображения (выполняемый файл в foundation/window/window_manager_lite/test:sample_ui) │ │ └── test_xxx # Тестирование конкретных компонентов UI

│       └── xxx                 # Unit tests for specific UI components
└── tools                       # Testing tools and simulator (simulator project, resource files)
    └── qt                      # QT project
```## Ограничения<a name="section119744591305"></a>```Платформенные ограничения

-   Windows платформа поддерживает только QT и OHOS IDE.
-   Поддержка других платформ указана в файле vendor/hisilicon/\[product\_name\]/config.json в графическом теге (отсутствие графического тега указывает на отсутствие графической подсистемы продукта).

## Компиляция и сборка<a name="section137768191623"></a>

Компиляция с помощью gn, создание графической библиотеки в соответствующей папке продукта в директории out

hb build -T //foundation/arkui/ui_lite:ui_lite -f # Компиляция libui.so hb build -T //foundation/window/window_manager_lite/test:sample_ui -f # Компиляция примера UI hb build -T //foundation/arkui/ui_lite/test/unittest:arkui_ui_lite_test -f # Компиляция тестовых примеров TDD

Компиляция qt библиотеки можно найти в проекте qt симулятора: arkui/ui_lite/tools/qt/simulator/simulator.pro

## Описание<a name="section1312121216216"></a>

### Описание компонентов<a name="section66002422015"></a>

Компоненты делятся на базовые компоненты и контейнерные компоненты

-   Базовые компоненты: реализуют только собственные функции, такие как кнопка, текст, изображение и т.д.;
-   Контейнерные компоненты: могут содержать другие компоненты как свои подкомпоненты, используя их для реализации сложных функций.

**Рис. 2** Обзор графических компонентов<a name="fig1594213196218"></a>  
![](figures/图形组件一览.png "Обзор графических компонентов")

### Инструкции по использованию<a name="section129654513264"></a>

В директории foundation/arkui/ui_lite/test/uitest предоставлены примеры использования всех графических компонентов и функциональных интерфейсов.-   В окружении Windows можно использовать QT проект для отладки, подробнее см. [руководство по добавлению](https://gitee.com/openharmony/arkui_ui_lite/wikis/%E5%BF%AB%E9%80%9F%E5%8A%A0%E5%85%A5/%E5%8A%A0%E5%85%A5%E6%8C%87%E5%BC%95)

    Путь к проекту:

    ```
    arkui/ui_lite/tools/qt/simulator/simulator.pro
    ```

-   Для других окружений отладки можно скомпилировать и запустить foundation/window/window_manager_lite/test:sample_ui

    После успешной компиляции получите исполняемый файл out/[product_name]/dev_tools/bin/sample_ui, который можно запустить в реальном окружении для проверки отображения соответствующих компонентов.

## Связанные репозитории<a name="section1371113476307"></a>

[Графическая подсистема](https://gitee.com/openharmony/docs/blob/master/zh-cn/readme/%E5%9B%A2%E5%BD%A2%E5%AD%90%E7%B3%BB%E7%BB%9F.md)

[window_window_manager_lite](https://gitee.com/openharmony/window_window_manager_lite/blob/master/README.md)

[graphic_surface_lite](https://gitee.com/openharmony/graphic_surface_lite/blob/master/README.md)

[arkui_ui_lite](https://gitee.com/openharmony/arkui_ui_lite/blob/master/README.md)

[graphic_graphic_utils_lite](https://gitee.com/openharmony/graphic_graphic_utils_lite/blob/master/README.md)