• 中文
  • Version: 3.8
    • Version: 3.8
    • Version: 3.7
    • Version: 3.6
    • Version: 3.5
    • Version: 3.4
    • Version: 3.3
    • Version: 3.2
    • Version: 3.1
    • Version: 3.0
    • Version: 2.4
    • Version: 2.3
    • Version: 2.2
    • Version: 2.1
    • Version: 2.0
    • Version: 1.10
    • Version: 1.9
  • Cocos Creator
    • Manual
    • API Ref
  • Cocos2d-x
    • Manual
    • API Ref
  • Introduction
  • Introduction
  • About Cocos Creator
  • Support
  • Understanding the Basics
  • Getting Started
    • Installing and Launching
    • Dashboard
    • Hello World!
    • Project Structure
  • Editor Interfaces
    • Scene
    • Hierarchy
    • Assets
    • Inspector
    • Console
    • Preferences
    • Project Settings
    • Main Menu
    • Tool Bar
    • Editor Layout
    • Preview & Debugging
  • Glossary
  • Cocos Creator Quick Guide for Unity Developers
  • Tutorials
  • Quick Start: Making Your First 2D Game
    • Handle Touch Events
  • Quick Start: Make Your First 3D Game
    • Advanced: Add Light, Shadow and Skeleton Animation
  • Examples & Tutorials
  • Basic Workflow
  • Upgrade Guide
    • Cocos Creator 3.0 Upgrade Guide
    • Cocos Creator 3.0 Material Upgrade Guide
    • Cocos Creator 3.1 Material Upgrade Guide
    • Cocos Creator 3.5 Material Upgrade Guide
    • Cocos Creator 3.5 Native Built Project Upgrade Guide
    • Cocos Creator 3.6 Native Built Project Upgrade Guide
    • Cocos Creator 3.6.0 Build Template and settings.json Upgrade Guide
    • Upgrade Guide: Effect from v3.5.x to v3.6.0
    • Upgrade Guide: Particle from v3.5.x to v3.6.0
  • Scene Creation
    • Scene Assets
    • Nodes and Components
    • Coordinate Systems and Transformations
    • Node Hierarchy and Rendering Order
    • Build a Scene Image Using the Scene Panel
    • Level of Details
  • Assets
    • Asset Workflow
    • Images
      • Textures
      • Sprite Frames
        • Auto Trim for SpriteFrame
      • Texture Cube
      • Atlas
      • Auto Atlas
      • Label Atlas
    • Prefab
    • Fonts
    • Audio
    • Material
      • FBX Smart Material Conversion
    • Model
      • Importing Models Exported from DCC Tools
      • Export FBX file from 3ds Max
      • Export FBX file from Maya
      • glTF
      • Programmatically Create Meshes
    • Spine Skeletal Animation
    • DragonBones Skeletal Animation
    • TiledMap
  • Scripting Guide and Event System
    • Programming Language Support
    • Scripting Basics
      • Script Creation
      • Coding Environment Setup
      • Operating Environment
      • Decorator
      • Property Attributes
      • Life Cycle Callbacks
    • Using Scripts
      • Access Nodes and Components
      • Common Node and Component Interfaces
      • Create and Destroy Nodes
      • Scheduler
      • Components and Component Execution Order
      • Loading and Switching Scenes
      • Obtaining and Loading Assets
      • tsconfig Configuration
    • Advanced Scripting
    • Events
      • Listening to and Launching Events
      • Input Event System
      • Node Event System
      • Event API
    • Modules
      • Engine Modules
      • External Module Usage Case
      • Module Specification
      • Import Maps
    • Plugin Scripts
  • Cross-platform Publishing
    • Publishing Android Apps
      • Android Publishing Example
      • Build Options - Android
      • Android Development Environment Setup
      • Upgrading Android Project to v3.8
    • Publish to Google Play on PC
      • Build and Run
      • Integrating Input SDK
    • Publishing iOS Apps
      • iOS Publishing Example
      • Build Options - iOS
    • Publishing Huawei HarmonyOS Apps
    • Publishing macOS Desktop Application
      • macOS Publishing Example
      • Build Options - macOS
    • Publishing Windows Desktop Application
      • Windows Publishing Example
      • Build Options - Windows
    • Fundamentals for Publishing to Native Platforms
      • General Native Build Options
      • Setting up Native Development Environment
      • Debugging JavaScript on Native Platforms
      • Integrating Input SDK
    • Publish to Mini Game Platforms
      • Publish to HUAWEI AppGallery Connect
      • Publish to Alipay Mini Game
      • Publish to Taobao Mini Game
      • Publish to WeChat Mini Games
        • WeChat Mini Games Engine Plugin Instructions
        • Access to WeChat PC Mini Games
      • Publish to ByteDance Mini Games
      • Publish to Huawei Quick Games
      • Publish to OPPO Mini Games
      • Publish to vivo Mini Games
      • Publish to Xiaomi Quick Games
      • Publish to Baidu Mini Games
      • Access to Open Data Context
      • Mini Game Subpackage
      • Introduction to the Build Process and FAQ
    • Publish to Facebook Instant Games
    • Publish to Web Platforms
    • General Build Options
    • Publish from the Command Line
    • Custom Project Build Template
    • Build Process and FAQ
  • Function Modules
  • Graphics
    • Render Pipeline
      • Built-in Render Pipeline
      • Custom rendering of pipelines (experimental)
      • Full Screen Post Process
        • PostProcess Component
        • BlitScreen Component
        • Customize a Post Process
    • Camera
    • Lighting
      • Physically Based Lighting
      • Lights
        • Directional Lights
        • Spherical Lights
        • Spotlights
        • Ambient Light
      • Additive Per-Pixel Lights
      • Shadows
      • Imaged Based Lighting
        • Lightmapping
        • Light Probes
          • Light Probe Panel
        • Reflection Probe
          • Reflection Probe Panel
          • Reflection Probe Art Workflow
        • IBL Example
    • Meshes
      • MeshRenderer
      • SkinnedMeshRenderer
      • SkinnedMeshBatchRenderer
      • Importing Models Exported from DCC Tools
      • Export FBX file from 3ds Max
      • Export FBX file from Maya
      • glTF
      • Programmatically Create Meshes
      • Vertex Animation Texture (VAT)
    • Textures
      • Textures
      • Texture Cube
      • Texture Compression
      • RenderTexture
    • Material System Overview
      • Programmatic Use of Materials
      • Builtin Materials
      • Material System Classes Diagram
    • Shader Overview
      • Create and Use Shader
      • Built-in Shaders
        • Physically Based Rendering - PBR
        • Toon Shading
        • Unlit Shading
      • Syntax
        • Optional Pass Parameters
        • YAML 101
        • GLSL
        • Preprocessor Macro Definition
        • Chunk
      • Built-in Uniforms
      • Common Functions
      • Render Flow of Forward Rendering and Deferred Shading
      • Surface Shader
        • Guide to Built-in Surface Shader
        • Surface Shader Overview
        • Surface Shader Execution Flow
        • Include
        • Macro Remapping
        • Function Replacement Using Macros
        • Surface Shader Built-in Replaceable Functions
        • Render Usages
        • Lighting Models
        • Surface Material Data Structure
        • Shader Stages
        • Shader Assembly
        • VS Inputs
        • FS Inputs
        • Customize Surface Shader
        • Rendering Debug View
      • Legacy Shader
        • Guide to Built-in Legacy Shaders
        • Legacy Shader Key Functions and Structures
      • Write Shaders
        • 2D Sprite Shader: Gradient
        • 3D Shader: RimLight
      • Skin material
      • Instanced Attributes
      • UBO Layout
      • Fallback to WebGL 1.0
      • VSCode Extension - Cocos Effect
      • Compute Shader
    • Sorting
    • Effects
      • Billboard
      • Line
    • Skybox
    • Global Fog
    • Geometry Renderer
  • 2D Objects
    • 2D Render
      • Rendering Order
      • 2D Renderable Component Batching Rules
      • Custom Materials for 2D Rendering Objects
      • 2D Renderable Components
        • Sprite Component Reference
        • Label Component Reference
        • Mask Component Reference
        • Graphics Component Reference
        • RichText Component Reference
        • UIStaticBatch Component Reference
        • Spine Skeleton Component Reference
        • DragonBones ArmatureDisplay Component Reference
        • TiledMap Component Reference
        • TiledTile Component Reference
        • MotionStreak Component Reference
    • UI System
      • UI Components
        • Canvas Component Reference
        • UITransform Component Reference
        • Widget Component Reference
        • Button Component Reference
        • Layout Component Reference
        • EditBox Component Reference
        • ScrollView Component Reference
        • ScrollBar Component Reference
        • ProgressBar Component Reference
        • LabelOutline Component Reference
        • LabelShadow Component Reference
        • Toggle Component Reference
        • ToggleContainer Component Reference
        • Slider Component Reference
        • PageView Component Reference
        • PageViewIndicator Component Reference
        • UIMeshRenderer Component Reference
        • UICoordinateTracker Component Reference
        • UIOpacity Component Reference
        • BlockInputEvents Component Reference
        • WebView Component Reference
        • VideoPlayer Component Reference
        • SafeArea Component Reference
      • UI Practice Guide
        • Multi-Resolution Adaption
        • Widget Alignment
        • Label Layout
        • Auto Layout Container
        • Create a List of Dynamically Generated Content
        • Stretchable UI Sprite
        • Android Large Screen Adaptation
  • Animation
    • Animation Clip
    • Animation Component Reference
    • Animation Panel
      • Creating Animation Components and Animation Clips
      • Get Familiar with the Animation Panel
      • Editing Animation Clips
      • Editing Animation Easing Curve
      • Adding Animation Events
      • Using Animation Curves
      • Curve Editor
    • Skeletal Animation
      • Joint Texture Layout Settings
    • Controlling Animation with Scripts
      • Animation State
    • Embedded Player
    • Marionette Animation System
      • Animation Graph Assets
      • Animation Controller Reference
      • Animation Graph Panel
      • Animation Graph Layer
      • Animation State Machine
      • State Transition
      • Animation Mask
      • Animation Graph Variants
      • Procedural Animation
        • Introduction to Procedural Animation
          • Enable Procedural Animation
        • Pose Graph
          • Pose Graph View
          • Pose Nodes
          • Blend Pose
          • Modify Poses
          • Play or Sample Animation
  • Audio System
    • AudioSource Component Reference
    • AudioMgr Example
    • Compatibility Notes
  • Physics System
    • Physics 2D
      • 2D Physics Manager
      • 2D RigidBody
      • 2D Physics Collider
      • 2D Contact Callback
      • 2D Physics Joint
    • Physics 3D
      • Physics Engines
      • Physics System Configuration
      • Group and Mask
      • Physics Components
        • Collider
        • Rigidbody
        • Constant Force
        • Constraint
      • Physics Material
      • Physics Event
      • Raycast Detection
      • Geometry Cast Detection
      • Continuous Collision Detection
      • Character Controller
      • Physics Application Cases
  • Particle System
    • 2D Particle System
    • 3D Particle System
      • Particle System Module
        • Main Module
        • Shape Module
        • Velocity Overtime Module
        • Force Overtime Module
        • Size Overtime Module
        • Rotation Overtime Module
        • Color Over Life Time Module
        • Texture Animation Module
        • Limit Velocity Overtime Module
        • Trail Module
        • Renderer Module
      • Particle Properties Editor
        • Curve Editor
        • Gradient Editor
        • Particle Editor
  • Tween System
    • Tween Interface
    • Tween Function
    • Tween Examples
  • Terrain System
  • Asset Manager
    • AssetManager Upgrade Guide
    • Asset Bundle Upgrade Guide
    • Asset Loading
    • Asset Bundle
    • Release Of Assets
    • Download and Parse
    • Loading and Preloading
    • Cache Manager
    • Optional Parameters
    • Pipeline and Task
    • Resource Management Considerations --- meta files
  • Localization
    • Translation Service Provider
    • Collect and Count
    • Compile Language
    • L10nLabel
    • Sample
  • XR
    • Version History
    • Architecture
      • Built-in Resources and Prefabs
      • XR Components
      • XR Preview
      • XR Video Player
      • XR Preview in Browser
      • XR Spatial Audio
      • XR Composition Layer
      • Passthrough
      • AR
        • AR Camera
        • AR Manager
        • AR Automated Behavior Editing
        • AR Interaction
    • Quick Start
      • VR Project Creation
      • VR Building and Publishing
      • AR Project Creation
      • AR Building and Publishing
      • WebXR Project Setup
      • WebXR Building and Publishing
  • Native Development
    • Native Platform Secondary Development Guide
    • JavaScript and Android Communication with Reflection
    • JavaScript and iOS/macOS Communication with Reflection
    • JavaScript and Java Communication using JsbBridge
    • JavaScript and Objective-C Communication using JsbBridge
    • JsbBridgeWrapper - An Event Mechanism based on JsbBridge
    • Tutorial: JSB 2.0
      • JSB Manual Binding
      • JSB Auto Binding
      • Swig
      • Swig Tutorial
    • CMake Usage Introduction
    • Native Engine Memory Leak Detection System
    • Native Scene Culling
    • Native Profiler
    • Native Plugins
      • Cocos Native Plugin Quick Tutorial
    • Optimization of Cross-Language Invocation
  • Advanced Tutorials
  • Editor Extension
    • Extension Manager
    • Extension Templates and Compile Builds
    • Getting Started Example - Menu
    • Getting Started Example - Panel
    • Getting Started Example - First Data Interaction
    • Change the Name of a Extension
    • Install and Share
    • Submitting Resources to Cocos Store
    • Extend Existing Functionality
      • Customize the Main Menu
      • Customized Messages
      • Calling the Engine API and Project Script
      • Extending the Assets Panel
      • Custom Asset Database
      • Custom Inspector Panel
      • Extending Build Process
      • Extending Project Settings Panel
      • Extending the Preferences Panels
      • Extending Shortcut
    • Extension Details
      • Extension Infrastructure
      • Definition of Extension
      • Message System
      • Configuration System
      • Extension Panel
      • UI Components
  • Advanced Topics
    • Submit Code to Cocos Engine Repository
    • User Data Storage
    • Engine Customization Workflow
    • Web Preview Customization Workflow
    • Dynamic Atlas
    • Hot Update Tutorial
    • AssetManager for Hot Update
    • HTTP Request
    • WebSocket Introduction
      • WebSocket Client
      • WebSocket Server
  • Published with GitBook
  • 中文
  • Cocos Creator
    • Manual
    • API Ref
  • Cocos2d-x
    • Manual
    • API Ref
  • Cocos Creator 3.8
    Version: 3.8
    • Version: 3.8
    • Version: 3.7
    • Version: 3.6
    • Version: 3.5
    • Version: 3.4
    • Version: 3.3
    • Version: 3.2
    • Version: 3.1
    • Version: 3.0
    • Version: 2.4
    • Version: 2.3
    • Version: 2.2
    • Version: 2.1
    • Version: 2.0
    • Version: 1.10
    • Version: 1.9

UI Practice Guide

UI Practice Guide

  • Multi-Resolution Adaptation Scheme
  • Alignment Strategy
  • Label Layout
  • Auto Layout Container
  • Create a List of Dynamically Generated Content
  • Use a Sliced Sprite to make a UI image

results matching ""

    No results matching ""

    Prev: SafeArea Component Reference Next: Multi-Resolution Adaption