anyuianyui
Home
Getting Started
Documentation
Download
  • English
  • 简体中文
Home
Getting Started
Documentation
Download
  • English
  • 简体中文
  • Setup

    • Installation
  • Core Concepts

    • Introduction
    • Design
    • Hide and Lock
    • Resource Management
  • Higher Order Component

    • State Button
    • Label Slider
    • Value Slider
    • Check Group & Radio Group
    • StatusBar
    • NavigateBar
    • Drawer
  • Advanced Features

    • Use External Image File as Source
    • GIF Animated Image
    • Template Component
    • Global Components
    • Screen Management
    • Communication Commands and Events
    • Lottie Animation
  • Development

    • Build Mode
    • Build Toolchain Configuration
    • Code Transplant
  • Technical Support

    • FAQ

Component

Components serve as the fundamental building blocks of applications developed with anyui.

To effectively utilize anyui's capabilities, understanding the following component concepts is essential for UI design and implementation.

Basic Component

Basic Components are native UI elements provided directly by LVGL. As anyui is a graphic design tool that generates LVGL code, it inherits core LVGL concepts including properties, styles, and events.

Refer to LVGL Documentation for comprehensive information about native components.

Higher Order Component

Higher Order Components (HoCs) are composite components extended by anyui. Built upon Basic Components, HoCs encapsulate predefined behaviors and styling patterns. These components offer enhanced flexibility and significantly reduce development time when implementing complex user interfaces.

See Higher Order Component for implementation details and usage guidelines.

Template Component

Template Components are user-defined custom components. Users can persist modified properties and styles of existing components as reusable templates, enabling consistent UI elements across different sections of a project.

Refer to Template Component for detailed usage instructions.

Global Component

Global Components provide project-wide component sharing capabilities. Modifications to a Global Component's properties or styles automatically propagate to all instances of that component throughout the project.

A common use case is implementing a consistent Status Bar across multiple application views.

Action

Actions represent LVGL events triggered by user interactions, also referred to as User Events. Examples include button presses, slider adjustments, and touch gestures.

Actions can be configured to modify component properties dynamically. For instance, a button click can trigger a background color change for visual feedback.

Command

Commands are messages transmitted from the upper layers (Application/UI) to lower layers (SDK/Hardware). Typical command examples include Bluetooth connection requests, WiFi configuration, and time synchronization operations.

Command is extended by anyui for communication between upper layers and lower layers.

Refer to Command for comprehensive command documentation.

Event

Events are asynchronous notifications originating from lower layers (SDK/Hardware) directed to upper layers (Application/UI), also known as System Events. Common event types include battery level changes, sensor data updates, and network status notifications.

Event is extended by anyui for communication between upper layers and lower layers.

Refer to Event for comprehensive event documentation.

Next
Design