1# ArkUI
2- [Introduction to ArkUI](arkui-overview.md)
3- UI Development (ArkTS-based Declarative Development Paradigm)
4  - [UI Development (ArkTS-based Declarative Development Paradigm) Overview](arkts-ui-development-overview.md)
5  - Layout Development
6    - [Layout Overview](arkts-layout-development-overview.md)
7    - Building a Layout
8      - [Linear Layout (Row/Column)](arkts-layout-development-linear.md)
9      - [Stack Layout (Stack)](arkts-layout-development-stack-layout.md)
10      - [Flex Layout (Flex)](arkts-layout-development-flex-layout.md)
11      - [Relative Layout (RelativeContainer)](arkts-layout-development-relative-layout.md)
12      - [Responsive Grid Layout (GridRow/GridCol)](arkts-layout-development-grid-layout.md)
13      - [Media Query (@ohos.mediaquery)](arkts-layout-development-media-query.md)
14      - [Creating a List (List)](arkts-layout-development-create-list.md)
15      - [Creating a Grid (Grid/GridItem)](arkts-layout-development-create-grid.md)
16      - [Creating a Swiper (Swiper)](arkts-layout-development-create-looping.md)
17      - [Using Tabs (Tabs)](arkts-navigation-tabs.md)
18  - Adding a Component
19    - [Button](arkts-common-components-button.md)
20    - [Radio Button (Radio)](arkts-common-components-radio-button.md)
21    - [Toggle](arkts-common-components-switch.md)
22    - [Progress Indicator (Progress)](arkts-common-components-progress-indicator.md)
23    - [Image Display (Image)](arkts-graphics-display.md)
24    - [Video Playback (Video)](arkts-common-components-video-player.md)
25    - [Custom Rendering (XComponent)](napi-xcomponent-guidelines.md)
26  - Setting Component Navigation and Page Routing
27    - [Component Navigation and Page Routing Overview](arkts-navigation-introduction.md)
28    - [Component Navigation (Navigation) (Recommended)](arkts-navigation-navigation.md)
29    - [Navigation Transition](arkts-navigation-transition.md)
30    - [Page Routing (@ohos.router) (Not Recommended)](arkts-routing.md)
31    - [Transition from Router to Navigation](arkts-router-to-navigation.md)
32  - Using Text
33    - [Introduction to Text](arkts-text-introduction.md)
34    - [Text Display (Text/Span)](arkts-common-components-text-display.md)
35    - [Text Input (TextInput/TextArea)](arkts-common-components-text-input.md)
36    - [Rich Text (RichEditor)](arkts-common-components-richeditor.md)
37    - [Symbol Glyph (SymbolGlyph/SymbolSpan)](arkts-common-components-symbol.md)
38    - [Styled String (StyledString/MutableStyledString)](arkts-styled-string.md)
39  - Using Popup Windows
40     - [Popup Window Overview](arkts-dialog-overview.md)
41     - Using Dialog Boxes (Dialog)
42       - [Dialog Box Overview](arkts-base-dialog-overview.md)
43       - [Global Custom Dialog Box Independent of UI Components (openCustomDialog) (Recommended)](arkts-uicontext-custom-dialog.md)
44       - [Basic Custom Dialog Box (CustomDialog) (Not Recommended)](arkts-common-components-custom-dialog.md)
45       - [Fixed Style Dialog Box](arkts-fixes-style-dialog.md)
46     - [Menu Control (Menu)](arkts-popup-and-menu-components-menu.md)
47     - [Popup](arkts-popup-and-menu-components-popup.md)
48     - Binding a Modal Page
49        - [Modal Page Overview](arkts-modal-overview.md)
50        - [Binding a Semi-Modal Page (bindSheet)](arkts-sheet-page.md)
51        - [Binding a Full-Modal Page (bindContentCover)](arkts-contentcover-page.md)
52     - [Using Toasts (Toast)](arkts-create-toast.md)
53     - [Managing Overlays (OverlayManager)](arkts-create-overlaymanager.md)
54  - Using Graphics
55    - [Drawing Geometric Shapes (Shape)](arkts-geometric-shape-drawing.md)
56    - [Drawing Custom Graphics on the Canvas (Canvas)](arkts-drawing-customization-on-canvas.md)
57  - Using Animation
58    - [Animation Overview](arkts-animation.md)
59    - Property Animation
60      - [Property Animation Overview](arkts-attribute-animation-overview.md)
61      - [Implementing Property Animation](arkts-attribute-animation-apis.md)
62      - [Custom Property Animation](arkts-custom-attribute-animation.md)
63    - Transition Animation
64      - [Transition Animation Overview](arkts-transition-overview.md)
65      - [Enter/Exit Transition](arkts-enter-exit-transition.md)
66      - [Modal Transition](arkts-modal-transition.md)
67      - [Shared Element Transition](arkts-shared-element-transition.md)
68      - [Rotation Transition Animation](arkts-rotation-transition-animation.md)
69      - [Page Transition Animation (Not Recommended)](arkts-page-transition-animation.md)
70    - [Particle Animation](arkts-particle-animation.md)
71    - [Component Animation](arkts-component-animation.md)
72    - Animation Curve
73      - [Animation Curve Overview](arkts-curve-overview.md)
74      - [Traditional Curve](arkts-traditional-curve.md)
75      - [Spring Curve](arkts-spring-curve.md)
76    - [Animation Smoothing](arkts-animation-smoothing.md)
77    - Animation Effects
78      - [Blur Effect](arkts-blur-effect.md)
79      - [Shadow Effect](arkts-shadow-effect.md)
80      - [Color Effect](arkts-color-effect.md)
81    - [Frame Animation (ohos.animator)](arkts-animator.md)
82  - Using Interaction Events
83    - [Interaction Event Overview](arkts-event-overview.md)
84    - Universal Events
85      - [Event Distribution](arkts-common-events-distribute.md)
86      - [Touchscreen Event](arkts-common-events-touch-screen-event.md)
87      - [Keyboard and Mouse Event](arkts-common-events-device-input-event.md)
88      - [Focus Event](arkts-common-events-focus-event.md)
89      - [Drag Event](arkts-common-events-drag-event.md)
90    - Gesture Events
91      - [Gesture Binding](arkts-gesture-events-binding.md)
92      - [Single Gesture](arkts-gesture-events-single-gesture.md)
93      - [Combined Gestures](arkts-gesture-events-combined-gestures.md)
94      - [Multi-level Gesture Events](arkts-gesture-events-multi-level-gesture.md)
95      - [Gesture Judgment](arkts-gesture-events-gesture-judge.md)
96  - Using Customization Capabilities
97    - [Customization Capability Overview](arkts-user-defined.md)
98    - Custom Nodes
99      - [Custom Node Overview](arkts-user-defined-node.md)
100      - [Custom Placeholder Nodes](arkts-user-defined-place-hoder.md)
101      - [Custom Component Node (FrameNode)](arkts-user-defined-arktsNode-frameNode.md)
102      - [Custom RenderNode (RenderNode)](arkts-user-defined-arktsNode-renderNode.md)
103      - [Custom Declarative Node (BuilderNode)](arkts-user-defined-arktsNode-builderNode.md)
104    - Custom Extension
105      - [Custom Extension Capability Overview](arkts-user-defined-modifier.md)
106      - [Attribute Modifier (AttributeModifier)](arkts-user-defined-extension-attributeModifier.md)
107      - [Attribute Updater (AttributeUpdater)](arkts-user-defined-extension-attributeUpdater.md)
108  - [Using the Mirroring Capability](arkts-mirroring-display.md)
109  - [Supporting Aging-Friendly Design](arkui-support-for-aging-adaptation.md)
110  - Setting the Theme
111    - [Configuring In-Application Theme Skinning](theme_skinning.md)
112  - [Using the UI Context API for UI Operations (UIContext)](arkts-global-interface.md)
113  - Launching Pages Across Processes
114    - [Atomic Service Full Screen Launch Component (FullScreenLaunchComponent)](arkts-FullScreenComponent.md)
115    <!--Del-->
116    - [Cross-Process Application Capability Extension (UIExtension, for System Applications Only)](arkts-ui-extension-components.md)
117    <!--DelEnd-->
118  - Using NDK APIs to Build UIs
119    - [NDK API Overview](ndk-build-ui-overview.md)
120    - [Integrating with ArkTS Pages](ndk-access-the-arkts-page.md)
121    - Adding Interaction Events
122      - [Listening for Component Events](ndk-listen-to-component-events.md)
123      - [Binding Gesture Events](ndk-bind-gesture-events.md)
124    - [Using Animations](ndk-use-animation.md)
125    - [Developing a Long List with Lazy Loading](ndk-loading-long-list.md)
126    - [Building Dialog Boxes](ndk-build-pop-up-window.md)
127    - [Building Custom Components](ndk-build-custom-components.md)
128    - [Embedding ArkTS Components](ndk-embed-arkts-components.md)
129    - [Integrating Accessibility Through XComponent](ndk-accessibility-xcomponent.md)
130- UI Development with JavaScript-compatible Web-like Development Paradigm
131  - [UI Development (JavaScript-compatible Web-like Development Paradigm) Overview](ui-js-overview.md)
132  - Framework Overview
133    - [File Organization](js-framework-file.md)
134    - ["js" Tag](js-framework-js-tag.md)
135    - [app.js](js-framework-js-file.md)
136    - Syntax
137      - [HML](js-framework-syntax-hml.md)
138      - [CSS](js-framework-syntax-css.md)
139      - [JavaScript](js-framework-syntax-js.md)
140    - [Lifecycle](js-framework-lifecycle.md)
141    - [Resource Limitations and Access](js-framework-resource-restriction.md)
142    - [Multi-Language Capability](js-framework-multiple-languages.md)
143  - Building the UI
144    - [Component Overview](ui-js-building-ui-component.md)
145    - Building a Layout
146      - [Layout Description](ui-js-building-ui-layout-intro.md)
147      - [Adding Title and Paragraph Text](ui-js-building-ui-layout-text.md)
148      - [Adding an Image](ui-js-building-ui-layout-image.md)
149      - [Adding a Comment](ui-js-building-ui-layout-comment.md)
150      - [Adding a Container](ui-js-building-ui-layout-external-container.md)
151    - [Adding Interactions](ui-js-building-ui-interactions.md)
152    - [Developing Animations](ui-js-building-ui-animation.md)
153    - [Defining Gesture Events](ui-js-building-ui-event.md)
154    - [Defining Page Routes](ui-js-building-ui-routes.md)
155  - Common Component Development
156    - Container Component Development
157      - [List Development](ui-js-components-list.md)
158      - [Dialog Development](ui-js-components-dialog.md)
159      - [Form Development](ui-js-components-form.md)
160      - [Stepper Development](ui-js-components-stepper.md)
161      - [Tabs Development](ui-js-component-tabs.md)
162      - [Swiper Development](ui-js-components-swiper.md)
163    - Basic Component Development
164      - [Text Development](ui-js-components-text.md)
165      - [Input Development](ui-js-components-input.md)
166      - [Button Development](ui-js-components-button.md)
167      - [Picker Development](ui-js-components-picker.md)
168      - [Image Development](ui-js-components-images.md)
169      - [Image-animator Development](ui-js-components-image-animator.md)
170      - [Rating Development](ui-js-components-rating.md)
171      - [Slider Development](ui-js-components-slider.md)
172      - [Chart Development](ui-js-components-chart.md)
173      - [Switch Development](ui-js-components-switch.md)
174      - [Toolbar Development](ui-js-components-toolbar.md)
175      - [Menu Development](ui-js-components-menu.md)
176      - [Marquee Development](ui-js-components-marquee.md)
177      - [Qrcode Development](ui-js-components-qrcode.md)
178      - [Search Development](ui-js-components-search.md)
179    - Canvas Development
180      - [Canvas](ui-js-components-canvas.md)
181      - [CanvasRenderingContext2D](ui-js-components-canvasrenderingcontext2d.md)
182      - [Path2D](ui-js-components-path2d.md)
183      - [OffscreenCanvasRenderingContext2D](ui-js-components-offscreencanvas.md)
184    - [Grid Container Development](ui-js-components-grid.md)
185    - SVG Development
186      - [Basics](ui-js-components-svg-overview.md)
187      - [Graph Drawing](ui-js-components-svg-graphics.md)
188      - [Path Drawing](ui-js-components-svg-path.md)
189      - [Text Drawing](ui-js-components-svg-text.md)
190  - Animation Development
191    - CSS Animation
192      - [Attribute Style Animation](ui-js-animate-attribute-style.md)
193      - [Animation with the transform Attribute](ui-js-animate-transform.md)
194      - [Animation with the background-position Attribute](ui-js-animate-background-position-style.md)
195      - [Animation for SVG Components](ui-js-animate-svg.md)
196    - JavaScript Animation
197      - [Component Animation](ui-js-animate-component.md)
198      - Interpolator Animation
199        - [Animation Effect](ui-js-animate-dynamic-effects.md)
200        - [Animation Frame](ui-js-animate-frame.md)
201  - [Custom Components](ui-js-custom-components.md)
202  - [WebGL](../webgl/Readme-EN.md)
203- [Window Manager](../windowmanager/Readme-EN.md)
204- [Display Management](../displaymanager/Readme-EN.md)
205