1# Graphics<a name="EN-US_TOPIC_0000001115588688"></a> 2 3- [1.1 Mini System](#section1346303311377) 4 - [Introduction](#section1165992615384) 5 - [Directory Structure](#section141331948134020) 6 - [Constraints](#section15729113104112) 7 - [Usage](#section812962919413) 8 - [Repositories Involved](#section12651205434115) 9 10- [1.2 Standard System](#section1249610812538) 11 - [Introduction](#section1374615251510) 12 - [Directory Structure](#section16751364713) 13 - [Constraints](#section126494189715) 14 - [Compilation and Building](#section883114292070) 15 - [Usage](#section1351214227564) 16 - [Repositories Involved](#section11578621131119) 17 18 19The Graphics subsystem mainly consists of user interface \(UI\) components, layout, animator, font, input event, window management, and rendering and drawing modules. It is an application framework that can be built on the LiteOS to develop OpenHarmony applications for Internet of Things \(IoT\) devices with limited hardware resources or on the standard OS to develop OpenHarmony applications for standard- and large-system devices \(for example, tablet and lite smart devices\). 20 21## 1.1 Mini System<a name="section1346303311377"></a> 22 23### Introduction<a name="section1165992615384"></a> 24 25The Graphics subsystem mainly consists of user interface \(UI\) components, layout, animator, font, input event, window management, and rendering and drawing modules. It is an application framework that can be built on the LiteOS to develop OpenHarmony applications for Internet of Things \(IoT\) devices with limited hardware resources. 26 27**Figure 1** Graphics subsystem architecture<a name="fig16488143010409"></a> 28 29 30The related modules are described as follows: 31 32- View: provides application components, including UIView, UIViewGoup, UIButton, UILabel, UILabelButton, UIList, and UISlider. 33- Animator: defines functions for customizing animators. 34- Layout: lays out components, including Flexlayout, GridLayout, and ListLayout. 35- Transform: rotates, translates, or scales images. 36- Event: processes basic events, including click, press, drag, and long press events. 37- Rendering engine: performs rendering and drawing operations. 38- 2D graphics library: draws 2D graphical elements including lines, rectangles, circles, arcs, images, and texts. Functions of this module include software drawing and hardware acceleration capability interconnection. 39- Multi-language: processes the line feed and shaping of texts in different languages. 40- Image library: parses and operates images of different types and formats, such as PNG, JPEG, ARGB8888, and ARGB565. 41- WindowManager: manages windows, including creating, showing, hiding a window, and combining windows. 42- InputManager: processes input events. 43 44### Directory Structure<a name="section141331948134020"></a> 45 46``` 47/foundation/graphic 48├── surface # Shared memory 49├── ui # UI module, including UI components, animations, and fonts. 50├── utils # Basic graphics library and hardware adaptation layer 51└── wms # Window and input event management 52``` 53 54### Constraints<a name="section15729113104112"></a> 55 56- The Graphics subsystem does not support multi-thread concurrent operations. You are advised to perform related operations in UI threads. 57- The **utils/interfaces/innerkits/graphic\_config.h** file provides the configuration information about macro switches that can be used to enable or disable graphics features. You need to configure these switches before compilation. Note that some switches are configured depending on the platform. 58 59### Usage<a name="section812962919413"></a> 60 61For details, see the README and **test** directory of each repository. 62 63### Repositories Involved<a name="section12651205434115"></a> 64 65**Graphics subsystem** 66 67graphic\_surface 68 69graphic\_ui 70 71graphic\_wms 72 73graphic\_utils 74 75## 1.2 Standard System<a name="section1249610812538"></a> 76 77### Introduction<a name="section1374615251510"></a> 78 79The Graphics subsystem provides graphics APIs and window management capabilities, which can be invoked by using Java or JS APIs. It is applicable to all devices that run the standard system. 80 81The following figure shows the architecture of the Graphics subsystem. 82 83 84 85- Surface 86 87 Provides APIs for managing the graphics buffer and the efficient and convenient rotation buffer. 88 89- Vsync 90 91 Provides APIs for managing registration and response of all vertical sync signals. 92 93- WindowManager 94 95 Provides APIs for creating and managing windows. 96 97- WaylandProtocols 98 99 Provides the communication protocols between the window manager and synthesizer. 100 101- Compositor 102 103 Implements synthesis of layers. 104 105- Renderer 106 107 Functions as the back-end rendering module of the synthesizer. 108 109- Wayland protocols 110 111 Provides Wayland inter-process communication protocols. 112 113- Shell 114 115 Provides multi-window capabilities. 116 117- Input Manger 118 119 Functions as the multimodal input module that receives input events. 120 121 122### Directory Structure<a name="section16751364713"></a> 123 124``` 125foundation/graphic/standard/ 126├── frameworks # Framework code 127│ ├── bootanimation # BootAnimation code 128│ ├── surface # Surface code 129│ ├── vsync # Vsync code 130│ └── wm # WindowManager code 131├── interfaces # External APIs 132│ ├── innerkits # Native APIs 133│ └── kits # JS APIs and NAPIs 134└── utils # Utilities 135``` 136 137### Constraints<a name="section126494189715"></a> 138 139Language version: C++ 11 or later 140 141### Compilation and Building<a name="section883114292070"></a> 142 143The dependent APIs include the following: 144 145- graphic\_standard:libwms\_client 146- graphic\_standard:libsurface 147- graphic\_standard:libvsync\_client 148 149### Usage<a name="section1351214227564"></a> 150 151For details, see the README and **test** directory of each repository. 152 153### Repositories Involved<a name="section11578621131119"></a> 154 155**Graphics subsystem** 156 157graphic\_standard 158 159ace\_ace\_engine 160 161aafwk\_standard 162 163multimedia\_media\_standard 164 165multimedia\_camera\_standard 166 167