Google uses cookies to deliver its services, to personalize ads, and to analyze traffic. You can adjust your privacy controls anytime in your Google settings. Learn more.

Flutter logo
    • Get started
      • 1. Install
      • 2. Set up an editor
      • 3. Test drive
      • 4. Write your first app
      • 5. Learn more
      • From another platform?
        • Flutter for Android devs
        • Flutter for SwiftUI devs
        • Flutter for UIKit devs
        • Flutter for React Native devs
        • Flutter for web devs
        • Flutter for Xamarin.Forms devs
        • Introduction to declarative UI
      • Dart language overview open_in_new
    • Stay up to date
      • Upgrade
      • SDK archive
      • What's new
      • Release notes
      • Breaking changes
    • Samples & tutorials
      • Flutter Gallery [running app] open_in_new
      • Flutter Gallery [repo] open_in_new
      • Sample apps on GitHub open_in_new
      • Cookbook
      • Codelabs
      • Tutorials
    • User interface
      • Introduction to widgets
      • Building layouts
        • Layouts in Flutter
        • Tutorial
        • Creating adaptive and responsive apps
        • Building adaptive apps
        • Understanding constraints
        • Box constraints
      • Adding interactivity
      • Assets and images
      • Material Design
      • Navigation & routing
        • Navigation in Flutter
        • Deep linking
        • URL strategies
      • Animations
        • Introduction
        • Overview
        • Tutorial
        • Implicit animations
        • Hero animations
        • Staggered animations
      • Advanced UI
        • Actions & shortcuts
        • Fonts & typography
        • Keyboard focus system
        • Gestures
        • Shaders
        • Slivers
      • Widget catalog
    • Data & backend
      • State management
        • Introduction
        • Think declaratively
        • Ephemeral vs app state
        • Simple app state management
        • Options
      • Networking & http
      • JSON and serialization
      • Firebase
      • Google APIs
    • Accessibility & localization
      • Accessibility
      • Internationalization
    • Platform integration
      • Supported platforms
      • Building desktop apps with Flutter
      • Writing platform-specific code
      • Android
        • Adding a splash screen
        • C interop
        • Hosting native Android views
        • Restore state on Android
        • Targeting ChromeOS with Android
      • iOS
        • Leveraging Apple's system libraries
        • Adding a splash screen
        • Adding iOS App Clip support
        • Adding iOS app extensions
        • C interop
        • Hosting native iOS views
        • iOS debugging
        • Restore state on iOS
      • Linux
        • Building Linux apps
      • macOS
        • Building macOS apps
        • C interop
      • Web
        • Building web apps
        • Web FAQ
        • Web renderers
        • Custom app initialization
        • Displaying images on the web
      • Windows
        • Building Windows apps
        • Run loop migration
        • Version information migration
        • Dark mode migration
    • Packages & plugins
      • Background processes
      • Developing packages & plugins
      • Flutter Favorites program
      • Happy paths project
      • Happy paths recommendations
      • Plugins in Flutter tests
      • Using packages
      • Package site open_in_new
    • Tools & features
      • Android Studio & IntelliJ
      • Visual Studio Code
      • DevTools
        • Overview
        • Install from Android Studio & IntelliJ
        • Install from VS Code
        • Install from command line
        • Flutter inspector
        • Performance view
        • CPU Profiler view
        • Memory view
        • Debug console view
        • Network view
        • Debugger
        • Logging view
        • App size tool
        • Release notes
      • SDK overview
      • Flutter and the pubspec file
      • Hot reload
      • Flutter Fix
      • Code formatting
    • Testing & debugging
      • Debugging tools
      • Testing plugins
      • Debugging apps programmatically
      • Using an OEM debugger
      • Flutter's build modes
      • Common Flutter errors
      • Handling errors
      • Testing
      • Integration testing
    • Performance & optimization
      • Overview
      • Impeller **NEW**
      • Performance best practices
      • App size
      • Deferred components
      • Rendering performance
      • Performance profiling
      • Shader compilation jank
      • Performance metrics
      • Performance FAQ
      • Appendix
    • Deployment
      • Obfuscating Dart code
      • Creating flavors for Flutter
      • Build and release an Android app
      • Build and release an iOS app
      • Build and release a macOS app
      • Build and release a Linux app
      • Build and release a Windows app
      • Build and release a web app
      • Continuous deployment
    • Add to an existing app
      • Introduction
      • Adding to an Android app
        • Project setup
        • Add a single Flutter screen
        • Add a Flutter Fragment
        • Add a Flutter View
        • Plugin setup
      • Adding to an iOS app
        • Project setup
        • Add a single Flutter screen
      • Debugging & hot reload
      • Loading sequence and performance
      • Multiple Flutter instances
    • Resources
      • Architectural overview
      • Books
      • Compatibility policy
      • Contributing to Flutter open_in_new
      • Creating useful bug reports
      • Dart resources
      • Design documents
      • FAQ
      • Casual Games Toolkit
      • Google Fonts package open_in_new
      • Inside Flutter
      • Flutter vs. Swift Concurrency
      • Official brand assets open_in_new
      • Platform adaptations
      • Videos and online courses
    • Reference
      • Who is Dash?
      • Widget index
      • API reference open_in_new
      • flutter CLI reference
      • Security false positives
      • Package site open_in_new
  • Multi-Platform
    Mobile Web Desktop Embedded
  • Development
    Learn Flutter Favorites Packages
  • Ecosystem
    Community Events Monetization
  • Showcase
  • Docs
    What's new Editor support Hot reload Profiling Install Flutter DevTools Cookbook Tutorials
Get started
Racing Forward at I/O 2023 with Flutter and Dart
Read the announcement!
  • Get started
    • 1. Install
    • 2. Set up an editor
    • 3. Test drive
    • 4. Write your first app
    • 5. Learn more
    • From another platform?
      • Flutter for Android devs
      • Flutter for SwiftUI devs
      • Flutter for UIKit devs
      • Flutter for React Native devs
      • Flutter for web devs
      • Flutter for Xamarin.Forms devs
      • Introduction to declarative UI
    • Dart language overview open_in_new
  • Stay up to date
    • Upgrade
    • SDK archive
    • What's new
    • Release notes
    • Breaking changes
  • Samples & tutorials
    • Flutter Gallery [running app] open_in_new
    • Flutter Gallery [repo] open_in_new
    • Sample apps on GitHub open_in_new
    • Cookbook
    • Codelabs
    • Tutorials
  • User interface
    • Introduction to widgets
    • Building layouts
      • Layouts in Flutter
      • Tutorial
      • Creating adaptive and responsive apps
      • Building adaptive apps
      • Understanding constraints
      • Box constraints
    • Adding interactivity
    • Assets and images
    • Material Design
    • Navigation & routing
      • Navigation in Flutter
      • Deep linking
      • URL strategies
    • Animations
      • Introduction
      • Overview
      • Tutorial
      • Implicit animations
      • Hero animations
      • Staggered animations
    • Advanced UI
      • Actions & shortcuts
      • Fonts & typography
      • Keyboard focus system
      • Gestures
      • Shaders
      • Slivers
    • Widget catalog
  • Data & backend
    • State management
      • Introduction
      • Think declaratively
      • Ephemeral vs app state
      • Simple app state management
      • Options
    • Networking & http
    • JSON and serialization
    • Firebase
    • Google APIs
  • Accessibility & localization
    • Accessibility
    • Internationalization
  • Platform integration
    • Supported platforms
    • Building desktop apps with Flutter
    • Writing platform-specific code
    • Android
      • Adding a splash screen
      • C interop
      • Hosting native Android views
      • Restore state on Android
      • Targeting ChromeOS with Android
    • iOS
      • Leveraging Apple's system libraries
      • Adding a splash screen
      • Adding iOS App Clip support
      • Adding iOS app extensions
      • C interop
      • Hosting native iOS views
      • iOS debugging
      • Restore state on iOS
    • Linux
      • Building Linux apps
    • macOS
      • Building macOS apps
      • C interop
    • Web
      • Building web apps
      • Web FAQ
      • Web renderers
      • Custom app initialization
      • Displaying images on the web
    • Windows
      • Building Windows apps
      • Run loop migration
      • Version information migration
      • Dark mode migration
  • Packages & plugins
    • Background processes
    • Developing packages & plugins
    • Flutter Favorites program
    • Happy paths project
    • Happy paths recommendations
    • Plugins in Flutter tests
    • Using packages
    • Package site open_in_new
  • Tools & features
    • Android Studio & IntelliJ
    • Visual Studio Code
    • DevTools
      • Overview
      • Install from Android Studio & IntelliJ
      • Install from VS Code
      • Install from command line
      • Flutter inspector
      • Performance view
      • CPU Profiler view
      • Memory view
      • Debug console view
      • Network view
      • Debugger
      • Logging view
      • App size tool
      • Release notes
    • SDK overview
    • Flutter and the pubspec file
    • Hot reload
    • Flutter Fix
    • Code formatting
  • Testing & debugging
    • Debugging tools
    • Testing plugins
    • Debugging apps programmatically
    • Using an OEM debugger
    • Flutter's build modes
    • Common Flutter errors
    • Handling errors
    • Testing
    • Integration testing
  • Performance & optimization
    • Overview
    • Impeller **NEW**
    • Performance best practices
    • App size
    • Deferred components
    • Rendering performance
    • Performance profiling
    • Shader compilation jank
    • Performance metrics
    • Performance FAQ
    • Appendix
  • Deployment
    • Obfuscating Dart code
    • Creating flavors for Flutter
    • Build and release an Android app
    • Build and release an iOS app
    • Build and release a macOS app
    • Build and release a Linux app
    • Build and release a Windows app
    • Build and release a web app
    • Continuous deployment
  • Add to an existing app
    • Introduction
    • Adding to an Android app
      • Project setup
      • Add a single Flutter screen
      • Add a Flutter Fragment
      • Add a Flutter View
      • Plugin setup
    • Adding to an iOS app
      • Project setup
      • Add a single Flutter screen
    • Debugging & hot reload
    • Loading sequence and performance
    • Multiple Flutter instances
  • Resources
    • Architectural overview
    • Books
    • Compatibility policy
    • Contributing to Flutter open_in_new
    • Creating useful bug reports
    • Dart resources
    • Design documents
    • FAQ
    • Casual Games Toolkit
    • Google Fonts package open_in_new
    • Inside Flutter
    • Flutter vs. Swift Concurrency
    • Official brand assets open_in_new
    • Platform adaptations
    • Videos and online courses
  • Reference
    • Who is Dash?
    • Widget index
    • API reference open_in_new
    • flutter CLI reference
    • Security false positives
    • Package site open_in_new

Advanced UI

  1. UI
  2. Advanced

Topics:

  • Actions & shortcuts
  • Fonts & typography
  • Keyboard focus system
  • Gestures
  • Shaders
  • Slivers
Flutter Logo
  • terms
  • brand usage
  • security
  • privacy
  • español
  • 社区中文资源
  • We stand in solidarity with the Black community. Black Lives Matter.

Except as otherwise noted, this work is licensed under a Creative Commons Attribution 4.0 International License, and code samples are licensed under the BSD License.