1# UI Development 2 3- [ArkUI Overview](arkui-overview.md) 4- UI Development (ArkTS-based Declarative Development Paradigm) 5 - [UI Development (ArkTS-based Declarative Development Paradigm) Overview](arkts-ui-development-overview.md) 6 - Layout Development 7 - [Layout Overview](arkts-layout-development-overview.md) 8 - Building a Layout 9 - [Linear Layout](arkts-layout-development-linear.md) 10 - [Stack Layout](arkts-layout-development-stack-layout.md) 11 - [Flex Layout](arkts-layout-development-flex-layout.md) 12 - [Relative Layout](arkts-layout-development-relative-layout.md) 13 - [Responsive Grid Layout](arkts-layout-development-grid-layout.md) 14 - [Media Query](arkts-layout-development-media-query.md) 15 - [Creating a List](arkts-layout-development-create-list.md) 16 - [Creating a Grid](arkts-layout-development-create-grid.md) 17 - [Creating a Swiper](arkts-layout-development-create-looping.md) 18 - [Improving Layout Performance](arkts-layout-development-performance-boost.md) 19 - Adding a Component 20 - Adding a Common Component 21 - [Button](arkts-common-components-button.md) 22 - [Radio Button](arkts-common-components-radio-button.md) 23 - [Toggle](arkts-common-components-switch.md) 24 - [Progress Indicator](arkts-common-components-progress-indicator.md) 25 - [Text Display](arkts-common-components-text-display.md) 26 - [Text Input](arkts-common-components-text-input.md) 27 - [Custom Dialog Box](arkts-common-components-custom-dialog.md) 28 - [Video Playback](arkts-common-components-video-player.md) 29 - [XComponent](arkts-common-components-xcomponent.md) 30 - Adding a Bubble and Menu 31 - [Bubble](arkts-popup-and-menu-components-popup.md) 32 - [Menu](arkts-popup-and-menu-components-menu.md) 33 - Setting Page Routing and Component Navigation 34 - [Page Routing](arkts-routing.md) 35 - Component Navigation 36 - [Navigation](arkts-navigation-navigation.md) 37 - [Tabs](arkts-navigation-tabs.md) 38 - Using Graphics 39 - [Displaying Images](arkts-graphics-display.md) 40 - [Drawing Geometric Shapes](arkts-geometric-shape-drawing.md) 41 - [Drawing Custom Graphics on the Canvas](arkts-drawing-customization-on-canvas.md) 42 - Using Animation 43 - [Animation Overview](arkts-animation-overview.md) 44 - Animation Within a Page 45 - [Layout Update Animation](arkts-layout-update-animation.md) 46 - [Transition Animation Within a Component](arkts-transition-animation-within-component.md) 47 - [Spring Curve Animation](arkts-spring-animation.md) 48 - Animation Between Pages 49 - [Zoom Animation](arkts-zoom-animation.md) 50 - [Page Transition Animation](arkts-page-transition-animation.md) 51 - Using Interaction Events 52 - [Interaction Event Overview](arkts-event-overview.md) 53 - Universal Events 54 - [Touchscreen Event](arkts-common-events-touch-screen-event.md) 55 - [Keyboard and Mouse Event](arkts-common-events-device-input-event.md) 56 - [Focus Event](arkts-common-events-focus-event.md) 57 - Gesture Events 58 - [Gesture Binding](arkts-gesture-events-binding.md) 59 - [Single Gesture](arkts-gesture-events-single-gesture.md) 60 - [Combined Gestures](arkts-gesture-events-combined-gestures.md) 61 - [Recommendations for Improving Performance](arkts-performance-improvement-recommendation.md) 62- UI Development (JavaScript-compatible Web-like Development Paradigm) 63 - [UI Development (JavaScript-compatible Web-like Development Paradigm) Overview](ui-js-overview.md) 64 - Framework Overview 65 - [File Organization](js-framework-file.md) 66 - ["js" Tag](js-framework-js-tag.md) 67 - [app.js](js-framework-js-file.md) 68 - Syntax 69 - [HML](js-framework-syntax-hml.md) 70 - [CSS](js-framework-syntax-css.md) 71 - [JavaScript](js-framework-syntax-js.md) 72 - [Lifecycle](js-framework-lifecycle.md) 73 - [Resource Limitations and Access](js-framework-resource-restriction.md) 74 - [Multi-Language Capability](js-framework-multiple-languages.md) 75 - Building the UI 76 - [Component Overview](ui-js-building-ui-component.md) 77 - Building the Layout 78 - [Layout Description](ui-js-building-ui-layout-intro.md) 79 - [Adding Title and Paragraph Text](ui-js-building-ui-layout-text.md) 80 - [Adding an Image](ui-js-building-ui-layout-image.md) 81 - [Adding a Comment](ui-js-building-ui-layout-comment.md) 82 - [Adding a Container](ui-js-building-ui-layout-external-container.md) 83 - [Adding Interactions](ui-js-building-ui-interactions.md) 84 - [Developing Animations](ui-js-building-ui-animation.md) 85 - [Defining Gesture Events](ui-js-building-ui-event.md) 86 - [Defining Page Routes](ui-js-building-ui-routes.md) 87 - Common Component Development Guidelines 88 - Container Component Development 89 - [List Development](ui-js-components-list.md) 90 - [Dialog Development](ui-js-components-dialog.md) 91 - [Form Development](ui-js-components-form.md) 92 - [Stepper Development](ui-js-components-stepper.md) 93 - [Tabs Development](ui-js-component-tabs.md) 94 - [Swiper Development](ui-js-components-swiper.md) 95 - Basic Component Development 96 - [Text Development](ui-js-components-text.md) 97 - [Input Development](ui-js-components-input.md) 98 - [Button Development](ui-js-components-button.md) 99 - [Picker Development](ui-js-components-picker.md) 100 - [Image Development](ui-js-components-images.md) 101 - [Image-animator Development](ui-js-components-image-animator.md) 102 - [Rating Development](ui-js-components-rating.md) 103 - [Slider Development](ui-js-components-slider.md) 104 - [Chart Development](ui-js-components-chart.md) 105 - [Switch Development](ui-js-components-switch.md) 106 - [Toolbar Development](ui-js-components-toolbar.md) 107 - [Menu Development](ui-js-components-menu.md) 108 - [Marquee Development](ui-js-components-marquee.md) 109 - [Qrcode Development](ui-js-components-qrcode.md) 110 - [Search Development](ui-js-components-search.md) 111 - Canvas Development 112 - [Canvas](ui-js-components-canvas.md) 113 - [CanvasRenderingContext2D](ui-js-components-canvasrenderingcontext2d.md) 114 - [Path2D](ui-js-components-path2d.md) 115 - [OffscreenCanvas](ui-js-components-offscreencanvas.md) 116 - [Grid Container Development](ui-js-components-grid.md) 117 - SVG Development 118 - [Basics](ui-js-components-svg-overview.md) 119 - [Graph Drawing](ui-js-components-svg-graphics.md) 120 - [Path Drawing](ui-js-components-svg-path.md) 121 - [Text Drawing](ui-js-components-svg-text.md) 122 - Animation Development Guidelines 123 - CSS Animation 124 - [Defining Attribute Style Animations](ui-js-animate-attribute-style.md) 125 - [Defining Animations with the transform Attribute](ui-js-animate-transform.md) 126 - [Defining Animations with the background-position Attribute](ui-js-animate-background-position-style.md) 127 - [Defining Animations for SVG Components](ui-js-animate-svg.md) 128 - JS Animation 129 - [Component Animation](ui-js-animate-component.md) 130 - Interpolator Animation 131 - [Animation Effect](ui-js-animate-dynamic-effects.md) 132 - [Animation Frame](ui-js-animate-frame.md) 133 - [Custom Components](ui-js-custom-components.md) 134