UI Development

• ArkUI Overview
• UI Development (ArkTS-based Declarative Development Paradigm)
  • UI Development (ArkTS-based Declarative Development Paradigm) Overview
  • Layout Development
    • Layout Overview
    • Building a Layout
      • Linear Layout (Row/Column)
      • Stack Layout (Stack)
      • Flex Layout (Flex)
      • Relative Layout (RelativeContainer)
      • Responsive Grid Layout (GridRow/GridCol)
      • Media Query (mediaquery)
      • Creating a List (List)
      • Creating a Grid (Grid/GridItem)
      • Creating a Swiper (Swiper)
  • Adding a Component
    • Adding a Common Component
      • Button
      • Radio Button (Radio)
      • Toggle
      • Progress Indicator (Progress)
      • Text Display (Text/Span)
      • Text Input (TextInput/TextArea)
      • Custom Dialog Box (CustomDialog)
      • Video Playback (Video
      • XComponent
    • Adding a Popup and Menu
      • Popup
      • Menu
  • Setting Page Routing and Component Navigation
    • Page Routing (router)
    • Component Navigation
      • Navigation
      • Tabs
  • Using Graphics
    • Displaying Images (Image)
    • Drawing Geometric Shapes (Shape)
    • Drawing Custom Graphics on the Canvas (Canvas)
  • Using Animation
    • Animation Overview
    • Property Animation
      • Property Animation Overview
      • Property Animation APIs
      • Custom Property Animation
    • Transition Animation
      • Transition Animation Overview
      • Enter/Exit Transition
      • Navigation Transition
      • Modal Transition
      • Shared Element Transition
      • Page Transition Animation (Not Recommended)
    • Component Animation
    • Animation Curve
      • Animation Curve Overview
      • Traditional Curve
      • Spring Curve
    • Animation Smoothing
    • Animation Effects
      • Blur Effect
      • Shadow Effect
      • Color Effect
  • Using Interaction Events
    • Interaction Event Overview
    • Universal Events
      • Touchscreen Event
      • Keyboard and Mouse Event
      • Focus Event
    • Gesture Events
      • Gesture Binding
      • Single Gesture
      • Combined Gestures
• UI Development (JavaScript-compatible Web-like Development Paradigm)
  • UI Development (JavaScript-compatible Web-like Development Paradigm) Overview
  • Framework Overview
    • File Organization
    • "js" Tag
    • app.js
    • Syntax
      • HML
      • CSS
      • JavaScript
    • Lifecycle
    • Resource Limitations and Access
    • Multi-Language Capability
  • Building the UI
    • Component Overview
    • Building the Layout
      • Layout Description
      • Adding Title and Paragraph Text
      • Adding an Image
      • Adding a Comment
      • Adding a Container
    • Adding Interactions
    • Developing Animations
    • Defining Gesture Events
    • Defining Page Routes
  • Common Component Development Guidelines
    • Container Component Development
      • List Development
      • Dialog Development
      • Form Development
      • Stepper Development
      • Tabs Development
      • Swiper Development
    • Basic Component Development
      • Text Development
      • Input Development
      • Button Development
      • Picker Development
      • Image Development
      • Image-animator Development
      • Rating Development
      • Slider Development
      • Chart Development
      • Switch Development
      • Toolbar Development
      • Menu Development
      • Marquee Development
      • Qrcode Development
      • Search Development
    • Canvas Development
      • Canvas
      • CanvasRenderingContext2D
      • Path2D
      • OffscreenCanvas
    • Grid Container Development
    • SVG Development
      • Basics
      • Graph Drawing
      • Path Drawing
      • Text Drawing
  • Animation Development Guidelines
    • CSS Animation
      • Defining Attribute Style Animations
      • Defining Animations with the transform Attribute
      • Defining Animations with the background-position Attribute
      • Defining Animations for SVG Components
    • JS Animation
      • Component Animation
      • Interpolator Animation
        • Animation Effect
        • Animation Frame
  • Custom Components