Release/0.1.8

tdesign-component/CHANGELOG.md

@@ -1,3 +1,44 @@
+## 🌈 0.1.8 `2024-12-26`
+### 🚀 Features
+- `TDUpload`: Added Upload component @Luozf12345 ([#405](https://github.com/Tencent/tdesign-flutter/pull/405))
+- `SearchBar`: Added keyboard action type @ccXxx1aoBai ([#366](https://github.com/Tencent/tdesign-flutter/pull/366))
+- `Cell`: CellGroup added style control parameters: cardBorderRadius (card mode border radius), cardPadding (card mode padding), titlePadding (title padding) @hkaikai ([#409](https://github.com/Tencent/tdesign-flutter/pull/409))
+- `DropdownMenu`: Added decorator configuration: decoration, which can customize menu color and border @hkaikai ([#408](https://github.com/Tencent/tdesign-flutter/pull/408))
+- `ImageViewer`: Supports displaying image titles @ccXxx1aoBai ([#411](https://github.com/Tencent/tdesign-flutter/pull/411))
+- `Calendar`: Added monthTitleBuilder parameter @hkaikai ([#419](https://github.com/Tencent/tdesign-flutter/pull/419))
+- `Calendar`: Added pickerHeight, pickerItemCount parameters to control the height of the time selection component @hkaikai ([#421](https://github.com/Tencent/tdesign-flutter/pull/421))
+- `Toast`: Supports customizing the overlay background color @ccXxx1aoBai ([#423](https://github.com/Tencent/tdesign-flutter/pull/423))
+- `Rate`: Supports disabled parameter @hkaikai ([#357](https://github.com/Tencent/tdesign-flutter/pull/357))
+- `Calendar`: Modified CalendarBuilder return value to Widget @Luozf12345 ([#396](https://github.com/Tencent/tdesign-flutter/pull/396))
+- `SearchBar`: Added read-only attribute and click event @shizhe2018 ([#393](https://github.com/Tencent/tdesign-flutter/pull/393))
+- `Dialog`: TDDialogButtonOptions added font size attribute @shizhe2018 ([#381](https://github.com/Tencent/tdesign-flutter/pull/381))
+- `DateTimePicker`: Added time unit display attribute @shizhe2018 ([#383](https://github.com/Tencent/tdesign-flutter/pull/383))
+- `Input`: Added additionInfo left and right display position @shizhe2018 ([#401](https://github.com/Tencent/tdesign-flutter/pull/401))
+
+### 🐞 Bug Fixes
+- `NoticeBar`: Fixed the issue of abnormal text display on the web @ccXxx1aoBai ([#351](https://github.com/Tencent/tdesign-flutter/pull/351))
+- `Rate`: Fixed the issue where the onChange event was not triggered when clicking the tooltip in half selection @hkaikai ([#361](https://github.com/Tencent/tdesign-flutter/pull/361))
+- `Calendar`: Fixed the issue of inaccurate scroll position due to inconsistent number of rows in the month date @hkaikai ([#363](https://github.com/Tencent/tdesign-flutter/pull/363))
+- `Calendar`: Optimized the issue of rendering lag caused by too large min and max @hkaikai ([#363](https://github.com/Tencent/tdesign-flutter/pull/363))
+- `Input`: Fixed the issue where the dividing line and content were not aligned when setting contentPadding @epoll-j ([#365](https://github.com/Tencent/tdesign-flutter/pull/365))
+- `Table`: Fixed the issue of overflow when setting the width of fixed columns @ccXxx1aoBai ([#370](https://github.com/Tencent/tdesign-flutter/pull/370))
+- `Popup`: Fixed the issue of delay in closing when clicking on the overlay @hkaikai ([#380](https://github.com/Tencent/tdesign-flutter/pull/380))
+- `Cascader`: Added the function of clicking to select the first layer @shizhe2018 ([#355](https://github.com/Tencent/tdesign-flutter/pull/355))
+- `DateTimePicker`: Added restrictions on hours, minutes, and seconds @shizhe2018 ([#362](https://github.com/Tencent/tdesign-flutter/pull/362))
+- `Textarea`: Optimized the update of word limit changes @shizhe2018 ([#385](https://github.com/Tencent/tdesign-flutter/pull/385))
+- `TabBar`: Fixed the issue where labelStyle and unselectedLabelStyle did not take effect @shizhe2018 ([#399](https://github.com/Tencent/tdesign-flutter/pull/399))
+- `Picker`: Fixed the issue of unable to select color when sliding in multi-layer pop-up @shizhe2018 ([#413](https://github.com/Tencent/tdesign-flutter/pull/413))
+- `SearchBar`: Fixed the issue of SearchBar jittering at the default position when focusing, and the cursor not being centered @Luozf12345 ([#417](https://github.com/Tencent/tdesign-flutter/pull/417))
+- `Dialog`: Modified Dialog to only pass contentWidget, no need to pass title and content @Luozf12345 ([#418](https://github.com/Tencent/tdesign-flutter/pull/418))
+- `TDBottomTabBar`: Fixed the issue of bottom overflow by 2.5 pixels in iconText mode @epoll-j ([#422](https://github.com/Tencent/tdesign-flutter/pull/422))
+
+### 🚧 Others
+- Adapted to FlutterSdk3.25, the minimum supported version has been adjusted to 3.16.0 @shizhe2018 ([#378](https://github.com/Tencent/tdesign-flutter/pull/378))
+- Modified Example English version copy @shizhe2018 ([#382](https://github.com/Tencent/tdesign-flutter/pull/382))
+- Upgraded flutter_slidable version @Luozf12345 ([#407](https://github.com/Tencent/tdesign-flutter/pull/407))
+- Added component search function to demo @Luozf12345 ([#410](https://github.com/Tencent/tdesign-flutter/pull/410))
+- Updated Icons @Luozf12345 ([#420](https://github.com/Tencent/tdesign-flutter/pull/420))
+
 ## 🌈 0.1.7 `2024-10-16`
 ### 🚀 Features
 - `TDNoticeBar`: Added noticeBar component @ccXxx1aoBai ([#162](https://github.com/Tencent/tdesign-flutter/pull/162))

tdesign-component/README.md

@@ -63,4 +63,8 @@ TDesign Flutter depends on the following component libraries. We appreciate the
 
 [flutter_easyrefresh](https://pub-web.flutter-io.cn/packages/easy_refresh)
 
-[flutter_swiper](https://pub-web.flutter-io.cn/packages/flutter_swiper)
+[flutter_swiper](https://pub-web.flutter-io.cn/packages/flutter_swiper)
+
+[flutter_slidable](https://pub-web.flutter-io.cn/packages/flutter_slidable)
+
+[image_picker](https://pub-web.flutter-io.cn/packages/image_picker)

tdesign-component/example/assets/api/calendar_api.md

@@ -48,9 +48,14 @@
 | onChange | void Function(List<int> value)? | - | 选中值变化时触发 |
 | onCellClick | void Function(int value, DateSelectType type, TDate tdate)? | - | 点击日期时触发 |
 | onCellLongPress | void Function(int value, DateSelectType type, TDate tdate)? | - | 长安日期时触发 |
-| onHeanderClick | void Function(int index, String week)? | - | 点击周时触发 |
+| onHeaderClick | void Function(int index, String week)? | - | 点击周时触发 |
 | useTimePicker | bool? | false | 是否显示时间选择器 |
 | timePickerModel | List<DatePickerModel>? | - | 自定义时间选择器 |
+| monthTitleHeight | double? | 22 | 月标题高度 |
+| monthTitleBuilder | Widget Function(BuildContext context, DateTime monthDate)? | - | 月标题构建器 |
+| pickerHeight | double? | 178 | 时间选择器List的视窗高度 |
+| pickerItemCount | int? | 3 | 选择器List视窗中item个数，pickerHeight / pickerItemCount即item高度 |
+| isTimeUnit | bool? | true | 是否显示时间单位 |
 
 ```
 ```

tdesign-component/example/assets/api/image-viewer_api.md

@@ -8,6 +8,7 @@
 | closeBtn | bool? | - | 是否展示关闭按钮 |
 | deleteBtn | bool? | - | 是否显示删除操作 |
 | images | List<dynamic> | - | 图片数组 |
+| labels | List<String>? | - | 图片描述 |
 | showIndex | bool? | - | 是否显示页码 |
 | defaultIndex | int? | - | 默认预览图片所在的下标 |
 | onIndexChange | OnIndexChange? | - | 预览图片切换回调 |
@@ -25,4 +26,4 @@
 
 | 名称 | 返回类型 | 参数 | 说明 |
 | --- | --- | --- | --- |
-| showImageViewer |  |   required BuildContext context,  required List<dynamic> images,  bool? closeBtn,  bool? deleteBtn,  bool? showIndex,  int? defaultIndex,  double? width,  double? height,  OnIndexChange? onIndexChange,  OnClose? onClose,  OnDelete? onDelete,  OnLongPress? onLongPress, | 显示图片预览 |
+| showImageViewer |  |   required BuildContext context,  required List<dynamic> images,  List<String>? labels,  bool? closeBtn,  bool? deleteBtn,  bool? showIndex,  int? defaultIndex,  double? width,  double? height,  OnIndexChange? onIndexChange,  OnClose? onClose,  OnDelete? onDelete,  OnLongPress? onLongPress, | 显示图片预览 |

tdesign-component/example/assets/api/side-bar_api.md

@@ -33,3 +33,5 @@
 | style | TDSideBarStyle | TDSideBarStyle.normal | 样式 |
 | loading | bool? | - | 加载效果 |
 | loadingWidget | Widget? | - | 自定义加载动画 |
+| selectedBgColor | Color? | - | 选择的背景颜色 |
+| unSelectedBgColor | Color? | - | 未选择的背景颜色 |

tdesign-component/example/assets/api/tabs_api.md

@@ -50,6 +50,7 @@
 | dividerHeight | double | 0.5 | 分割线高度,小于等于0则不展示分割线 |
 | selectedBgColor | Color? | - | 被选中背景色，只有outlineType为capsule时有效 |
 | unSelectedBgColor | Color? | - | 未选中背景色，只有outlineType为capsule时有效 |
+| tabAlignment |  | - |  |
 
 ```
 ```

tdesign-component/example/assets/api/toast_api.md

@@ -5,11 +5,11 @@
 
 | 名称 | 返回类型 | 参数 | 说明 |
 | --- | --- | --- | --- |
-| showText |  |   required String? text,  required BuildContext context,  Duration duration,  int? maxLines,  BoxConstraints? constraints,  bool? preventTap, | 普通文本Toast |
-| showIconText |  |   required String? text,  IconData? icon,  IconTextDirection direction,  required BuildContext context,  Duration duration,  bool? preventTap, | 带图标的Toast |
-| showSuccess |  |   required String? text,  IconTextDirection direction,  required BuildContext context,  Duration duration,  bool? preventTap, | 成功提示Toast |
-| showWarning |  |   required String? text,  IconTextDirection direction,  required BuildContext context,  Duration duration,  bool? preventTap, | 警告Toast |
-| showFail |  |   required String? text,  IconTextDirection direction,  required BuildContext context,  Duration duration,  bool? preventTap, | 失败提示Toast |
-| showLoading |  |   required BuildContext context,  String? text,  Duration duration,  bool? preventTap, | 带文案的加载Toast |
-| showLoadingWithoutText |  |   required BuildContext context,  String? text,  Duration duration,  bool? preventTap, | 不带文案的加载Toast |
+| showText |  |   required String? text,  required BuildContext context,  Duration duration,  int? maxLines,  BoxConstraints? constraints,  bool? preventTap,  Color? backgroundColor, | 普通文本Toast |
+| showIconText |  |   required String? text,  IconData? icon,  IconTextDirection direction,  required BuildContext context,  Duration duration,  bool? preventTap,  Color? backgroundColor, | 带图标的Toast |
+| showSuccess |  |   required String? text,  IconTextDirection direction,  required BuildContext context,  Duration duration,  bool? preventTap,  Color? backgroundColor, | 成功提示Toast |
+| showWarning |  |   required String? text,  IconTextDirection direction,  required BuildContext context,  Duration duration,  bool? preventTap,  Color? backgroundColor, | 警告Toast |
+| showFail |  |   required String? text,  IconTextDirection direction,  required BuildContext context,  Duration duration,  bool? preventTap,  Color? backgroundColor, | 失败提示Toast |
+| showLoading |  |   required BuildContext context,  String? text,  Duration duration,  bool? preventTap,  Color? backgroundColor, | 带文案的加载Toast |
+| showLoadingWithoutText |  |   required BuildContext context,  String? text,  Duration duration,  bool? preventTap,  Color? backgroundColor, | 不带文案的加载Toast |
 | dismissLoading |  |  | 关闭加载Toast |

tdesign-component/example/assets/code/bottomTabBar._iconTextTypeTabBarOverflow.txt

@@ -0,0 +1,37 @@
+
+  Widget _iconTextTypeTabBarOverflow(BuildContext context) {
+    final selectedIcon = Icon(
+      TDIcons.app,
+      color: TDTheme.of(context).brandNormalColor,
+    );
+    final unSelectedIcon = Icon(
+      TDIcons.app,
+      color: TDTheme.of(context).brandNormalColor,
+    );
+    return TDBottomTabBar(TDBottomTabBarBasicType.iconText, useVerticalDivider: false, navigationTabs: [
+      TDBottomTabBarTabConfig(
+        tabText: '标签',
+        selectedIcon: selectedIcon,
+        unselectedIcon: unSelectedIcon,
+        onTap: () {
+          onTapTab(context, '标签1');
+        },
+      ),
+      TDBottomTabBarTabConfig(
+        tabText: '标签',
+        selectedIcon: selectedIcon,
+        unselectedIcon: unSelectedIcon,
+        onTap: () {
+          onTapTab(context, '标签2');
+        },
+      ),
+      TDBottomTabBarTabConfig(
+        tabText: '标签',
+        selectedIcon: selectedIcon,
+        unselectedIcon: unSelectedIcon,
+        onTap: () {
+          onTapTab(context, '标签3');
+        },
+      ),
+    ]);
+  }

tdesign-component/example/assets/code/calendar._buildSimple.txt

@@ -98,6 +98,8 @@ Widget _buildSimple(BuildContext context) {
                   value: value,
                   height: size.height * 0.92,
                   useTimePicker: true,
+                  // pickerHeight: 100,
+                  // pickerItemCount: 2,
                   onCellClick: (value, type, tdate) {
                     print('onCellClick:$value');
                   },

tdesign-component/example/assets/code/icon._showAllIcons.txt

@@ -3,32 +3,110 @@
     return Container(
       color: Colors.white,
       alignment: Alignment.center,
-      child: Wrap(
+      child: Column(
         children: [
           Container(
-            child: TDButton(text: showBorder? '隐藏边框':'显示边框',
+            padding: const EdgeInsets.only(left: 16),
+            alignment: Alignment.topLeft,
+            child: const Wrap(
+              children: [
+                TDText('筛选Icon请前往TDesign官网(长按网址可复制):'),
+                SelectableText('https://tdesign.tencent.com/vue/components/icon')
+              ],
+            ),
+          ),
+          TDSearchBar(
+            action: '搜索',
+            onActionClick: (text) {
+              setState(() {
+                iconList = [];
+                isLoading = true;
+              });
+              Future.delayed(const Duration(milliseconds: 30), () {
+                var list = [];
+                TDIcons.all.forEach((key, value) {
+                  if (value.name.contains(text)) {
+                    list.add(value);
+                  }
+                });
+                setState(() {
+                  iconList = list;
+                  isLoading = false;
+                });
+              });
+            },
+            onClearClick: (_) {
+              setState(() {
+                iconList = TDIcons.all.values;
+              });
+            },
+          ),
+          Container(
+            child: TDButton(
+              text: showBorder ? '隐藏边框' : '显示边框',
               shape: TDButtonShape.filled,
-              onTap: (){
+              onTap: () {
                 setState(() {
                   showBorder = !showBorder;
                 });
-              },),
+              },
+            ),
             margin: const EdgeInsets.only(bottom: 16),
           ),
-          for (var iconData in TDIcons.all.values) SizedBox(
-            height: 100,
-            width: 175,
-
-            child: Column(
-              children: [
-                Container(
-                  color: showBorder ? TDTheme.of(context).brandDisabledColor : Colors.transparent,
-                  child: Icon(iconData),
-                ),
-                TDText(iconData.name)
-              ],
-            ),
-          )
+          Builder(builder: (context) {
+            if (iconList.isEmpty) {
+              return Container(
+                height: 300,
+                alignment: Alignment.center,
+                child: isLoading ? const TDText('加载中...') : const TDText('暂无内容'),
+              );
+            }
+            return SizedBox(
+              height: MediaQuery.of(context).size.height - 150,
+              child: ListView.builder(
+                  itemCount: (iconList.length + 1) ~/ 2,
+                  itemBuilder: (context,index){
+                    var index1 = index ~/ 2;
+                    var index2 = index1 + 1;
+                    var iconData1 =  iconList.elementAt(index1);
+                    var iconData2;
+                    if(iconList.length > index2){
+                      iconData2 =  iconList.elementAt(index2);
+                    }
+                    return Row(
+                      children: [
+                        SizedBox(
+                          height: 100,
+                          width: 175,
+                          child: Column(
+                            children: [
+                              Container(
+                                color: showBorder ? TDTheme.of(context).brandDisabledColor : Colors.transparent,
+                                child: Icon(iconData1),
+                              ),
+                              TDText(iconData1.name)
+                            ],
+                          ),
+                        ),
+                        if (iconData2 != null)
+                          SizedBox(
+                            height: 100,
+                            width: 175,
+                            child: Column(
+                              children: [
+                                Container(
+                                  color: showBorder ? TDTheme.of(context).brandDisabledColor : Colors.transparent,
+                                  child: Icon(iconData2),
+                                ),
+                                TDText(iconData2.name)
+                              ],
+                            ),
+                          )
+                      ],
+                    );
+                  }),
+            );
+          })
         ],
       ),
     );

tdesign-component/example/assets/code/loading._buildCustomSpeedLoading.txt

@@ -14,18 +14,20 @@
             text: '加载中…',
             duration: _currentSliderValue.round(),
           ),
-          Slider(
-            value: _currentSliderValue,
-            max: 2000,
-            min: -20,
-            divisions: 100,
-            label: _currentSliderValue.round().toString(),
+          TDSlider(value: _currentSliderValue,
+            sliderThemeData: TDSliderThemeData(
+              context: context,
+              max: 2000,
+              min: -20,
+              divisions: 100,
+              showThumbValue: true,
+              scaleFormatter: (value) => value.toInt().toString(),
+            ),
             onChanged: (double value) {
               setState(() {
                 _currentSliderValue = value;
               });
-            },
-          ),
+            },)
         ],
       ),
     );

tdesign-component/example/assets/code/sideBar._buildCustomSideBar.txt

@@ -49,6 +49,8 @@
             selectedTextStyle:TextStyle(color: Colors.red),
             onSelected: setCurrentValue,
             contentPadding:EdgeInsets.only(left: 16, top: 16,bottom: 16),
+            selectedBgColor: Colors.blue,
+            unSelectedBgColor: Colors.yellow,
           ),
         ),
         Expanded(

tdesign-component/example/assets/code/slider._buildCapsule.txt

@@ -4,6 +4,7 @@
       children: [
         TDSlider(
           sliderThemeData: TDSliderThemeData.capsule(
+            context: context,
             showThumbValue: true,
             min: 0,
             max: 100,
@@ -18,6 +19,7 @@
         ),
         TDRangeSlider(
           sliderThemeData: TDSliderThemeData.capsule(
+            context: context,
             min: 0,
             max: 100,
             scaleFormatter: (value) => value.toInt().toString(),
@@ -31,6 +33,7 @@
         ),
         TDSlider(
           sliderThemeData: TDSliderThemeData.capsule(
+            context: context,
             min: 0,
             max: 100,
             scaleFormatter: (value) => value.toInt().toString(),
@@ -46,6 +49,7 @@
         ),
         TDRangeSlider(
           sliderThemeData: TDSliderThemeData.capsule(
+            context: context,
             min: 0,
             max: 100,
             showThumbValue: true,
@@ -62,6 +66,7 @@
         ),
         TDSlider(
           sliderThemeData: TDSliderThemeData.capsule(
+            context: context,
             showScaleValue: true,
             divisions: 5,
             min: 0,
@@ -80,6 +85,7 @@
         ),
         TDRangeSlider(
           sliderThemeData: TDSliderThemeData.capsule(
+            context: context,
             showScaleValue: true,
             divisions: 5,
             min: 0,