English | 简体中文
Tencent TDesign UI component library of Flutter, suitable for use in mobile projects.
- Provides Flutter UI component library in TDesign design style
- Support customizing themes according to App design style
- Provides commonly used Icon library and supports customized replacement
- Define color groups according to the TDesign specification, which can be viewed in TDColors to facilitate the adaptation of components to the TDesign specification.
- The color value declaration class can add default colors and view the default display effect of color values in real time.
- SDK dependency version
dart: ">=2.19.0 <4.0.0"
flutter: ">=3.7.0"- Add the dependency in
pubspec.yaml
dependencies:
tdesign_flutter: ^0.0.6- Import at the top of your file:
import 'package:tdesign_flutter/tdesign_flutter.dart';- You can configure theme styles such as colors, font sizes, font styles, corner radius, and shadows through a json file.
Retrieve theme data using
TDTheme.of(context)orTDTheme.defaultData(). It is recommended that components useTDTheme.of(context)unless the component does not need to follow local themes, in which caseTDTheme.defaultData()can be used.
Examples of using colors, fonts, and corner radius:
TDTheme.of(context).brandNormalColor
TDTheme.defaultData().fontBodyLarge- TDesign's icons do not follow the theme, they are all in ttf format, usage examples:
Icon(TDIcons.activity)- For more use examples, please refer to example/lib/page
TDesign also provides component libraries for other platforms and frameworks.
- component library for Vue 2.x : tdesign-vue
- component library for Vue 3.x : tdesign-vue-next
- component library for React : tdesign-react
- component library for Vue 3.x Mobile : tdesign-mobile-vue
- component library for React Mobile : tdesign-mobile-react
- component library for Wechat miniprogram : tdesign-miniprogram
TDesign Flutter depends on the following component libraries. We appreciate the authors for their open-source contributions:
Contributing is welcome. Read guidelines for contributing before submitting your Pull Request.
Create your Github issues or scan the QR code below to join our user groups
The MIT License. Please see the license file for more information.