From 82add55e206c35e71329ca0a4dcf4c18ff3bbde5 Mon Sep 17 00:00:00 2001 From: williamliao Date: Tue, 12 May 2026 22:46:57 +0800 Subject: [PATCH 1/2] feat(tabs): add autoHeight to TTabBarView --- .../example/lib/page/t_tabs_page.dart | 48 +++ .../src/components/tabs/t_tab_bar_view.dart | 293 +++++++++++++++++- .../test/tabs/t_tab_bar_view_test.dart | 203 ++++++++++++ 3 files changed, 527 insertions(+), 17 deletions(-) create mode 100644 tdesign-component/test/tabs/t_tab_bar_view_test.dart diff --git a/tdesign-component/example/lib/page/t_tabs_page.dart b/tdesign-component/example/lib/page/t_tabs_page.dart index 018348260..c7304bc2a 100644 --- a/tdesign-component/example/lib/page/t_tabs_page.dart +++ b/tdesign-component/example/lib/page/t_tabs_page.dart @@ -108,6 +108,9 @@ class _TTabsPageState extends State with TickerProviderStateMixin { ExampleItem(desc: '带图标选项卡', builder: _buildItemWithIcon), ExampleItem(desc: '带微标选项卡', builder: _buildItemWithLogo), ExampleItem(desc: '带内容区选项卡', builder: _buildItemWithContent), + ExampleItem( + desc: '带内容区选项卡（autoHeight 自适应高度）', + builder: _buildItemWithAutoHeight), ], ), ExampleModule(title: '组件状态', children: [ @@ -246,6 +249,51 @@ class _TTabsPageState extends State with TickerProviderStateMixin { ); } + @Demo(group: 'tabs') + Widget _buildItemWithAutoHeight(BuildContext context) { + // 演示 issue #519 的修复：开启 autoHeight 后，外部无需再包 SizedBox + // 显式设置高度，TTabBarView 会根据当前激活 tab 的子内容高度自适应， + // 切换 tab 时高度会平滑过渡。 + var tabController = TabController(length: 3, vsync: this); + // 三个子内容高度故意不同，用于观察外层容器的高度过渡效果 + final autoHeightTabViews = [ + Container( + height: 100, + color: const Color(0xFFE3F0FF), + alignment: Alignment.center, + child: const TText('内容区 1（高度 100）'), + ), + Container( + height: 200, + color: const Color(0xFFE8F7E3), + alignment: Alignment.center, + child: const TText('内容区 2（高度 200）'), + ), + Container( + height: 150, + color: const Color(0xFFFFF5E0), + alignment: Alignment.center, + child: const TText('内容区 3（高度 150）'), + ), + ]; + return Column( + children: [ + TTabBar( + tabs: subList(3), + controller: tabController, + showIndicator: true, + isScrollable: false, + ), + // 此处未给 TTabBarView 包 SizedBox、也未指定 height + TTabBarView( + autoHeight: true, + controller: tabController, + children: autoHeightTabViews, + ), + ], + ); + } + @Demo(group: 'tabs') Widget _buildItemWithStatus(BuildContext context) { var tabs = [ diff --git a/tdesign-component/lib/src/components/tabs/t_tab_bar_view.dart b/tdesign-component/lib/src/components/tabs/t_tab_bar_view.dart index 17d8290be..228faaa92 100644 --- a/tdesign-component/lib/src/components/tabs/t_tab_bar_view.dart +++ b/tdesign-component/lib/src/components/tabs/t_tab_bar_view.dart @@ -1,35 +1,294 @@ import 'package:flutter/material.dart'; -class TTabBarView extends TabBarView { - /// 子widget列表 - @override +/// [TTabBarView] 是 TDesign Flutter 对原生 [TabBarView] 的封装。 +/// +/// 在默认模式下（[autoHeight] = false）完全等价于原生 [TabBarView]， +/// 需要外部显式给它一个高度约束（例如包一层 [SizedBox(height: ...)] +/// 或放进 [Expanded] 内）才能正常显示。 +/// +/// 当 [autoHeight] 为 true 时，[TTabBarView] 会自动测量当前激活 tab +/// 子 widget 的真实高度并据此撑开自身，无需外部再手动设置固定高度。 +/// 切 tab 时高度会以 [animationDuration] 指定的时长平滑过渡到目标 +/// 子 widget 的高度；若 [isSlideSwitch] 为 true（可横向滑动切换）， +/// 滑动过程中外层高度会在前后两个子 widget 的高度间平滑插值， +/// 避免高度跳变。 +/// +/// 参考 [issue #519](https://github.com/Tencent/tdesign-flutter/issues/519)。 +class TTabBarView extends StatefulWidget { + /// 子 widget 列表（每一项对应一个 tab 页的内容） final List children; - /// 控制器 - @override + /// Tab 控制器，用于和外部 [TabBar] 联动 final TabController? controller; - /// 是否可以滑动切换 + /// 是否可以左右滑动切换 tab 页 + /// * false（默认）：禁用滑动，仅通过点击 tab 切换 + /// * true：允许滑动 final bool isSlideSwitch; - @override + /// 是否开启高度自适应（默认 false，保持向后兼容） + /// + /// 开启后 [TTabBarView] 会根据当前激活的子 widget 高度自动撑开， + /// 外部无需再包 [SizedBox] / [Container] 显式指定高度。 + final bool autoHeight; + + /// 高度自适应模式下的过渡动画时长（默认 300ms） + /// + /// 当 [autoHeight] = false 时该参数无效。 + final Duration animationDuration; + const TTabBarView({ Key? key, required this.children, this.controller, this.isSlideSwitch = false, - }) : super( - key: key, - children: children, - controller: controller, - physics: isSlideSwitch - ? const ScrollPhysics() - : const NeverScrollableScrollPhysics()); + this.autoHeight = false, + this.animationDuration = const Duration(milliseconds: 300), + }) : super(key: key); + + @override + State createState() => _TTabBarViewState(); +} + +class _TTabBarViewState extends State { + /// 每个子 widget 测量得到的真实高度；下标 = children index + late List _childHeights; + + /// 当前生效的外层容器高度（驱动 [AnimatedSize]） + double? _currentHeight; + + TabController? _controller; + + @override + void initState() { + super.initState(); + _childHeights = List.filled(widget.children.length, 0); + _attachController(); + } + + @override + void didUpdateWidget(covariant TTabBarView oldWidget) { + super.didUpdateWidget(oldWidget); + + // children 数量变化时需要重建高度表 + if (oldWidget.children.length != widget.children.length) { + _childHeights = List.filled(widget.children.length, 0); + _currentHeight = null; + } + + // controller 变更时需要重新挂载监听 + if (oldWidget.controller != widget.controller) { + _detachController(); + _attachController(); + } + } + + @override + void dispose() { + _detachController(); + super.dispose(); + } + + void _attachController() { + _controller = widget.controller; + _controller?.animation?.addListener(_onControllerTick); + } + + void _detachController() { + _controller?.animation?.removeListener(_onControllerTick); + _controller = null; + } + + /// 监听 [TabController.animation] —— 每帧根据 animation.value 在 + /// 相邻两个子 widget 高度之间插值，实现滑动中高度平滑过渡。 + void _onControllerTick() { + if (!widget.autoHeight) { + return; + } + final animation = _controller?.animation; + if (animation == null) { + return; + } + final interpolated = _interpolateHeight(animation.value); + if (interpolated != null && interpolated != _currentHeight) { + setState(() { + _currentHeight = interpolated; + }); + } + } + /// 根据浮点位置在相邻两个子 widget 高度间线性插值。 + /// 返回 null 表示尚未采集到有效高度。 + double? _interpolateHeight(double position) { + if (widget.children.isEmpty) { + return null; + } + final lastIndex = widget.children.length - 1; + final clamped = position.clamp(0.0, lastIndex.toDouble()); + final lower = clamped.floor(); + final upper = clamped.ceil().clamp(0, lastIndex); + final t = clamped - lower; + + final hLower = _childHeights[lower]; + final hUpper = _childHeights[upper]; + if (hLower <= 0 && hUpper <= 0) { + return null; + } + if (hLower <= 0) { + return hUpper; + } + if (hUpper <= 0) { + return hLower; + } + return hLower + (hUpper - hLower) * t; + } + + /// 子 widget 上报自己的高度 + void _onChildHeightChanged(int index, double height) { + if (index < 0 || index >= _childHeights.length) { + return; + } + if ((_childHeights[index] - height).abs() < 0.5) { + // 阈值过滤，避免浮点误差触发无谓 setState + return; + } + _childHeights[index] = height; + + if (!widget.autoHeight) { + return; + } + // 子高度变化后，按当前 animation 位置重新插值 + final animation = _controller?.animation; + final position = + animation?.value ?? _controller?.index.toDouble() ?? 0.0; + final newHeight = _interpolateHeight(position); + if (newHeight != null && newHeight != _currentHeight) { + // 本方法由 [_SizeReportingWidget._notifySize] 在 postFrameCallback + // 中调用，此时已处于帧提交之外的安全时机，可以直接 setState。 + if (!mounted) { + return; + } + setState(() { + _currentHeight = newHeight; + }); + } + } + + @override Widget build(BuildContext context) { - return TabBarView( - children: children, - controller: controller, + final physics = widget.isSlideSwitch + ? const ScrollPhysics() + : const NeverScrollableScrollPhysics(); + + if (!widget.autoHeight) { + // 向后兼容路径：与原有行为完全一致——外部必须给高度约束。 + return TabBarView( + controller: widget.controller, + physics: physics, + children: widget.children, + ); + } + + // 自适应高度路径： + // + // 使用"影子测量（shadow measurement）"策略——先用 Offstage 把所有 + // children 在"不受父高度约束"的环境下渲染一次，通过 [_SizeReportingWidget] + // 各自上报真实高度；随后用 AnimatedSize + SizedBox(_currentHeight) + // 驱动可见的 TabBarView 平滑过渡到当前激活子 widget 的高度。 + // + // 之所以需要影子测量：若直接把 _SizeReportingWidget 放进 TabBarView + // 的 children，子会被外层 SizedBox 的有限高度压缩，上报的"真实高度" + // 失真（例如一个 200 高的子在 100 的 SizedBox 里会被上报为 100）， + // 导致切换 tab 时高度无法正确扩展。 + final shadowMeasure = Offstage( + offstage: true, + child: TickerMode( + enabled: false, + child: Column( + mainAxisSize: MainAxisSize.min, + children: [ + for (var i = 0; i < widget.children.length; i++) + _SizeReportingWidget( + onSizeChange: (size) => _onChildHeightChanged(i, size.height), + child: widget.children[i], + ), + ], + ), + ), ); + + // 首帧尚未采集到高度前，仅渲染 shadowMeasure 让子完成一次测量。 + // 下一帧 _currentHeight 就绪后会重新 build 并渲染 AnimatedSize。 + if (_currentHeight == null) { + return shadowMeasure; + } + + return Stack( + children: [ + shadowMeasure, + AnimatedSize( + duration: widget.animationDuration, + curve: Curves.easeInOut, + alignment: Alignment.topCenter, + child: SizedBox( + height: _currentHeight, + child: TabBarView( + controller: widget.controller, + physics: physics, + children: widget.children, + ), + ), + ), + ], + ); + } +} + +/// 一个轻量级的"尺寸上报"包装器：子 widget 每次 layout 后会通过 +/// [onSizeChange] 回调上报自身的实际尺寸，仅在尺寸发生变化时触发。 +class _SizeReportingWidget extends StatefulWidget { + final Widget child; + final ValueChanged onSizeChange; + + const _SizeReportingWidget({ + Key? key, + required this.child, + required this.onSizeChange, + }) : super(key: key); + + @override + State<_SizeReportingWidget> createState() => _SizeReportingWidgetState(); +} + +class _SizeReportingWidgetState extends State<_SizeReportingWidget> { + final GlobalKey _childKey = GlobalKey(); + Size? _oldSize; + + @override + Widget build(BuildContext context) { + WidgetsBinding.instance.addPostFrameCallback(_notifySize); + return Container( + // 顶部对齐：让子内容从顶部开始占据空间，避免子内容较短时被居中后 + // 在 TabBarView 的内部 PageView 中出现视觉偏移。 + alignment: Alignment.topCenter, + key: _childKey, + child: widget.child, + ); + } + + void _notifySize(Duration _) { + if (!mounted) { + return; + } + final context = _childKey.currentContext; + if (context == null) { + return; + } + final newSize = context.size; + if (newSize == null || newSize == _oldSize) { + return; + } + _oldSize = newSize; + widget.onSizeChange(newSize); } } diff --git a/tdesign-component/test/tabs/t_tab_bar_view_test.dart b/tdesign-component/test/tabs/t_tab_bar_view_test.dart new file mode 100644 index 000000000..346de7b06 --- /dev/null +++ b/tdesign-component/test/tabs/t_tab_bar_view_test.dart @@ -0,0 +1,203 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_test/flutter_test.dart'; +import 'package:tdesign_flutter/tdesign_flutter.dart'; + +/// TTabBarView 自适应高度相关 Widget 测试 +/// +/// 覆盖 [issue #519](https://github.com/Tencent/tdesign-flutter/issues/519) +/// 的修复点： +/// 1. 默认 `autoHeight = false` 时，行为保持与原生 TabBarView 一致， +/// 仍需外部给高度约束（向后兼容）； +/// 2. `autoHeight = true` 时，外部无需包 SizedBox 即可根据子内容高度 +/// 自动撑开； +/// 3. 切换 tab 后外层高度会过渡到目标子 widget 的高度； +/// 4. 子 widget 列表数量变更后高度缓存正确重建。 +void main() { + /// 构建一个带 TabController 的测试宿主 + /// + /// [tabLabels] 必须与 children 的数量相等。用不同的 tabLabel 和子内容 + /// text，避免 finder 命中冲突。 + Widget buildHost({ + required TabController controller, + required Widget tabBarView, + required List tabLabels, + }) { + return MaterialApp( + home: Scaffold( + body: Column( + children: [ + // 用原生 TabBar 驱动 controller，不依赖 TTabBar 的样式实现， + // 让测试只聚焦在 TTabBarView 自身的行为上。 + TabBar( + controller: controller, + tabs: [ + for (final label in tabLabels) Tab(text: label), + ], + ), + tabBarView, + ], + ), + ), + ); + } + + group('TTabBarView default mode (issue #519 backward compatibility)', () { + testWidgets('autoHeight 默认为 false，行为等价于原生 TabBarView', + (WidgetTester tester) async { + final controller = + TabController(length: 3, vsync: const TestVSync()); + addTearDown(controller.dispose); + + await tester.pumpWidget( + buildHost( + controller: controller, + tabLabels: const ['Tab1', 'Tab2', 'Tab3'], + tabBarView: SizedBox( + height: 120, + child: TTabBarView( + controller: controller, + children: const [ + SizedBox(height: 100, child: Text('Content-Alpha')), + SizedBox(height: 100, child: Text('Content-Beta')), + SizedBox(height: 100, child: Text('Content-Gamma')), + ], + ), + ), + ), + ); + await tester.pumpAndSettle(); + + // 外部包了 SizedBox(height: 120)，内容应正常显示 + expect(find.text('Content-Alpha'), findsOneWidget); + }); + }); + + group('TTabBarView autoHeight mode (issue #519)', () { + testWidgets('autoHeight: true 时不包外层 SizedBox 仍能正常渲染子内容', + (WidgetTester tester) async { + final controller = + TabController(length: 3, vsync: const TestVSync()); + addTearDown(controller.dispose); + + await tester.pumpWidget( + buildHost( + controller: controller, + tabLabels: const ['Tab1', 'Tab2', 'Tab3'], + // 关键：不再包 SizedBox / 不指定 height + tabBarView: TTabBarView( + autoHeight: true, + controller: controller, + animationDuration: const Duration(milliseconds: 50), + children: const [ + SizedBox(height: 100, child: Text('Content-Alpha')), + SizedBox(height: 200, child: Text('Content-Beta')), + SizedBox(height: 150, child: Text('Content-Gamma')), + ], + ), + ), + ); + await tester.pumpAndSettle(); + + // 当前激活 tab 的子内容可见 + expect(find.text('Content-Alpha'), findsOneWidget); + }); + + testWidgets('autoHeight: true 时外层容器的高度会跟随子内容', + (WidgetTester tester) async { + final controller = + TabController(length: 3, vsync: const TestVSync()); + addTearDown(controller.dispose); + + await tester.pumpWidget( + buildHost( + controller: controller, + tabLabels: const ['Tab1', 'Tab2', 'Tab3'], + tabBarView: TTabBarView( + autoHeight: true, + controller: controller, + animationDuration: const Duration(milliseconds: 50), + children: const [ + SizedBox(height: 100, child: Text('Content-Alpha')), + SizedBox(height: 200, child: Text('Content-Beta')), + SizedBox(height: 150, child: Text('Content-Gamma')), + ], + ), + ), + ); + await tester.pumpAndSettle(); + + // 初始激活第 0 页（高度 100） + final tabBarViewFinder = find.byType(TTabBarView); + expect(tabBarViewFinder, findsOneWidget); + + final initialHeight = tester.getSize(tabBarViewFinder).height; + expect(initialHeight, greaterThan(0), + reason: 'autoHeight 模式下 TTabBarView 的实际高度必须 > 0'); + // 允许一定误差（浮点抖动），但应与 100 接近 + expect(initialHeight, closeTo(100, 4), + reason: '首次渲染时外层高度应与第 0 个子 widget 高度一致'); + + // 切到第 1 页（高度 200） + controller.animateTo(1); + await tester.pumpAndSettle(); + + final secondHeight = tester.getSize(tabBarViewFinder).height; + expect(secondHeight, closeTo(200, 4), + reason: '切换到第 1 页后外层高度应过渡到子 widget 高度 200'); + }); + + testWidgets('autoHeight: true 时 children 数量变更后可正常重建', + (WidgetTester tester) async { + final controller1 = + TabController(length: 3, vsync: const TestVSync()); + addTearDown(controller1.dispose); + + await tester.pumpWidget( + buildHost( + controller: controller1, + tabLabels: const ['Tab1', 'Tab2', 'Tab3'], + tabBarView: TTabBarView( + autoHeight: true, + controller: controller1, + animationDuration: const Duration(milliseconds: 50), + children: const [ + SizedBox(height: 100, child: Text('Content-Alpha')), + SizedBox(height: 200, child: Text('Content-Beta')), + SizedBox(height: 150, child: Text('Content-Gamma')), + ], + ), + ), + ); + await tester.pumpAndSettle(); + + // 换到新的 controller + 新的 2 个子 + final controller2 = + TabController(length: 2, vsync: const TestVSync()); + addTearDown(controller2.dispose); + + await tester.pumpWidget( + buildHost( + controller: controller2, + tabLabels: const ['TabX', 'TabY'], + tabBarView: TTabBarView( + autoHeight: true, + controller: controller2, + animationDuration: const Duration(milliseconds: 50), + children: const [ + SizedBox(height: 80, child: Text('Content-X')), + SizedBox(height: 160, child: Text('Content-Y')), + ], + ), + ), + ); + await tester.pumpAndSettle(); + + // 新的第 0 页可见 + expect(find.text('Content-X'), findsOneWidget); + // 外层高度跟随新子内容 + final height = tester.getSize(find.byType(TTabBarView)).height; + expect(height, closeTo(80, 4), + reason: 'children 数量变更并重建后外层高度应按新子 widget 计算'); + }); + }); +} From 06cf82671ed2f1e8aa0fb51210a0eee972632206 Mon Sep 17 00:00:00 2001 From: "autofix-ci[bot]" <114827586+autofix-ci[bot]@users.noreply.github.com> Date: Wed, 13 May 2026 01:45:38 +0000 Subject: [PATCH 2/2] [autofix.ci] apply automated fixes --- .../example/assets/api/action-sheet_api.md | 38 ++++----- .../example/assets/api/button_api.md | 50 ++++++------ .../example/assets/api/calendar_api.md | 64 +++++++-------- .../example/assets/api/cell_api.md | 78 +++++++++--------- .../example/assets/api/checkbox_api.md | 44 +++++----- .../example/assets/api/dialog_api.md | 74 ++++++++--------- .../example/assets/api/drawer_api.md | 54 ++++++------- .../example/assets/api/dropdown-menu_api.md | 51 ++++++------ .../example/assets/api/form_api.md | 58 +++++++------- .../example/assets/api/image-viewer_api.md | 22 ++--- .../example/assets/api/indexes_api.md | 48 +++++------ .../example/assets/api/message_api.md | 48 +++++------ .../example/assets/api/notice-bar_api.md | 48 +++++------ .../example/assets/api/picker_api.md | 68 ++++++++-------- .../example/assets/api/popover_api.md | 26 +++--- .../example/assets/api/popup_api.md | 52 ++++++------ .../example/assets/api/side-bar_api.md | 32 ++++---- .../example/assets/api/skeleton_api.md | 40 +++++----- .../example/assets/api/steps_api.md | 30 +++---- .../example/assets/api/swiper_api.md | 30 +++---- .../example/assets/api/tab-bar_api.md | 64 +++++++-------- .../example/assets/api/tabs_api.md | 28 ++++--- .../example/assets/api/time-counter_api.md | 50 ++++++------ .../example/assets/api/tree-select_api.md | 30 +++---- .../code/tabs._buildItemWithAutoHeight.txt | 44 ++++++++++ tdesign-site/src/action-sheet/README.md | 38 ++++----- tdesign-site/src/button/README.md | 50 ++++++------ tdesign-site/src/calendar/README.md | 64 +++++++-------- tdesign-site/src/cell/README.md | 78 +++++++++--------- tdesign-site/src/checkbox/README.md | 44 +++++----- tdesign-site/src/dialog/README.md | 74 ++++++++--------- tdesign-site/src/drawer/README.md | 54 ++++++------- tdesign-site/src/dropdown-menu/README.md | 52 ++++++------ tdesign-site/src/form/README.md | 58 +++++++------- tdesign-site/src/image-viewer/README.md | 22 ++--- tdesign-site/src/indexes/README.md | 48 +++++------ tdesign-site/src/message/README.md | 48 +++++------ tdesign-site/src/notice-bar/README.md | 48 +++++------ tdesign-site/src/picker/README.md | 68 ++++++++-------- tdesign-site/src/popover/README.md | 26 +++--- tdesign-site/src/popup/README.md | 52 ++++++------ tdesign-site/src/side-bar/README.md | 32 ++++---- tdesign-site/src/steps/README.md | 30 +++---- tdesign-site/src/swiper/README.md | 30 +++---- tdesign-site/src/tab-bar/README.md | 64 +++++++-------- tdesign-site/src/tabs/README.md | 80 ++++++++++++++++--- tdesign-site/src/time-counter/README.md | 50 ++++++------ tdesign-site/src/tree-select/README.md | 30 +++---- 48 files changed, 1206 insertions(+), 1105 deletions(-) create mode 100644 tdesign-component/example/assets/code/tabs._buildItemWithAutoHeight.txt diff --git a/tdesign-component/example/assets/api/action-sheet_api.md b/tdesign-component/example/assets/api/action-sheet_api.md index 8c7efa525..a08aa51e4 100644 --- a/tdesign-component/example/assets/api/action-sheet_api.md +++ b/tdesign-component/example/assets/api/action-sheet_api.md @@ -1,4 +1,23 @@ ## API +### TActionSheetItem +#### 简介 +动作面板项目 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| badge | TBadge? | - | 角标 | +| description | String? | - | 描述信息 | +| disabled | bool | false | 是否禁用 | +| group | String? | - | 分组，用于带描述多行滚动宫格 | +| icon | Widget? | - | 图标 | +| iconSize | double? | - | 图标大小 | +| label | String | - | 标题 | +| textStyle | TextStyle? | - | 标题样式 | + +``` +``` + ### TActionSheet #### 简介 动作面板 @@ -35,22 +54,3 @@ | showGridActionSheet | | required BuildContext context, required List items, TActionSheetAlign align, String? cancelText, bool showCancel, TActionSheetItemCallback? onSelected, bool showOverlay, bool closeOnOverlayClick, int count, int rows, double itemHeight, double itemMinWidth, bool scrollable, bool showPagination, VoidCallback? onCancel, String? description, VoidCallback? onClose, bool useSafeArea, | 显示宫格类型面板 | | showGroupActionSheet | | required BuildContext context, required List items, TActionSheetAlign align, String? cancelText, bool showCancel, TActionSheetItemCallback? onSelected, bool showOverlay, bool closeOnOverlayClick, double itemHeight, double itemMinWidth, VoidCallback? onCancel, VoidCallback? onClose, bool useSafeArea, | 显示分组类型面板 | | showListActionSheet | | required BuildContext context, required List items, TActionSheetAlign align, String? cancelText, bool showCancel, VoidCallback? onCancel, TActionSheetItemCallback? onSelected, bool showOverlay, bool closeOnOverlayClick, VoidCallback? onClose, bool useSafeArea, | 显示列表类型面板 | - -``` -``` - -### TActionSheetItem -#### 简介 -动作面板项目 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| badge | TBadge? | - | 角标 | -| description | String? | - | 描述信息 | -| disabled | bool | false | 是否禁用 | -| group | String? | - | 分组，用于带描述多行滚动宫格 | -| icon | Widget? | - | 图标 | -| iconSize | double? | - | 图标大小 | -| label | String | - | 标题 | -| textStyle | TextStyle? | - | 标题样式 | diff --git a/tdesign-component/example/assets/api/button_api.md b/tdesign-component/example/assets/api/button_api.md index bb540f5c0..be9eb3640 100644 --- a/tdesign-component/example/assets/api/button_api.md +++ b/tdesign-component/example/assets/api/button_api.md @@ -1,29 +1,4 @@ ## API -### TButtonStyle -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| backgroundColor | Color? | - | 背景颜色 | -| frameColor | Color? | - | 边框颜色 | -| frameWidth | double? | - | 边框宽度 | -| gradient | Gradient? | - | 渐变背景色 | -| radius | BorderRadiusGeometry? | - | 自定义圆角 | -| textColor | Color? | - | 文字颜色 | - - -#### 工厂构造方法 - -| 名称 | 说明 | -| --- | --- | -| TButtonStyle.generateFillStyleByTheme | 生成不同主题的填充按钮样式 | -| TButtonStyle.generateGhostStyleByTheme | 生成不同主题的幽灵按钮样式 | -| TButtonStyle.generateOutlineStyleByTheme | 生成不同主题的描边按钮样式 | -| TButtonStyle.generateTextStyleByTheme | 生成不同主题的文本按钮样式 | - -``` -``` - ### TButton #### 默认构造方法 @@ -54,3 +29,28 @@ | theme | TButtonTheme? | - | 主题 | | type | TButtonType | TButtonType.fill | 类型：填充，描边，文字 | | width | double? | - | 自定义宽度 | + +``` +``` + +### TButtonStyle +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| backgroundColor | Color? | - | 背景颜色 | +| frameColor | Color? | - | 边框颜色 | +| frameWidth | double? | - | 边框宽度 | +| gradient | Gradient? | - | 渐变背景色 | +| radius | BorderRadiusGeometry? | - | 自定义圆角 | +| textColor | Color? | - | 文字颜色 | + + +#### 工厂构造方法 + +| 名称 | 说明 | +| --- | --- | +| TButtonStyle.generateFillStyleByTheme | 生成不同主题的填充按钮样式 | +| TButtonStyle.generateGhostStyleByTheme | 生成不同主题的幽灵按钮样式 | +| TButtonStyle.generateOutlineStyleByTheme | 生成不同主题的描边按钮样式 | +| TButtonStyle.generateTextStyleByTheme | 生成不同主题的文本按钮样式 | diff --git a/tdesign-component/example/assets/api/calendar_api.md b/tdesign-component/example/assets/api/calendar_api.md index 82a806754..b5bd37505 100644 --- a/tdesign-component/example/assets/api/calendar_api.md +++ b/tdesign-component/example/assets/api/calendar_api.md @@ -1,32 +1,4 @@ ## API -### TCalendarStyle -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| cellDecoration | BoxDecoration? | - | 日期decoration | -| cellPrefixStyle | TextStyle? | - | 日期前面的字符串的样式 | -| cellStyle | TextStyle? | - | 日期样式 | -| cellSuffixStyle | TextStyle? | - | 日期后面的字符串的样式 | -| centreColor | Color? | - | 日期范围内背景样式 | -| decoration | | - | | -| monthTitleStyle | TextStyle? | - | body区域 年月文字样式 | -| titleCloseColor | Color? | - | header区域 关闭图标的颜色 | -| titleMaxLine | int? | - | header区域 [TCalendar.title]的行数 | -| titleStyle | TextStyle? | - | header区域 [TCalendar.title]的样式 | -| weekdayStyle | TextStyle? | - | header区域 周 文字样式 | - - -#### 工厂构造方法 - -| 名称 | 说明 | -| --- | --- | -| TCalendarStyle.cellStyle | 日期样式 | -| TCalendarStyle.generateStyle | 生成默认样式 | - -``` -``` - ### TCalendar #### 默认构造方法 @@ -69,10 +41,6 @@ ``` ``` -### TCalendarDataSource -``` -``` - ### TCalendarPopup #### 默认构造方法 @@ -91,6 +59,38 @@ ``` ``` +### TCalendarStyle +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| cellDecoration | BoxDecoration? | - | 日期decoration | +| cellPrefixStyle | TextStyle? | - | 日期前面的字符串的样式 | +| cellStyle | TextStyle? | - | 日期样式 | +| cellSuffixStyle | TextStyle? | - | 日期后面的字符串的样式 | +| centreColor | Color? | - | 日期范围内背景样式 | +| decoration | | - | | +| monthTitleStyle | TextStyle? | - | body区域 年月文字样式 | +| titleCloseColor | Color? | - | header区域 关闭图标的颜色 | +| titleMaxLine | int? | - | header区域 [TCalendar.title]的行数 | +| titleStyle | TextStyle? | - | header区域 [TCalendar.title]的样式 | +| weekdayStyle | TextStyle? | - | header区域 周 文字样式 | + + +#### 工厂构造方法 + +| 名称 | 说明 | +| --- | --- | +| TCalendarStyle.cellStyle | 日期样式 | +| TCalendarStyle.generateStyle | 生成默认样式 | + +``` +``` + +### TCalendarDataSource +``` +``` + ### TLunarInfo #### 默认构造方法 diff --git a/tdesign-component/example/assets/api/cell_api.md b/tdesign-component/example/assets/api/cell_api.md index a3ed0ea98..b66815628 100644 --- a/tdesign-component/example/assets/api/cell_api.md +++ b/tdesign-component/example/assets/api/cell_api.md @@ -1,4 +1,43 @@ ## API +### TCell +#### 简介 +单元格组件 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| align | TCellAlign? | TCellAlign.middle | 内容的对齐方式，默认居中对齐。可选项：top/middle/bottom | +| arrow | bool? | false | 是否显示右侧箭头 | +| bordered | bool? | true | 是否显示下边框，仅在TCellGroup组件下起作用 | +| description | String? | - | 下方内容描述文字 | +| descriptionWidget | Widget? | - | 下方内容描述组件 | +| disabled | bool? | false | 禁用 | +| height | double? | - | 高度 | +| hover | bool? | true | 是否开启点击反馈 | +| image | ImageProvider? | - | 主图 | +| imageCircle | double? | 50 | 主图圆角，默认50（圆形） | +| imageSize | double? | - | 主图尺寸 | +| imageWidget | Widget? | - | 主图组件 | +| key | | - | | +| leftIcon | IconData? | - | 左侧图标，出现在单元格标题的左侧 | +| leftIconWidget | Widget? | - | 左侧图标组件 | +| note | String? | - | 和标题同行的说明文字 | +| noteMaxLine | int | 1 | 说明文字组件 最大行数 | +| noteMaxWidth | double? | - | 说明文字组件 最大宽度，超过部分显示省略号，防止文字溢出 | +| noteWidget | Widget? | - | 说明文字组件 | +| onClick | TCellClick? | - | 点击事件 | +| onLongPress | TCellClick? | - | 长按事件 | +| required | bool? | false | 是否显示表单必填星号 | +| rightIcon | IconData? | - | 最右侧图标 | +| rightIconWidget | Widget? | - | 最右侧图标组件 | +| showBottomBorder | bool? | false | 是否显示下边框（建议TCellGroup组件下false，避免与bordered重叠） | +| style | TCellStyle? | - | 自定义样式 | +| title | String? | - | 标题 | +| titleWidget | Widget? | - | 标题组件 | + +``` +``` + ### TCellGroup #### 简介 单元格组组件 @@ -52,42 +91,3 @@ | 名称 | 说明 | | --- | --- | | TCellStyle.cellStyle | 生成单元格默认样式 | - -``` -``` - -### TCell -#### 简介 -单元格组件 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| align | TCellAlign? | TCellAlign.middle | 内容的对齐方式，默认居中对齐。可选项：top/middle/bottom | -| arrow | bool? | false | 是否显示右侧箭头 | -| bordered | bool? | true | 是否显示下边框，仅在TCellGroup组件下起作用 | -| description | String? | - | 下方内容描述文字 | -| descriptionWidget | Widget? | - | 下方内容描述组件 | -| disabled | bool? | false | 禁用 | -| height | double? | - | 高度 | -| hover | bool? | true | 是否开启点击反馈 | -| image | ImageProvider? | - | 主图 | -| imageCircle | double? | 50 | 主图圆角，默认50（圆形） | -| imageSize | double? | - | 主图尺寸 | -| imageWidget | Widget? | - | 主图组件 | -| key | | - | | -| leftIcon | IconData? | - | 左侧图标，出现在单元格标题的左侧 | -| leftIconWidget | Widget? | - | 左侧图标组件 | -| note | String? | - | 和标题同行的说明文字 | -| noteMaxLine | int | 1 | 说明文字组件 最大行数 | -| noteMaxWidth | double? | - | 说明文字组件 最大宽度，超过部分显示省略号，防止文字溢出 | -| noteWidget | Widget? | - | 说明文字组件 | -| onClick | TCellClick? | - | 点击事件 | -| onLongPress | TCellClick? | - | 长按事件 | -| required | bool? | false | 是否显示表单必填星号 | -| rightIcon | IconData? | - | 最右侧图标 | -| rightIconWidget | Widget? | - | 最右侧图标组件 | -| showBottomBorder | bool? | false | 是否显示下边框（建议TCellGroup组件下false，避免与bordered重叠） | -| style | TCellStyle? | - | 自定义样式 | -| title | String? | - | 标题 | -| titleWidget | Widget? | - | 标题组件 | diff --git a/tdesign-component/example/assets/api/checkbox_api.md b/tdesign-component/example/assets/api/checkbox_api.md index 1683f7697..0d77c411c 100644 --- a/tdesign-component/example/assets/api/checkbox_api.md +++ b/tdesign-component/example/assets/api/checkbox_api.md @@ -1,26 +1,4 @@ ## API -### TCheckboxGroup -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| checkedIds | List? | - | 勾选的CheckBox id列表 | -| child | | - | | -| contentDirection | TContentDirection? | - | 文字相对icon的方位 | -| controller | TCheckboxGroupController? | - | 可以通过控制器操作勾选状态 | -| customContentBuilder | ContentBuilder? | - | CheckBox完全自定义内容 | -| customIconBuilder | IconBuilder? | - | 自定义选择icon的样式 | -| key | | - | | -| maxChecked | int? | - | 最多可以勾选多少 | -| onChangeGroup | OnGroupChange? | - | 状态变化监听器 | -| onOverloadChecked | VoidCallback? | - | 超过最大可勾选的个数 | -| spacing | double? | - | CheckBoxicon和文字的距离 | -| style | TCheckboxStyle? | - | CheckBox复选框样式：圆形或方形 | -| titleMaxLine | int? | - | CheckBox标题的行数 | - -``` -``` - ### TCheckbox #### 默认构造方法 @@ -53,3 +31,25 @@ | titleColor | Color? | - | 标题文字颜色 | | titleFont | Font? | - | 标题字体大小 | | titleMaxLine | int? | - | 标题的行数 | + +``` +``` + +### TCheckboxGroup +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| checkedIds | List? | - | 勾选的CheckBox id列表 | +| child | | - | | +| contentDirection | TContentDirection? | - | 文字相对icon的方位 | +| controller | TCheckboxGroupController? | - | 可以通过控制器操作勾选状态 | +| customContentBuilder | ContentBuilder? | - | CheckBox完全自定义内容 | +| customIconBuilder | IconBuilder? | - | 自定义选择icon的样式 | +| key | | - | | +| maxChecked | int? | - | 最多可以勾选多少 | +| onChangeGroup | OnGroupChange? | - | 状态变化监听器 | +| onOverloadChecked | VoidCallback? | - | 超过最大可勾选的个数 | +| spacing | double? | - | CheckBoxicon和文字的距离 | +| style | TCheckboxStyle? | - | CheckBox复选框样式：圆形或方形 | +| titleMaxLine | int? | - | CheckBox标题的行数 | diff --git a/tdesign-component/example/assets/api/dialog_api.md b/tdesign-component/example/assets/api/dialog_api.md index 1130c3590..9dd84999d 100644 --- a/tdesign-component/example/assets/api/dialog_api.md +++ b/tdesign-component/example/assets/api/dialog_api.md @@ -1,26 +1,37 @@ ## API -### TImageDialog +### TAlertDialog #### 默认构造方法 | 参数 | 类型 | 默认值 | 说明 | | --- | --- | --- | --- | | backgroundColor | Color? | - | 背景颜色 | +| buttonStyle | | TDialogButtonStyle.normal | | | buttonWidget | Widget? | - | 自定义按钮 | | content | String? | - | 内容 | | contentColor | Color? | - | 内容颜色 | +| contentMaxHeight | double | 0 | 内容的最大高度，默认为0，也就是不限制高度 | | contentWidget | Widget? | - | 内容Widget | -| image | Image | - | 图片 | -| imagePosition | TDialogImagePosition? | TDialogImagePosition.top | 图片位置 | | key | | - | | | leftBtn | TDialogButtonOptions? | - | 左侧按钮配置 | -| padding | EdgeInsets? | - | 内容内边距 | +| leftBtnAction | Function()? | - | 左侧按钮默认点击 | +| padding | EdgeInsets? | const EdgeInsets.fromLTRB(24, 32, 24, 0) | 内容内边距 | | radius | double | 12.0 | 圆角 | | rightBtn | TDialogButtonOptions? | - | 右侧按钮配置 | +| rightBtnAction | Function()? | - | 右侧按钮默认点击 | | showCloseButton | bool? | - | 显示右上角关闭按钮 | | title | String? | - | 标题 | | titleAlignment | AlignmentGeometry? | - | 标题对齐模式 | | titleColor | Color? | - | 标题颜色 | + +#### 工厂构造方法 + +| 名称 | 说明 | +| --- | --- | +| TAlertDialog.vertical | 纵向按钮排列的对话框 + + [buttons]参数是必须的，纵向按钮默认样式都是[TButtonTheme.primary] | + ``` ``` @@ -52,6 +63,24 @@ ``` ``` +### TDialogButtonOptions +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| action | Function()? | - | 点击操作 | +| fontWeight | FontWeight? | - | 字体粗细 | +| height | double? | - | 按钮高度 | +| style | TButtonStyle? | - | 按钮样式 | +| theme | TButtonTheme? | - | 按钮类型 | +| title | String | - | 标题内容 | +| titleColor | Color? | - | 标题颜色 | +| titleSize | double? | - | 字体大小 | +| type | TButtonType? | - | 按钮类型 | + +``` +``` + ### TDialogScaffold #### 默认构造方法 @@ -154,57 +183,28 @@ ``` ``` -### TDialogButtonOptions -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| action | Function()? | - | 点击操作 | -| fontWeight | FontWeight? | - | 字体粗细 | -| height | double? | - | 按钮高度 | -| style | TButtonStyle? | - | 按钮样式 | -| theme | TButtonTheme? | - | 按钮类型 | -| title | String | - | 标题内容 | -| titleColor | Color? | - | 标题颜色 | -| titleSize | double? | - | 字体大小 | -| type | TButtonType? | - | 按钮类型 | - -``` -``` - -### TAlertDialog +### TImageDialog #### 默认构造方法 | 参数 | 类型 | 默认值 | 说明 | | --- | --- | --- | --- | | backgroundColor | Color? | - | 背景颜色 | -| buttonStyle | | TDialogButtonStyle.normal | | | buttonWidget | Widget? | - | 自定义按钮 | | content | String? | - | 内容 | | contentColor | Color? | - | 内容颜色 | -| contentMaxHeight | double | 0 | 内容的最大高度，默认为0，也就是不限制高度 | | contentWidget | Widget? | - | 内容Widget | +| image | Image | - | 图片 | +| imagePosition | TDialogImagePosition? | TDialogImagePosition.top | 图片位置 | | key | | - | | | leftBtn | TDialogButtonOptions? | - | 左侧按钮配置 | -| leftBtnAction | Function()? | - | 左侧按钮默认点击 | -| padding | EdgeInsets? | const EdgeInsets.fromLTRB(24, 32, 24, 0) | 内容内边距 | +| padding | EdgeInsets? | - | 内容内边距 | | radius | double | 12.0 | 圆角 | | rightBtn | TDialogButtonOptions? | - | 右侧按钮配置 | -| rightBtnAction | Function()? | - | 右侧按钮默认点击 | | showCloseButton | bool? | - | 显示右上角关闭按钮 | | title | String? | - | 标题 | | titleAlignment | AlignmentGeometry? | - | 标题对齐模式 | | titleColor | Color? | - | 标题颜色 | - -#### 工厂构造方法 - -| 名称 | 说明 | -| --- | --- | -| TAlertDialog.vertical | 纵向按钮排列的对话框 - - [buttons]参数是必须的，纵向按钮默认样式都是[TButtonTheme.primary] | - ``` ``` diff --git a/tdesign-component/example/assets/api/drawer_api.md b/tdesign-component/example/assets/api/drawer_api.md index 2f29fa229..6dcef5beb 100644 --- a/tdesign-component/example/assets/api/drawer_api.md +++ b/tdesign-component/example/assets/api/drawer_api.md @@ -1,66 +1,66 @@ ## API -### TDrawerWidget +### TDrawer #### 简介 -抽屉内容组件 - 可用于 Scaffold 中的 drawer 属性 +抽屉组件 #### 默认构造方法 | 参数 | 类型 | 默认值 | 说明 | | --- | --- | --- | --- | | backgroundColor | Color? | - | 组件背景颜色 | | bordered | bool? | true | 是否显示边框 | +| closeOnOverlayClick | bool? | true | 点击蒙层时是否关闭抽屉 | | contentWidget | Widget? | - | 自定义内容，优先级高于[items]/[footer]/[title] | +| context | BuildContext | context | 上下文 | +| drawerTop | double? | - | 距离顶部的距离 | | footer | Widget? | - | 抽屉的底部 | | hover | bool? | true | 是否开启点击反馈 | | isShowLastBordered | bool? | true | 是否显示最后一行分割线 | | items | List? | - | 抽屉里的列表项 | -| key | | - | | +| onClose | VoidCallback? | - | 关闭时触发 | | onItemClick | TDrawerItemClickCallback? | - | 点击抽屉里的列表项触发 | +| placement | TDrawerPlacement? | TDrawerPlacement.right | 抽屉方向 | +| showOverlay | bool? | true | 是否显示遮罩层 | | style | TCellStyle? | - | 列表自定义样式 | | title | String? | - | 抽屉的标题 | | titleWidget | Widget? | - | 抽屉的标题组件 | +| visible | bool? | - | 组件是否可见 | | width | double? | 280 | 宽度 | ``` ``` -### TDrawerItem -#### 简介 -抽屉里的列表项 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| content | Widget? | - | 完全自定义 | -| icon | Widget? | - | 每列图标 | -| title | String? | - | 每列标题 | - -``` -``` - -### TDrawer +### TDrawerWidget #### 简介 -抽屉组件 +抽屉内容组件 + 可用于 Scaffold 中的 drawer 属性 #### 默认构造方法 | 参数 | 类型 | 默认值 | 说明 | | --- | --- | --- | --- | | backgroundColor | Color? | - | 组件背景颜色 | | bordered | bool? | true | 是否显示边框 | -| closeOnOverlayClick | bool? | true | 点击蒙层时是否关闭抽屉 | | contentWidget | Widget? | - | 自定义内容，优先级高于[items]/[footer]/[title] | -| context | BuildContext | context | 上下文 | -| drawerTop | double? | - | 距离顶部的距离 | | footer | Widget? | - | 抽屉的底部 | | hover | bool? | true | 是否开启点击反馈 | | isShowLastBordered | bool? | true | 是否显示最后一行分割线 | | items | List? | - | 抽屉里的列表项 | -| onClose | VoidCallback? | - | 关闭时触发 | +| key | | - | | | onItemClick | TDrawerItemClickCallback? | - | 点击抽屉里的列表项触发 | -| placement | TDrawerPlacement? | TDrawerPlacement.right | 抽屉方向 | -| showOverlay | bool? | true | 是否显示遮罩层 | | style | TCellStyle? | - | 列表自定义样式 | | title | String? | - | 抽屉的标题 | | titleWidget | Widget? | - | 抽屉的标题组件 | -| visible | bool? | - | 组件是否可见 | | width | double? | 280 | 宽度 | + +``` +``` + +### TDrawerItem +#### 简介 +抽屉里的列表项 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| content | Widget? | - | 完全自定义 | +| icon | Widget? | - | 每列图标 | +| title | String? | - | 每列标题 | diff --git a/tdesign-component/example/assets/api/dropdown-menu_api.md b/tdesign-component/example/assets/api/dropdown-menu_api.md index 8b38e08b8..e19bc36b7 100644 --- a/tdesign-component/example/assets/api/dropdown-menu_api.md +++ b/tdesign-component/example/assets/api/dropdown-menu_api.md @@ -1,7 +1,29 @@ ## API -### TDropdownItemController +### TDropdownMenu #### 简介 -下拉菜单控制器 +下拉菜单 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| arrowColor | Color? | - | 自定义箭头颜色 | +| arrowIcon | IconData? | - | 自定义箭头图标 | +| builder | TDropdownItemBuilder? | - | 下拉菜单构建器，优先级高于[items] | +| closeOnClickOverlay | bool? | true | 是否在点击遮罩层后关闭菜单 | +| decoration | Decoration? | - | 下拉菜单的装饰器 | +| direction | TDropdownMenuDirection? | TDropdownMenuDirection.auto | 菜单展开方向（down、up、auto） | +| duration | double? | 200.0 | 动画时长，毫秒 | +| height | double? | 48 | menu的高度 | +| isScrollable | bool? | false | 是否开启滚动列表 | +| items | List? | - | 下拉菜单 | +| key | | - | | +| labelBuilder | LabelBuilder? | - | 自定义标签内容 | +| onMenuClosed | ValueChanged? | - | 关闭菜单事件 | +| onMenuOpened | ValueChanged? | - | 展开菜单事件 | +| showOverlay | bool? | true | 是否显示遮罩层 | +| tabBarAlign | MainAxisAlignment? | MainAxisAlignment.center | [TDropdownItem.label]和[arrowIcon]/[TDropdownItem.arrowIcon]的对齐方式 | +| width | double? | - | menu的宽度 | + ``` ``` @@ -52,27 +74,6 @@ ``` ``` -### TDropdownMenu +### TDropdownItemController #### 简介 -下拉菜单 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| arrowColor | Color? | - | 自定义箭头颜色 | -| arrowIcon | IconData? | - | 自定义箭头图标 | -| builder | TDropdownItemBuilder? | - | 下拉菜单构建器，优先级高于[items] | -| closeOnClickOverlay | bool? | true | 是否在点击遮罩层后关闭菜单 | -| decoration | Decoration? | - | 下拉菜单的装饰器 | -| direction | TDropdownMenuDirection? | TDropdownMenuDirection.auto | 菜单展开方向（down、up、auto） | -| duration | double? | 200.0 | 动画时长，毫秒 | -| height | double? | 48 | menu的高度 | -| isScrollable | bool? | false | 是否开启滚动列表 | -| items | List? | - | 下拉菜单 | -| key | | - | | -| labelBuilder | LabelBuilder? | - | 自定义标签内容 | -| onMenuClosed | ValueChanged? | - | 关闭菜单事件 | -| onMenuOpened | ValueChanged? | - | 展开菜单事件 | -| showOverlay | bool? | true | 是否显示遮罩层 | -| tabBarAlign | MainAxisAlignment? | MainAxisAlignment.center | [TDropdownItem.label]和[arrowIcon]/[TDropdownItem.arrowIcon]的对齐方式 | -| width | double? | - | menu的宽度 | +下拉菜单控制器 \ No newline at end of file diff --git a/tdesign-component/example/assets/api/form_api.md b/tdesign-component/example/assets/api/form_api.md index 9ed8958ae..61922773d 100644 --- a/tdesign-component/example/assets/api/form_api.md +++ b/tdesign-component/example/assets/api/form_api.md @@ -1,4 +1,33 @@ ## API +### TForm +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| btnGroup | List? | - | 表单按钮组 | +| colon | bool? | false | 是否在表单标签字段右侧显示冒号 | +| data | Map | - | 表单数据 | +| disabled | bool | false | 是否禁用整个表单 | +| errorMessage | Object? | - | 表单信息错误信息配置 | +| formContentAlign | TextAlign | TextAlign.left | 表单内容对齐方式: 左对齐、右对齐、居中对齐 | +| formController | FormController? | - | 表单控制器 | +| formLabelAlign | TextAlign? | TextAlign.left | 表单字段标签的对齐方式： | +| formShowErrorMessage | bool? | true | 校验不通过时，是否显示错误提示信息，统一控制全部表单项 | +| isHorizontal | bool | true | 表单排列方式是否为 水平方向 | +| items | List | - | 表单内容 items | +| key | | - | | +| labelWidth | double? | 20.0 | 可以整体设置 label 标签宽度 | +| onReset | Function? | - | 表单重置时触发 | +| onSubmit | Function | - | 表单提交时触发 | +| preventSubmitDefault | bool? | true | 是否阻止表单提交默认事件（表单提交默认事件会刷新页面） | +| requiredMark | bool? | true | 是否显示必填符号（*），默认显示 | +| rules | Map | - | 整个表单字段校验规则 | +| scrollToFirstError | String? | - | 表单校验不通过时，是否自动滚动到第一个校验不通过的字段，平滑滚动或是瞬间直达。 | +| submitWithWarningMessage | bool? | false | 【讨论中】当校验结果只有告警信息时，是否触发 submit 提交事件 | + +``` +``` + ### TFormItem #### 默认构造方法 @@ -39,32 +68,3 @@ | errorMessage | String | - | 错误提示信息 | | type | TFormItemType | - | 校验对象的类型 | | validate | String? Function(dynamic) | - | 校验方法 | - -``` -``` - -### TForm -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| btnGroup | List? | - | 表单按钮组 | -| colon | bool? | false | 是否在表单标签字段右侧显示冒号 | -| data | Map | - | 表单数据 | -| disabled | bool | false | 是否禁用整个表单 | -| errorMessage | Object? | - | 表单信息错误信息配置 | -| formContentAlign | TextAlign | TextAlign.left | 表单内容对齐方式: 左对齐、右对齐、居中对齐 | -| formController | FormController? | - | 表单控制器 | -| formLabelAlign | TextAlign? | TextAlign.left | 表单字段标签的对齐方式： | -| formShowErrorMessage | bool? | true | 校验不通过时，是否显示错误提示信息，统一控制全部表单项 | -| isHorizontal | bool | true | 表单排列方式是否为 水平方向 | -| items | List | - | 表单内容 items | -| key | | - | | -| labelWidth | double? | 20.0 | 可以整体设置 label 标签宽度 | -| onReset | Function? | - | 表单重置时触发 | -| onSubmit | Function | - | 表单提交时触发 | -| preventSubmitDefault | bool? | true | 是否阻止表单提交默认事件（表单提交默认事件会刷新页面） | -| requiredMark | bool? | true | 是否显示必填符号（*），默认显示 | -| rules | Map | - | 整个表单字段校验规则 | -| scrollToFirstError | String? | - | 表单校验不通过时，是否自动滚动到第一个校验不通过的字段，平滑滚动或是瞬间直达。 | -| submitWithWarningMessage | bool? | false | 【讨论中】当校验结果只有告警信息时，是否触发 submit 提交事件 | diff --git a/tdesign-component/example/assets/api/image-viewer_api.md b/tdesign-component/example/assets/api/image-viewer_api.md index 6eecfe432..f36abefb8 100644 --- a/tdesign-component/example/assets/api/image-viewer_api.md +++ b/tdesign-component/example/assets/api/image-viewer_api.md @@ -1,4 +1,15 @@ ## API +### TImageViewer + +#### 静态方法 + +| 名称 | 返回类型 | 参数 | 说明 | +| --- | --- | --- | --- | +| showImageViewer | | required BuildContext context, required List images, List? labels, bool? closeBtn, bool? deleteBtn, bool? showIndex, bool? loop, bool? autoplay, int? duration, Color? bgColor, Color? navBarBgColor, Color? iconColor, TextStyle? labelStyle, TextStyle? indexStyle, Color? modalBarrierColor, bool? barrierDismissible, int? defaultIndex, double? width, double? height, OnIndexChange? onIndexChange, OnClose? onClose, OnDelete? onDelete, bool? ignoreDeleteError, OnImageTap? onTap, OnLongPress? onLongPress, LeftItemBuilder? leftItemBuilder, RightItemBuilder? rightItemBuilder, | 显示图片预览 | + +``` +``` + ### TImageViewerWidget #### 默认构造方法 @@ -29,14 +40,3 @@ | rightItemBuilder | RightItemBuilder? | - | 右侧自定义操作 | | showIndex | bool? | - | 是否显示页码 | | width | double? | - | 图片宽度 | - -``` -``` - -### TImageViewer - -#### 静态方法 - -| 名称 | 返回类型 | 参数 | 说明 | -| --- | --- | --- | --- | -| showImageViewer | | required BuildContext context, required List images, List? labels, bool? closeBtn, bool? deleteBtn, bool? showIndex, bool? loop, bool? autoplay, int? duration, Color? bgColor, Color? navBarBgColor, Color? iconColor, TextStyle? labelStyle, TextStyle? indexStyle, Color? modalBarrierColor, bool? barrierDismissible, int? defaultIndex, double? width, double? height, OnIndexChange? onIndexChange, OnClose? onClose, OnDelete? onDelete, bool? ignoreDeleteError, OnImageTap? onTap, OnLongPress? onLongPress, LeftItemBuilder? leftItemBuilder, RightItemBuilder? rightItemBuilder, | 显示图片预览 | diff --git a/tdesign-component/example/assets/api/indexes_api.md b/tdesign-component/example/assets/api/indexes_api.md index 81168ad22..eeb9a7294 100644 --- a/tdesign-component/example/assets/api/indexes_api.md +++ b/tdesign-component/example/assets/api/indexes_api.md @@ -1,4 +1,28 @@ ## API +### TIndexes +#### 简介 +索引 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| builderAnchor | Widget? Function(BuildContext context, String index, bool isPinnedToTop)? | - | 锚点自定义构建 | +| builderContent | Widget? Function(BuildContext context, String index) | - | 内容自定义构建 | +| builderIndex | Widget Function(BuildContext context, String index, bool isActive)? | - | 索引文本自定义构建，包括索引激活左侧提示 | +| capsuleTheme | bool? | false | 锚点是否为胶囊式样式 | +| indexList | List? | - | 索引字符列表。不传默认 A-Z | +| indexListMaxHeight | double? | 0.8 | 索引列表最大高度（父容器高度的百分比，默认 0.8） | +| key | | - | | +| onChange | void Function(String index)? | - | 索引发生变更时触发事件 | +| onSelect | void Function(String index)? | - | 点击侧边栏时触发事件 | +| reverse | bool? | false | 反方向滚动置顶 | +| scrollController | ScrollController? | - | 滚动控制器 | +| sticky | bool? | true | 锚点是否吸顶 | +| stickyOffset | double? | 0 | 锚点吸顶时与顶部的距离 | + +``` +``` + ### TIndexesAnchor #### 简介 索引锚点 @@ -29,27 +53,3 @@ | indexListMaxHeight | double | 0.8 | 索引列表最大高度（父容器高度的百分比，默认0.8） | | key | | - | | | onSelect | void Function(String newIndex, String oldIndex) | - | 点击侧边栏时触发事件 | - -``` -``` - -### TIndexes -#### 简介 -索引 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| builderAnchor | Widget? Function(BuildContext context, String index, bool isPinnedToTop)? | - | 锚点自定义构建 | -| builderContent | Widget? Function(BuildContext context, String index) | - | 内容自定义构建 | -| builderIndex | Widget Function(BuildContext context, String index, bool isActive)? | - | 索引文本自定义构建，包括索引激活左侧提示 | -| capsuleTheme | bool? | false | 锚点是否为胶囊式样式 | -| indexList | List? | - | 索引字符列表。不传默认 A-Z | -| indexListMaxHeight | double? | 0.8 | 索引列表最大高度（父容器高度的百分比，默认 0.8） | -| key | | - | | -| onChange | void Function(String index)? | - | 索引发生变更时触发事件 | -| onSelect | void Function(String index)? | - | 点击侧边栏时触发事件 | -| reverse | bool? | false | 反方向滚动置顶 | -| scrollController | ScrollController? | - | 滚动控制器 | -| sticky | bool? | true | 锚点是否吸顶 | -| stickyOffset | double? | 0 | 锚点吸顶时与顶部的距离 | diff --git a/tdesign-component/example/assets/api/message_api.md b/tdesign-component/example/assets/api/message_api.md index 6189b22e5..a327735d1 100644 --- a/tdesign-component/example/assets/api/message_api.md +++ b/tdesign-component/example/assets/api/message_api.md @@ -1,28 +1,4 @@ ## API -### MessageLink -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| color | Color? | - | 颜色 | -| name | String | - | 名称 | -| uri | Uri? | - | 资源链接 | - -``` -``` - -### MessageMarquee -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| delay | int? | - | 延迟时间(毫秒) | -| loop | int? | - | 循环次数 | -| speed | int? | - | 速度 | - -``` -``` - ### TMessage #### 默认构造方法 @@ -48,3 +24,27 @@ | 名称 | 返回类型 | 参数 | 说明 | | --- | --- | --- | --- | | showMessage | | required BuildContext context, String? content, bool? visible, int? duration, dynamic closeBtn, dynamic icon, dynamic link, MessageMarquee? marquee, List? offset, MessageTheme? theme, VoidCallback? onCloseBtnClick, VoidCallback? onDurationEnd, VoidCallback? onLinkClick, | | + +``` +``` + +### MessageMarquee +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| delay | int? | - | 延迟时间(毫秒) | +| loop | int? | - | 循环次数 | +| speed | int? | - | 速度 | + +``` +``` + +### MessageLink +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| color | Color? | - | 颜色 | +| name | String | - | 名称 | +| uri | Uri? | - | 资源链接 | diff --git a/tdesign-component/example/assets/api/notice-bar_api.md b/tdesign-component/example/assets/api/notice-bar_api.md index d79c2e5f3..f43768900 100644 --- a/tdesign-component/example/assets/api/notice-bar_api.md +++ b/tdesign-component/example/assets/api/notice-bar_api.md @@ -1,28 +1,4 @@ ## API -### TNoticeBarStyle -#### 简介 -公告栏样式 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| backgroundColor | Color? | - | 公告栏背景色 | -| context | BuildContext? | - | 上下文 | -| leftIconColor | Color? | - | 公告栏左侧图标颜色 | -| padding | EdgeInsetsGeometry? | - | 公告栏内边距 | -| rightIconColor | Color? | - | 公告栏右侧图标颜色 | -| textStyle | TextStyle? | - | 公告栏内容样式 | - - -#### 工厂构造方法 - -| 名称 | 说明 | -| --- | --- | -| TNoticeBarStyle.generateTheme | 根据主题生成样式 | - -``` -``` - ### TNoticeBar #### 简介 @@ -46,3 +22,27 @@ | style | TNoticeBarStyle? | - | 公告栏样式 [TNoticeBarStyle] | | suffixIcon | IconData? | - | 右侧图标 | | theme | TNoticeBarTheme? | TNoticeBarTheme.info | 主题 | + +``` +``` + +### TNoticeBarStyle +#### 简介 +公告栏样式 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| backgroundColor | Color? | - | 公告栏背景色 | +| context | BuildContext? | - | 上下文 | +| leftIconColor | Color? | - | 公告栏左侧图标颜色 | +| padding | EdgeInsetsGeometry? | - | 公告栏内边距 | +| rightIconColor | Color? | - | 公告栏右侧图标颜色 | +| textStyle | TextStyle? | - | 公告栏内容样式 | + + +#### 工厂构造方法 + +| 名称 | 说明 | +| --- | --- | +| TNoticeBarStyle.generateTheme | 根据主题生成样式 | diff --git a/tdesign-component/example/assets/api/picker_api.md b/tdesign-component/example/assets/api/picker_api.md index f1645a9fb..d09bcdf8f 100644 --- a/tdesign-component/example/assets/api/picker_api.md +++ b/tdesign-component/example/assets/api/picker_api.md @@ -1,4 +1,29 @@ ## API +### TPicker +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| cancel | Widget? | - | 工具栏左侧自定义插槽，默认使用 [TResourceDelegate.cancel] | +| confirm | Widget? | - | 工具栏右侧自定义插槽，默认使用 [TResourceDelegate.confirm] | +| disabled | bool | false | 是否禁用整个选择器（禁止滚动和操作），默认 false | +| height | double | 200 | 视窗高度，默认 200 | +| initialValue | List? | - | 初始选中值列表（按 value 匹配） | +| itemBuilder | ItemBuilderType? | - | 自定义子项构建器（disabled 项仍由内部统一渲染，不会走此 builder） | +| itemCount | int | 5 | 每屏显示 item 数，默认 5 | +| itemDistanceCalculator | ItemDistanceCalculator? | - | 自定义距离计算器（控制颜色/字重/字号随"离中心距离"的变化） | +| items | TPickerItems | - | 数据源（必填） | +| key | | - | | +| onCancel | VoidCallback? | - | 点击「取消」按钮回调 | +| onChange | void Function(TPickerValue)? | - | 值改变回调（滚动时实时触发） | +| onConfirm | void Function(TPickerValue)? | - | 点击「确认」按钮回调 | +| onLoad | void Function(TPickerLoadEvent)? | - | 列选中项变化的事件回调 | +| title | String? | - | 工具栏中部标题（可选，不传时中部留白） | +| titleWidget | Widget? | - | 工具栏中部自定义标题插槽 | + +``` +``` + ### TPickerOption #### 默认构造方法 @@ -22,32 +47,16 @@ ``` ``` -### TPicker +### TPickerLoadEvent #### 默认构造方法 | 参数 | 类型 | 默认值 | 说明 | | --- | --- | --- | --- | -| cancel | Widget? | - | 工具栏左侧自定义插槽，默认使用 [TResourceDelegate.cancel] | -| confirm | Widget? | - | 工具栏右侧自定义插槽，默认使用 [TResourceDelegate.confirm] | -| disabled | bool | false | 是否禁用整个选择器（禁止滚动和操作），默认 false | -| height | double | 200 | 视窗高度，默认 200 | -| initialValue | List? | - | 初始选中值列表（按 value 匹配） | -| itemBuilder | ItemBuilderType? | - | 自定义子项构建器（disabled 项仍由内部统一渲染，不会走此 builder） | -| itemCount | int | 5 | 每屏显示 item 数，默认 5 | -| itemDistanceCalculator | ItemDistanceCalculator? | - | 自定义距离计算器（控制颜色/字重/字号随"离中心距离"的变化） | -| items | TPickerItems | - | 数据源（必填） | -| key | | - | | -| onCancel | VoidCallback? | - | 点击「取消」按钮回调 | -| onChange | void Function(TPickerValue)? | - | 值改变回调（滚动时实时触发） | -| onConfirm | void Function(TPickerValue)? | - | 点击「确认」按钮回调 | -| onLoad | void Function(TPickerLoadEvent)? | - | 列选中项变化的事件回调 | -| title | String? | - | 工具栏中部标题（可选，不传时中部留白） | -| titleWidget | Widget? | - | 工具栏中部自定义标题插槽 | - -``` -``` +| column | int | - | 触发事件的列索引（0 表示第一列） | +| displayedCount | int | - | 当前列已展示的选项总数 | +| parentValue | dynamic | - | 当前列的父级选中值（联动模式下使用） | +| remaining | int | - | 距底部剩余的选项数（业务可用此值做"接近底部时加载"判断） | -### TPickerItems ``` ``` @@ -99,6 +108,10 @@ ``` ``` +### TPickerItems +``` +``` + ### TPickerKeys #### 默认构造方法 @@ -108,16 +121,3 @@ | disabled | String | 'disabled' | 禁用标记对应的字段名，默认 `disabled` | | label | String | 'label' | 展示文案对应的字段名，默认 `label` | | value | String | 'value' | 业务值对应的字段名，默认 `value` | - -``` -``` - -### TPickerLoadEvent -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| column | int | - | 触发事件的列索引（0 表示第一列） | -| displayedCount | int | - | 当前列已展示的选项总数 | -| parentValue | dynamic | - | 当前列的父级选中值（联动模式下使用） | -| remaining | int | - | 距底部剩余的选项数（业务可用此值做"接近底部时加载"判断） | diff --git a/tdesign-component/example/assets/api/popover_api.md b/tdesign-component/example/assets/api/popover_api.md index a21397791..0a44f139d 100644 --- a/tdesign-component/example/assets/api/popover_api.md +++ b/tdesign-component/example/assets/api/popover_api.md @@ -1,4 +1,17 @@ ## API +### TPopover +#### 简介 + + +#### 静态方法 + +| 名称 | 返回类型 | 参数 | 说明 | +| --- | --- | --- | --- | +| showPopover | | required BuildContext context, String? content, Widget? contentWidget, double offset, TPopoverTheme? theme, bool closeOnClickOutside, TPopoverPlacement? placement, bool? showArrow, double arrowSize, EdgeInsetsGeometry? padding, double? width, double? height, Color? overlayColor, OnTap? onTap, OnLongTap? onLongTap, BorderRadius? radius, | | + +``` +``` + ### TPopoverWidget #### 简介 @@ -21,16 +34,3 @@ | showArrow | bool? | true | 是否显示浮层箭头 | | theme | TPopoverTheme? | - | 弹出气泡主题 | | width | double? | - | 内容宽度（包含padding，实际高度：height - paddingLeft - paddingRight） | - -``` -``` - -### TPopover -#### 简介 - - -#### 静态方法 - -| 名称 | 返回类型 | 参数 | 说明 | -| --- | --- | --- | --- | -| showPopover | | required BuildContext context, String? content, Widget? contentWidget, double offset, TPopoverTheme? theme, bool closeOnClickOutside, TPopoverPlacement? placement, bool? showArrow, double arrowSize, EdgeInsetsGeometry? padding, double? width, double? height, Color? overlayColor, OnTap? onTap, OnLongTap? onLongTap, BorderRadius? radius, | | diff --git a/tdesign-component/example/assets/api/popup_api.md b/tdesign-component/example/assets/api/popup_api.md index fa6674dd6..8ad1680cc 100644 --- a/tdesign-component/example/assets/api/popup_api.md +++ b/tdesign-component/example/assets/api/popup_api.md @@ -1,4 +1,30 @@ ## API +### TSlidePopupRoute +#### 简介 +从屏幕的某个方向滑动弹出的Dialog框的路由，比如从顶部、底部、左、右滑出页面 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| barrierClick | VoidCallback? | - | 蒙层点击事件，仅在[modalBarrierFull]为false时触发 | +| barrierLabel | | - | | +| builder | WidgetBuilder | - | 控件构建器 | +| close | VoidCallback? | - | 关闭前事件 | +| focusMove | bool | false | 是否有输入框获取焦点时整体平移避免输入框被遮挡 | +| isDismissible | bool | true | 点击蒙层能否关闭 | +| modalBarrierColor | Color? | Colors.black54 | 蒙层颜色 | +| modalBarrierFull | bool | false | 是否全屏显示蒙层 | +| modalHeight | double? | - | 弹出框高度 | +| modalLeft | double? | 0 | 弹出框左侧距离 | +| modalTop | double? | 0 | 弹出框顶部距离 | +| modalWidth | double? | - | 弹出框宽度 | +| open | VoidCallback? | - | 打开前事件 | +| opened | VoidCallback? | - | 打开后事件 | +| slideTransitionFrom | SlideTransitionFrom | SlideTransitionFrom.bottom | 设置从屏幕的哪个方向滑出 | + +``` +``` + ### TPopupBottomDisplayPanel #### 简介 右上角带关闭的底部浮层面板 @@ -69,29 +95,3 @@ | closeUnderBottom | bool | false | 关闭按钮是否在视图框下方 | | key | | - | | | radius | double? | - | 圆角 | - -``` -``` - -### TSlidePopupRoute -#### 简介 -从屏幕的某个方向滑动弹出的Dialog框的路由，比如从顶部、底部、左、右滑出页面 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| barrierClick | VoidCallback? | - | 蒙层点击事件，仅在[modalBarrierFull]为false时触发 | -| barrierLabel | | - | | -| builder | WidgetBuilder | - | 控件构建器 | -| close | VoidCallback? | - | 关闭前事件 | -| focusMove | bool | false | 是否有输入框获取焦点时整体平移避免输入框被遮挡 | -| isDismissible | bool | true | 点击蒙层能否关闭 | -| modalBarrierColor | Color? | Colors.black54 | 蒙层颜色 | -| modalBarrierFull | bool | false | 是否全屏显示蒙层 | -| modalHeight | double? | - | 弹出框高度 | -| modalLeft | double? | 0 | 弹出框左侧距离 | -| modalTop | double? | 0 | 弹出框顶部距离 | -| modalWidth | double? | - | 弹出框宽度 | -| open | VoidCallback? | - | 打开前事件 | -| opened | VoidCallback? | - | 打开后事件 | -| slideTransitionFrom | SlideTransitionFrom | SlideTransitionFrom.bottom | 设置从屏幕的哪个方向滑出 | diff --git a/tdesign-component/example/assets/api/side-bar_api.md b/tdesign-component/example/assets/api/side-bar_api.md index 771c48523..d36520c3d 100644 --- a/tdesign-component/example/assets/api/side-bar_api.md +++ b/tdesign-component/example/assets/api/side-bar_api.md @@ -1,20 +1,4 @@ ## API -### TSideBarItem -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| badge | TBadge? | - | 徽标 | -| disabled | bool | false | 是否禁用 | -| icon | IconData? | - | 图标 | -| key | | - | | -| label | String | '' | 标签 | -| textStyle | TextStyle? | - | 标签样式 | -| value | int | -1 | 值 | - -``` -``` - ### TSideBar #### 默认构造方法 @@ -37,3 +21,19 @@ | unSelectedBgColor | Color? | - | 未选择的背景颜色 | | unSelectedColor | Color? | - | 未选中颜色 | | value | int? | - | 选项值 | + +``` +``` + +### TSideBarItem +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| badge | TBadge? | - | 徽标 | +| disabled | bool | false | 是否禁用 | +| icon | IconData? | - | 图标 | +| key | | - | | +| label | String | '' | 标签 | +| textStyle | TextStyle? | - | 标签样式 | +| value | int | -1 | 值 | diff --git a/tdesign-component/example/assets/api/skeleton_api.md b/tdesign-component/example/assets/api/skeleton_api.md index 2564fd965..7801ab935 100644 --- a/tdesign-component/example/assets/api/skeleton_api.md +++ b/tdesign-component/example/assets/api/skeleton_api.md @@ -1,4 +1,24 @@ ## API +### TSkeleton +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| animation | TSkeletonAnimation? | - | 动画效果 | +| delay | int | 0 | 延迟显示加载时间 | +| key | | - | | +| theme | | TSkeletonTheme.text | | + + +#### 工厂构造方法 + +| 名称 | 说明 | +| --- | --- | +| TSkeleton.fromRowCol | 从行列框架创建骨架屏 | + +``` +``` + ### TSkeletonRowColStyle #### 默认构造方法 @@ -61,23 +81,3 @@ | TSkeletonRowColObj.rect | 矩形 | | TSkeletonRowColObj.spacer | 空白占位符 | | TSkeletonRowColObj.text | 文本 | - -``` -``` - -### TSkeleton -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| animation | TSkeletonAnimation? | - | 动画效果 | -| delay | int | 0 | 延迟显示加载时间 | -| key | | - | | -| theme | | TSkeletonTheme.text | | - - -#### 工厂构造方法 - -| 名称 | 说明 | -| --- | --- | -| TSkeleton.fromRowCol | 从行列框架创建骨架屏 | diff --git a/tdesign-component/example/assets/api/steps_api.md b/tdesign-component/example/assets/api/steps_api.md index 20601365b..62115981f 100644 --- a/tdesign-component/example/assets/api/steps_api.md +++ b/tdesign-component/example/assets/api/steps_api.md @@ -1,19 +1,4 @@ ## API -### TStepsItemData -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| content | String? | - | 内容 | -| customContent | Widget? | - | 自定义内容 | -| customTitle | Widget? | - | 自定义标题 | -| errorIcon | IconData? | - | 失败图标 | -| successIcon | IconData? | - | 成功图标 | -| title | String? | - | 标题 | - -``` -``` - ### TSteps #### 默认构造方法 @@ -27,3 +12,18 @@ | status | TStepsStatus | TStepsStatus.success | 步骤条状态 | | steps | List | - | 步骤条数据 | | verticalSelect | bool | false | 步骤条垂直自定义步骤条选择模式 | + +``` +``` + +### TStepsItemData +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| content | String? | - | 内容 | +| customContent | Widget? | - | 自定义内容 | +| customTitle | Widget? | - | 自定义标题 | +| errorIcon | IconData? | - | 失败图标 | +| successIcon | IconData? | - | 成功图标 | +| title | String? | - | 标题 | diff --git a/tdesign-component/example/assets/api/swiper_api.md b/tdesign-component/example/assets/api/swiper_api.md index 29b0af3fb..5a23bdff5 100644 --- a/tdesign-component/example/assets/api/swiper_api.md +++ b/tdesign-component/example/assets/api/swiper_api.md @@ -1,4 +1,19 @@ ## API +### TSwiperPagination +#### 简介 +TDesign风格的Swiper指示器样式，与flutter_swiper的Swiper结合使用 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| alignment | Alignment? | - | 当 scrollDirection== Axis.horizontal 时，默认Alignment.bottomCenter | +| builder | SwiperPlugin | TSwiperPagination.dots | 具体样式 | +| key | Key? | - | | +| margin | EdgeInsetsGeometry | const EdgeInsets.all(10.0) | 指示器和container之间的距离 | + +``` +``` + ### TPageTransformer #### 简介 TD默认PageTransformer @@ -17,18 +32,3 @@ TD默认PageTransformer | --- | --- | | TPageTransformer.margin | 普通margin的卡片式 | | TPageTransformer.scaleAndFade | 缩放或透明的卡片式 | - -``` -``` - -### TSwiperPagination -#### 简介 -TDesign风格的Swiper指示器样式，与flutter_swiper的Swiper结合使用 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| alignment | Alignment? | - | 当 scrollDirection== Axis.horizontal 时，默认Alignment.bottomCenter | -| builder | SwiperPlugin | TSwiperPagination.dots | 具体样式 | -| key | Key? | - | | -| margin | EdgeInsetsGeometry | const EdgeInsets.all(10.0) | 指示器和container之间的距离 | diff --git a/tdesign-component/example/assets/api/tab-bar_api.md b/tdesign-component/example/assets/api/tab-bar_api.md index 84f4e5365..dad57643b 100644 --- a/tdesign-component/example/assets/api/tab-bar_api.md +++ b/tdesign-component/example/assets/api/tab-bar_api.md @@ -1,36 +1,4 @@ ## API -### BadgeConfig -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| badgeRightOffset | double? | - | 消息右侧偏移量 | -| badgeTopOffset | double? | - | 消息顶部偏移量 | -| showBadge | bool | - | 是否展示消息 | -| tBadge | TBadge? | - | 消息样式（未设置但 showBadge 为 true，则默认使用红点） | - -``` -``` - -### TBottomTabBarTabConfig -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| allowMultipleTaps | bool | false | onTap 方法允许点击多次 | -| badgeConfig | BadgeConfig? | - | 消息配置 | -| onLongPress | GestureLongPressCallback? | - | 长按事件 | -| onTap | GestureTapCallback? | - | tab点击事件 | -| popUpButtonConfig | TBottomTabBarPopUpBtnConfig? | - | 弹窗配置 | -| selectedIcon | Widget? | - | 选中时图标 | -| selectTabTextStyle | TextStyle? | - | 文本已选择样式 basicType为text时必填 | -| tabText | String? | - | tab 文本 | -| unselectedIcon | Widget? | - | 未选中时图标 | -| unselectTabTextStyle | TextStyle? | - | 文本未选择样式 basicType为text时必填 | - -``` -``` - ### TBottomTabBar #### 默认构造方法 @@ -63,6 +31,38 @@ ``` ``` +### BadgeConfig +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| badgeRightOffset | double? | - | 消息右侧偏移量 | +| badgeTopOffset | double? | - | 消息顶部偏移量 | +| showBadge | bool | - | 是否展示消息 | +| tBadge | TBadge? | - | 消息样式（未设置但 showBadge 为 true，则默认使用红点） | + +``` +``` + +### TBottomTabBarTabConfig +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| allowMultipleTaps | bool | false | onTap 方法允许点击多次 | +| badgeConfig | BadgeConfig? | - | 消息配置 | +| onLongPress | GestureLongPressCallback? | - | 长按事件 | +| onTap | GestureTapCallback? | - | tab点击事件 | +| popUpButtonConfig | TBottomTabBarPopUpBtnConfig? | - | 弹窗配置 | +| selectedIcon | Widget? | - | 选中时图标 | +| selectTabTextStyle | TextStyle? | - | 文本已选择样式 basicType为text时必填 | +| tabText | String? | - | tab 文本 | +| unselectedIcon | Widget? | - | 未选中时图标 | +| unselectTabTextStyle | TextStyle? | - | 文本未选择样式 basicType为text时必填 | + +``` +``` + ### TBottomTabBarPopUpBtnConfig #### 默认构造方法 diff --git a/tdesign-component/example/assets/api/tabs_api.md b/tdesign-component/example/assets/api/tabs_api.md index d6029cae2..abc320633 100644 --- a/tdesign-component/example/assets/api/tabs_api.md +++ b/tdesign-component/example/assets/api/tabs_api.md @@ -1,17 +1,4 @@ ## API -### TTabBarView -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| children | List | - | 子widget列表 | -| controller | TabController? | - | 控制器 | -| isSlideSwitch | bool | false | 是否可以滑动切换 | -| key | | - | | - -``` -``` - ### TTabBar #### 默认构造方法 @@ -65,3 +52,18 @@ | size | TTabSize | TTabSize.small | 选项卡尺寸 | | text | String? | - | 文字内容 | | textMargin | EdgeInsetsGeometry? | - | 中间内容宽度 | + +``` +``` + +### TTabBarView +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| animationDuration | Duration | const Duration(milliseconds: 300) | 高度自适应模式下的过渡动画时长（默认 300ms） | +| autoHeight | bool | false | 是否开启高度自适应（默认 false，保持向后兼容） | +| children | List | - | 子 widget 列表（每一项对应一个 tab 页的内容） | +| controller | TabController? | - | Tab 控制器，用于和外部 [TabBar] 联动 | +| isSlideSwitch | bool | false | 是否可以左右滑动切换 tab 页 | +| key | | - | | diff --git a/tdesign-component/example/assets/api/time-counter_api.md b/tdesign-component/example/assets/api/time-counter_api.md index 3b469863f..574d84ddb 100644 --- a/tdesign-component/example/assets/api/time-counter_api.md +++ b/tdesign-component/example/assets/api/time-counter_api.md @@ -1,4 +1,29 @@ ## API +### TTimeCounter +#### 简介 +计时组件 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| autoStart | bool | true | 是否自动开始倒计时 | +| content | dynamic | 'default' | 'default' / Widget Function(int time) / Widget | +| controller | TTimeCounterController? | - | 控制器，可控制开始/暂停/继续/重置 | +| direction | TTimeCounterDirection | TTimeCounterDirection.down | 计时方向，默认倒计时 | +| format | String | 'HH:mm:ss' | 时间格式，DD-日，HH-时，mm-分，ss-秒，SSS-毫秒（分隔符必须为长度为1的非空格的字符） | +| key | | - | | +| millisecond | bool | false | 是否开启毫秒级渲染 | +| onChange | Function(int time)? | - | 时间变化时触发回调 | +| onFinish | VoidCallback? | - | 计时结束时触发回调 | +| size | TTimeCounterSize | TTimeCounterSize.medium | 尺寸 | +| splitWithUnit | bool | false | 使用时间单位分割 | +| style | TTimeCounterStyle? | - | 自定义样式，有则优先用它，没有则根据size和theme选取 | +| theme | TTimeCounterTheme | TTimeCounterTheme.defaultTheme | 风格 | +| time | int | - | 必需；计时时长，单位毫秒 | + +``` +``` + ### TTimeCounterController #### 简介 倒计时组件控制器，可控制开始(`start()`)/暂停(`pause()`)/继续(`resume()`)/重置(`reset([int? time])`) @@ -34,28 +59,3 @@ | 名称 | 说明 | | --- | --- | | TTimeCounterStyle.generateStyle | 生成默认样式 | - -``` -``` - -### TTimeCounter -#### 简介 -计时组件 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| autoStart | bool | true | 是否自动开始倒计时 | -| content | dynamic | 'default' | 'default' / Widget Function(int time) / Widget | -| controller | TTimeCounterController? | - | 控制器，可控制开始/暂停/继续/重置 | -| direction | TTimeCounterDirection | TTimeCounterDirection.down | 计时方向，默认倒计时 | -| format | String | 'HH:mm:ss' | 时间格式，DD-日，HH-时，mm-分，ss-秒，SSS-毫秒（分隔符必须为长度为1的非空格的字符） | -| key | | - | | -| millisecond | bool | false | 是否开启毫秒级渲染 | -| onChange | Function(int time)? | - | 时间变化时触发回调 | -| onFinish | VoidCallback? | - | 计时结束时触发回调 | -| size | TTimeCounterSize | TTimeCounterSize.medium | 尺寸 | -| splitWithUnit | bool | false | 使用时间单位分割 | -| style | TTimeCounterStyle? | - | 自定义样式，有则优先用它，没有则根据size和theme选取 | -| theme | TTimeCounterTheme | TTimeCounterTheme.defaultTheme | 风格 | -| time | int | - | 必需；计时时长，单位毫秒 | diff --git a/tdesign-component/example/assets/api/tree-select_api.md b/tdesign-component/example/assets/api/tree-select_api.md index 9be631027..7ac293da2 100644 --- a/tdesign-component/example/assets/api/tree-select_api.md +++ b/tdesign-component/example/assets/api/tree-select_api.md @@ -1,19 +1,4 @@ ## API -### TSelectOption -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| children | List | const [] | 子选项 | -| columnWidth | double? | - | 自定义宽度，允许用户指定每个选项的宽度 | -| label | String | - | 标签 | -| maxLines | int | 1 | 最大显示行数 | -| multiple | bool | false | 当前子项支持多选 | -| value | dynamic | - | 值 | - -``` -``` - ### TTreeSelect #### 默认构造方法 @@ -27,3 +12,18 @@ | options | List | const [] | 展示的选项列表 | | outwardCornerRadius | double | 9 | 一级菜单选中项的外弯折圆角半径，默认为 9 | | style | TTreeSelectStyle | TTreeSelectStyle.normal | 一级菜单样式 | + +``` +``` + +### TSelectOption +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| children | List | const [] | 子选项 | +| columnWidth | double? | - | 自定义宽度，允许用户指定每个选项的宽度 | +| label | String | - | 标签 | +| maxLines | int | 1 | 最大显示行数 | +| multiple | bool | false | 当前子项支持多选 | +| value | dynamic | - | 值 | diff --git a/tdesign-component/example/assets/code/tabs._buildItemWithAutoHeight.txt b/tdesign-component/example/assets/code/tabs._buildItemWithAutoHeight.txt new file mode 100644 index 000000000..32e44e2c0 --- /dev/null +++ b/tdesign-component/example/assets/code/tabs._buildItemWithAutoHeight.txt @@ -0,0 +1,44 @@ + + Widget _buildItemWithAutoHeight(BuildContext context) { + // 演示 issue #519 的修复：开启 autoHeight 后，外部无需再包 SizedBox + // 显式设置高度，TTabBarView 会根据当前激活 tab 的子内容高度自适应， + // 切换 tab 时高度会平滑过渡。 + var tabController = TabController(length: 3, vsync: this); + // 三个子内容高度故意不同，用于观察外层容器的高度过渡效果 + final autoHeightTabViews = [ + Container( + height: 100, + color: const Color(0xFFE3F0FF), + alignment: Alignment.center, + child: const TText('内容区 1（高度 100）'), + ), + Container( + height: 200, + color: const Color(0xFFE8F7E3), + alignment: Alignment.center, + child: const TText('内容区 2（高度 200）'), + ), + Container( + height: 150, + color: const Color(0xFFFFF5E0), + alignment: Alignment.center, + child: const TText('内容区 3（高度 150）'), + ), + ]; + return Column( + children: [ + TTabBar( + tabs: subList(3), + controller: tabController, + showIndicator: true, + isScrollable: false, + ), + // 此处未给 TTabBarView 包 SizedBox、也未指定 height + TTabBarView( + autoHeight: true, + controller: tabController, + children: autoHeightTabViews, + ), + ], + ); + } \ No newline at end of file diff --git a/tdesign-site/src/action-sheet/README.md b/tdesign-site/src/action-sheet/README.md index 7ed941f9a..79a1a954c 100644 --- a/tdesign-site/src/action-sheet/README.md +++ b/tdesign-site/src/action-sheet/README.md @@ -887,6 +887,25 @@ Widget _buildIconListLeftActionSheet(BuildContext context) { ## API +### TActionSheetItem +#### 简介 +动作面板项目 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| badge | TBadge? | - | 角标 | +| description | String? | - | 描述信息 | +| disabled | bool | false | 是否禁用 | +| group | String? | - | 分组，用于带描述多行滚动宫格 | +| icon | Widget? | - | 图标 | +| iconSize | double? | - | 图标大小 | +| label | String | - | 标题 | +| textStyle | TextStyle? | - | 标题样式 | + +``` +``` + ### TActionSheet #### 简介 动作面板 @@ -924,24 +943,5 @@ Widget _buildIconListLeftActionSheet(BuildContext context) { | showGroupActionSheet | | required BuildContext context, required List items, TActionSheetAlign align, String? cancelText, bool showCancel, TActionSheetItemCallback? onSelected, bool showOverlay, bool closeOnOverlayClick, double itemHeight, double itemMinWidth, VoidCallback? onCancel, VoidCallback? onClose, bool useSafeArea, | 显示分组类型面板 | | showListActionSheet | | required BuildContext context, required List items, TActionSheetAlign align, String? cancelText, bool showCancel, VoidCallback? onCancel, TActionSheetItemCallback? onSelected, bool showOverlay, bool closeOnOverlayClick, VoidCallback? onClose, bool useSafeArea, | 显示列表类型面板 | -``` -``` - -### TActionSheetItem -#### 简介 -动作面板项目 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| badge | TBadge? | - | 角标 | -| description | String? | - | 描述信息 | -| disabled | bool | false | 是否禁用 | -| group | String? | - | 分组，用于带描述多行滚动宫格 | -| icon | Widget? | - | 图标 | -| iconSize | double? | - | 图标大小 | -| label | String | - | 标题 | -| textStyle | TextStyle? | - | 标题样式 | - \ No newline at end of file diff --git a/tdesign-site/src/button/README.md b/tdesign-site/src/button/README.md index cf08aad1a..b21519c3a 100644 --- a/tdesign-site/src/button/README.md +++ b/tdesign-site/src/button/README.md @@ -738,31 +738,6 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ## API -### TButtonStyle -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| backgroundColor | Color? | - | 背景颜色 | -| frameColor | Color? | - | 边框颜色 | -| frameWidth | double? | - | 边框宽度 | -| gradient | Gradient? | - | 渐变背景色 | -| radius | BorderRadiusGeometry? | - | 自定义圆角 | -| textColor | Color? | - | 文字颜色 | - - -#### 工厂构造方法 - -| 名称 | 说明 | -| --- | --- | -| TButtonStyle.generateFillStyleByTheme | 生成不同主题的填充按钮样式 | -| TButtonStyle.generateGhostStyleByTheme | 生成不同主题的幽灵按钮样式 | -| TButtonStyle.generateOutlineStyleByTheme | 生成不同主题的描边按钮样式 | -| TButtonStyle.generateTextStyleByTheme | 生成不同主题的文本按钮样式 | - -``` -``` - ### TButton #### 默认构造方法 @@ -794,5 +769,30 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; | type | TButtonType | TButtonType.fill | 类型：填充，描边，文字 | | width | double? | - | 自定义宽度 | +``` +``` + +### TButtonStyle +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| backgroundColor | Color? | - | 背景颜色 | +| frameColor | Color? | - | 边框颜色 | +| frameWidth | double? | - | 边框宽度 | +| gradient | Gradient? | - | 渐变背景色 | +| radius | BorderRadiusGeometry? | - | 自定义圆角 | +| textColor | Color? | - | 文字颜色 | + + +#### 工厂构造方法 + +| 名称 | 说明 | +| --- | --- | +| TButtonStyle.generateFillStyleByTheme | 生成不同主题的填充按钮样式 | +| TButtonStyle.generateGhostStyleByTheme | 生成不同主题的幽灵按钮样式 | +| TButtonStyle.generateOutlineStyleByTheme | 生成不同主题的描边按钮样式 | +| TButtonStyle.generateTextStyleByTheme | 生成不同主题的文本按钮样式 | + \ No newline at end of file diff --git a/tdesign-site/src/calendar/README.md b/tdesign-site/src/calendar/README.md index c4577e694..5d05d7424 100644 --- a/tdesign-site/src/calendar/README.md +++ b/tdesign-site/src/calendar/README.md @@ -1445,34 +1445,6 @@ Widget _buildLunar(BuildContext context) { ## API -### TCalendarStyle -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| cellDecoration | BoxDecoration? | - | 日期decoration | -| cellPrefixStyle | TextStyle? | - | 日期前面的字符串的样式 | -| cellStyle | TextStyle? | - | 日期样式 | -| cellSuffixStyle | TextStyle? | - | 日期后面的字符串的样式 | -| centreColor | Color? | - | 日期范围内背景样式 | -| decoration | | - | | -| monthTitleStyle | TextStyle? | - | body区域 年月文字样式 | -| titleCloseColor | Color? | - | header区域 关闭图标的颜色 | -| titleMaxLine | int? | - | header区域 [TCalendar.title]的行数 | -| titleStyle | TextStyle? | - | header区域 [TCalendar.title]的样式 | -| weekdayStyle | TextStyle? | - | header区域 周 文字样式 | - - -#### 工厂构造方法 - -| 名称 | 说明 | -| --- | --- | -| TCalendarStyle.cellStyle | 日期样式 | -| TCalendarStyle.generateStyle | 生成默认样式 | - -``` -``` - ### TCalendar #### 默认构造方法 @@ -1515,10 +1487,6 @@ Widget _buildLunar(BuildContext context) { ``` ``` -### TCalendarDataSource -``` -``` - ### TCalendarPopup #### 默认构造方法 @@ -1537,6 +1505,38 @@ Widget _buildLunar(BuildContext context) { ``` ``` +### TCalendarStyle +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| cellDecoration | BoxDecoration? | - | 日期decoration | +| cellPrefixStyle | TextStyle? | - | 日期前面的字符串的样式 | +| cellStyle | TextStyle? | - | 日期样式 | +| cellSuffixStyle | TextStyle? | - | 日期后面的字符串的样式 | +| centreColor | Color? | - | 日期范围内背景样式 | +| decoration | | - | | +| monthTitleStyle | TextStyle? | - | body区域 年月文字样式 | +| titleCloseColor | Color? | - | header区域 关闭图标的颜色 | +| titleMaxLine | int? | - | header区域 [TCalendar.title]的行数 | +| titleStyle | TextStyle? | - | header区域 [TCalendar.title]的样式 | +| weekdayStyle | TextStyle? | - | header区域 周 文字样式 | + + +#### 工厂构造方法 + +| 名称 | 说明 | +| --- | --- | +| TCalendarStyle.cellStyle | 日期样式 | +| TCalendarStyle.generateStyle | 生成默认样式 | + +``` +``` + +### TCalendarDataSource +``` +``` + ### TLunarInfo #### 默认构造方法 diff --git a/tdesign-site/src/cell/README.md b/tdesign-site/src/cell/README.md index 1dbddbd7a..163f51ad7 100644 --- a/tdesign-site/src/cell/README.md +++ b/tdesign-site/src/cell/README.md @@ -158,6 +158,45 @@ Widget _buildCard(BuildContext context) { ## API +### TCell +#### 简介 +单元格组件 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| align | TCellAlign? | TCellAlign.middle | 内容的对齐方式，默认居中对齐。可选项：top/middle/bottom | +| arrow | bool? | false | 是否显示右侧箭头 | +| bordered | bool? | true | 是否显示下边框，仅在TCellGroup组件下起作用 | +| description | String? | - | 下方内容描述文字 | +| descriptionWidget | Widget? | - | 下方内容描述组件 | +| disabled | bool? | false | 禁用 | +| height | double? | - | 高度 | +| hover | bool? | true | 是否开启点击反馈 | +| image | ImageProvider? | - | 主图 | +| imageCircle | double? | 50 | 主图圆角，默认50（圆形） | +| imageSize | double? | - | 主图尺寸 | +| imageWidget | Widget? | - | 主图组件 | +| key | | - | | +| leftIcon | IconData? | - | 左侧图标，出现在单元格标题的左侧 | +| leftIconWidget | Widget? | - | 左侧图标组件 | +| note | String? | - | 和标题同行的说明文字 | +| noteMaxLine | int | 1 | 说明文字组件 最大行数 | +| noteMaxWidth | double? | - | 说明文字组件 最大宽度，超过部分显示省略号，防止文字溢出 | +| noteWidget | Widget? | - | 说明文字组件 | +| onClick | TCellClick? | - | 点击事件 | +| onLongPress | TCellClick? | - | 长按事件 | +| required | bool? | false | 是否显示表单必填星号 | +| rightIcon | IconData? | - | 最右侧图标 | +| rightIconWidget | Widget? | - | 最右侧图标组件 | +| showBottomBorder | bool? | false | 是否显示下边框（建议TCellGroup组件下false，避免与bordered重叠） | +| style | TCellStyle? | - | 自定义样式 | +| title | String? | - | 标题 | +| titleWidget | Widget? | - | 标题组件 | + +``` +``` + ### TCellGroup #### 简介 单元格组组件 @@ -212,44 +251,5 @@ Widget _buildCard(BuildContext context) { | --- | --- | | TCellStyle.cellStyle | 生成单元格默认样式 | -``` -``` - -### TCell -#### 简介 -单元格组件 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| align | TCellAlign? | TCellAlign.middle | 内容的对齐方式，默认居中对齐。可选项：top/middle/bottom | -| arrow | bool? | false | 是否显示右侧箭头 | -| bordered | bool? | true | 是否显示下边框，仅在TCellGroup组件下起作用 | -| description | String? | - | 下方内容描述文字 | -| descriptionWidget | Widget? | - | 下方内容描述组件 | -| disabled | bool? | false | 禁用 | -| height | double? | - | 高度 | -| hover | bool? | true | 是否开启点击反馈 | -| image | ImageProvider? | - | 主图 | -| imageCircle | double? | 50 | 主图圆角，默认50（圆形） | -| imageSize | double? | - | 主图尺寸 | -| imageWidget | Widget? | - | 主图组件 | -| key | | - | | -| leftIcon | IconData? | - | 左侧图标，出现在单元格标题的左侧 | -| leftIconWidget | Widget? | - | 左侧图标组件 | -| note | String? | - | 和标题同行的说明文字 | -| noteMaxLine | int | 1 | 说明文字组件 最大行数 | -| noteMaxWidth | double? | - | 说明文字组件 最大宽度，超过部分显示省略号，防止文字溢出 | -| noteWidget | Widget? | - | 说明文字组件 | -| onClick | TCellClick? | - | 点击事件 | -| onLongPress | TCellClick? | - | 长按事件 | -| required | bool? | false | 是否显示表单必填星号 | -| rightIcon | IconData? | - | 最右侧图标 | -| rightIconWidget | Widget? | - | 最右侧图标组件 | -| showBottomBorder | bool? | false | 是否显示下边框（建议TCellGroup组件下false，避免与bordered重叠） | -| style | TCellStyle? | - | 自定义样式 | -| title | String? | - | 标题 | -| titleWidget | Widget? | - | 标题组件 | - \ No newline at end of file diff --git a/tdesign-site/src/checkbox/README.md b/tdesign-site/src/checkbox/README.md index 3ee440e7c..3fde5c091 100644 --- a/tdesign-site/src/checkbox/README.md +++ b/tdesign-site/src/checkbox/README.md @@ -426,28 +426,6 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ## API -### TCheckboxGroup -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| checkedIds | List? | - | 勾选的CheckBox id列表 | -| child | | - | | -| contentDirection | TContentDirection? | - | 文字相对icon的方位 | -| controller | TCheckboxGroupController? | - | 可以通过控制器操作勾选状态 | -| customContentBuilder | ContentBuilder? | - | CheckBox完全自定义内容 | -| customIconBuilder | IconBuilder? | - | 自定义选择icon的样式 | -| key | | - | | -| maxChecked | int? | - | 最多可以勾选多少 | -| onChangeGroup | OnGroupChange? | - | 状态变化监听器 | -| onOverloadChecked | VoidCallback? | - | 超过最大可勾选的个数 | -| spacing | double? | - | CheckBoxicon和文字的距离 | -| style | TCheckboxStyle? | - | CheckBox复选框样式：圆形或方形 | -| titleMaxLine | int? | - | CheckBox标题的行数 | - -``` -``` - ### TCheckbox #### 默认构造方法 @@ -481,5 +459,27 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; | titleFont | Font? | - | 标题字体大小 | | titleMaxLine | int? | - | 标题的行数 | +``` +``` + +### TCheckboxGroup +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| checkedIds | List? | - | 勾选的CheckBox id列表 | +| child | | - | | +| contentDirection | TContentDirection? | - | 文字相对icon的方位 | +| controller | TCheckboxGroupController? | - | 可以通过控制器操作勾选状态 | +| customContentBuilder | ContentBuilder? | - | CheckBox完全自定义内容 | +| customIconBuilder | IconBuilder? | - | 自定义选择icon的样式 | +| key | | - | | +| maxChecked | int? | - | 最多可以勾选多少 | +| onChangeGroup | OnGroupChange? | - | 状态变化监听器 | +| onOverloadChecked | VoidCallback? | - | 超过最大可勾选的个数 | +| spacing | double? | - | CheckBoxicon和文字的距离 | +| style | TCheckboxStyle? | - | CheckBox复选框样式：圆形或方形 | +| titleMaxLine | int? | - | CheckBox标题的行数 | + \ No newline at end of file diff --git a/tdesign-site/src/dialog/README.md b/tdesign-site/src/dialog/README.md index 4eaa73dcf..287b1a962 100644 --- a/tdesign-site/src/dialog/README.md +++ b/tdesign-site/src/dialog/README.md @@ -703,28 +703,39 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ## API -### TImageDialog +### TAlertDialog #### 默认构造方法 | 参数 | 类型 | 默认值 | 说明 | | --- | --- | --- | --- | | backgroundColor | Color? | - | 背景颜色 | +| buttonStyle | | TDialogButtonStyle.normal | | | buttonWidget | Widget? | - | 自定义按钮 | | content | String? | - | 内容 | | contentColor | Color? | - | 内容颜色 | +| contentMaxHeight | double | 0 | 内容的最大高度，默认为0，也就是不限制高度 | | contentWidget | Widget? | - | 内容Widget | -| image | Image | - | 图片 | -| imagePosition | TDialogImagePosition? | TDialogImagePosition.top | 图片位置 | | key | | - | | | leftBtn | TDialogButtonOptions? | - | 左侧按钮配置 | -| padding | EdgeInsets? | - | 内容内边距 | +| leftBtnAction | Function()? | - | 左侧按钮默认点击 | +| padding | EdgeInsets? | const EdgeInsets.fromLTRB(24, 32, 24, 0) | 内容内边距 | | radius | double | 12.0 | 圆角 | | rightBtn | TDialogButtonOptions? | - | 右侧按钮配置 | +| rightBtnAction | Function()? | - | 右侧按钮默认点击 | | showCloseButton | bool? | - | 显示右上角关闭按钮 | | title | String? | - | 标题 | | titleAlignment | AlignmentGeometry? | - | 标题对齐模式 | | titleColor | Color? | - | 标题颜色 | + +#### 工厂构造方法 + +| 名称 | 说明 | +| --- | --- | +| TAlertDialog.vertical | 纵向按钮排列的对话框 + + [buttons]参数是必须的，纵向按钮默认样式都是[TButtonTheme.primary] | + ``` ``` @@ -756,6 +767,24 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ``` ``` +### TDialogButtonOptions +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| action | Function()? | - | 点击操作 | +| fontWeight | FontWeight? | - | 字体粗细 | +| height | double? | - | 按钮高度 | +| style | TButtonStyle? | - | 按钮样式 | +| theme | TButtonTheme? | - | 按钮类型 | +| title | String | - | 标题内容 | +| titleColor | Color? | - | 标题颜色 | +| titleSize | double? | - | 字体大小 | +| type | TButtonType? | - | 按钮类型 | + +``` +``` + ### TDialogScaffold #### 默认构造方法 @@ -858,57 +887,28 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ``` ``` -### TDialogButtonOptions -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| action | Function()? | - | 点击操作 | -| fontWeight | FontWeight? | - | 字体粗细 | -| height | double? | - | 按钮高度 | -| style | TButtonStyle? | - | 按钮样式 | -| theme | TButtonTheme? | - | 按钮类型 | -| title | String | - | 标题内容 | -| titleColor | Color? | - | 标题颜色 | -| titleSize | double? | - | 字体大小 | -| type | TButtonType? | - | 按钮类型 | - -``` -``` - -### TAlertDialog +### TImageDialog #### 默认构造方法 | 参数 | 类型 | 默认值 | 说明 | | --- | --- | --- | --- | | backgroundColor | Color? | - | 背景颜色 | -| buttonStyle | | TDialogButtonStyle.normal | | | buttonWidget | Widget? | - | 自定义按钮 | | content | String? | - | 内容 | | contentColor | Color? | - | 内容颜色 | -| contentMaxHeight | double | 0 | 内容的最大高度，默认为0，也就是不限制高度 | | contentWidget | Widget? | - | 内容Widget | +| image | Image | - | 图片 | +| imagePosition | TDialogImagePosition? | TDialogImagePosition.top | 图片位置 | | key | | - | | | leftBtn | TDialogButtonOptions? | - | 左侧按钮配置 | -| leftBtnAction | Function()? | - | 左侧按钮默认点击 | -| padding | EdgeInsets? | const EdgeInsets.fromLTRB(24, 32, 24, 0) | 内容内边距 | +| padding | EdgeInsets? | - | 内容内边距 | | radius | double | 12.0 | 圆角 | | rightBtn | TDialogButtonOptions? | - | 右侧按钮配置 | -| rightBtnAction | Function()? | - | 右侧按钮默认点击 | | showCloseButton | bool? | - | 显示右上角关闭按钮 | | title | String? | - | 标题 | | titleAlignment | AlignmentGeometry? | - | 标题对齐模式 | | titleColor | Color? | - | 标题颜色 | - -#### 工厂构造方法 - -| 名称 | 说明 | -| --- | --- | -| TAlertDialog.vertical | 纵向按钮排列的对话框 - - [buttons]参数是必须的，纵向按钮默认样式都是[TButtonTheme.primary] | - ``` ``` diff --git a/tdesign-site/src/drawer/README.md b/tdesign-site/src/drawer/README.md index a203ebfba..1e4ad50dd 100644 --- a/tdesign-site/src/drawer/README.md +++ b/tdesign-site/src/drawer/README.md @@ -285,71 +285,71 @@ Widget _buildBottomSimple(BuildContext context) { ## API -### TDrawerWidget +### TDrawer #### 简介 -抽屉内容组件 - 可用于 Scaffold 中的 drawer 属性 +抽屉组件 #### 默认构造方法 | 参数 | 类型 | 默认值 | 说明 | | --- | --- | --- | --- | | backgroundColor | Color? | - | 组件背景颜色 | | bordered | bool? | true | 是否显示边框 | +| closeOnOverlayClick | bool? | true | 点击蒙层时是否关闭抽屉 | | contentWidget | Widget? | - | 自定义内容，优先级高于[items]/[footer]/[title] | +| context | BuildContext | context | 上下文 | +| drawerTop | double? | - | 距离顶部的距离 | | footer | Widget? | - | 抽屉的底部 | | hover | bool? | true | 是否开启点击反馈 | | isShowLastBordered | bool? | true | 是否显示最后一行分割线 | | items | List? | - | 抽屉里的列表项 | -| key | | - | | +| onClose | VoidCallback? | - | 关闭时触发 | | onItemClick | TDrawerItemClickCallback? | - | 点击抽屉里的列表项触发 | +| placement | TDrawerPlacement? | TDrawerPlacement.right | 抽屉方向 | +| showOverlay | bool? | true | 是否显示遮罩层 | | style | TCellStyle? | - | 列表自定义样式 | | title | String? | - | 抽屉的标题 | | titleWidget | Widget? | - | 抽屉的标题组件 | +| visible | bool? | - | 组件是否可见 | | width | double? | 280 | 宽度 | ``` ``` -### TDrawerItem -#### 简介 -抽屉里的列表项 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| content | Widget? | - | 完全自定义 | -| icon | Widget? | - | 每列图标 | -| title | String? | - | 每列标题 | - -``` -``` - -### TDrawer +### TDrawerWidget #### 简介 -抽屉组件 +抽屉内容组件 + 可用于 Scaffold 中的 drawer 属性 #### 默认构造方法 | 参数 | 类型 | 默认值 | 说明 | | --- | --- | --- | --- | | backgroundColor | Color? | - | 组件背景颜色 | | bordered | bool? | true | 是否显示边框 | -| closeOnOverlayClick | bool? | true | 点击蒙层时是否关闭抽屉 | | contentWidget | Widget? | - | 自定义内容，优先级高于[items]/[footer]/[title] | -| context | BuildContext | context | 上下文 | -| drawerTop | double? | - | 距离顶部的距离 | | footer | Widget? | - | 抽屉的底部 | | hover | bool? | true | 是否开启点击反馈 | | isShowLastBordered | bool? | true | 是否显示最后一行分割线 | | items | List? | - | 抽屉里的列表项 | -| onClose | VoidCallback? | - | 关闭时触发 | +| key | | - | | | onItemClick | TDrawerItemClickCallback? | - | 点击抽屉里的列表项触发 | -| placement | TDrawerPlacement? | TDrawerPlacement.right | 抽屉方向 | -| showOverlay | bool? | true | 是否显示遮罩层 | | style | TCellStyle? | - | 列表自定义样式 | | title | String? | - | 抽屉的标题 | | titleWidget | Widget? | - | 抽屉的标题组件 | -| visible | bool? | - | 组件是否可见 | | width | double? | 280 | 宽度 | +``` +``` + +### TDrawerItem +#### 简介 +抽屉里的列表项 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| content | Widget? | - | 完全自定义 | +| icon | Widget? | - | 每列图标 | +| title | String? | - | 每列标题 | + \ No newline at end of file diff --git a/tdesign-site/src/dropdown-menu/README.md b/tdesign-site/src/dropdown-menu/README.md index a8da01f44..ec977c8ed 100644 --- a/tdesign-site/src/dropdown-menu/README.md +++ b/tdesign-site/src/dropdown-menu/README.md @@ -266,9 +266,31 @@ TDropdownMenu _buildGroup(BuildContext context) { ## API -### TDropdownItemController +### TDropdownMenu #### 简介 -下拉菜单控制器 +下拉菜单 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| arrowColor | Color? | - | 自定义箭头颜色 | +| arrowIcon | IconData? | - | 自定义箭头图标 | +| builder | TDropdownItemBuilder? | - | 下拉菜单构建器，优先级高于[items] | +| closeOnClickOverlay | bool? | true | 是否在点击遮罩层后关闭菜单 | +| decoration | Decoration? | - | 下拉菜单的装饰器 | +| direction | TDropdownMenuDirection? | TDropdownMenuDirection.auto | 菜单展开方向（down、up、auto） | +| duration | double? | 200.0 | 动画时长，毫秒 | +| height | double? | 48 | menu的高度 | +| isScrollable | bool? | false | 是否开启滚动列表 | +| items | List? | - | 下拉菜单 | +| key | | - | | +| labelBuilder | LabelBuilder? | - | 自定义标签内容 | +| onMenuClosed | ValueChanged? | - | 关闭菜单事件 | +| onMenuOpened | ValueChanged? | - | 展开菜单事件 | +| showOverlay | bool? | true | 是否显示遮罩层 | +| tabBarAlign | MainAxisAlignment? | MainAxisAlignment.center | [TDropdownItem.label]和[arrowIcon]/[TDropdownItem.arrowIcon]的对齐方式 | +| width | double? | - | menu的宽度 | + ``` ``` @@ -319,30 +341,8 @@ TDropdownMenu _buildGroup(BuildContext context) { ``` ``` -### TDropdownMenu +### TDropdownItemController #### 简介 -下拉菜单 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| arrowColor | Color? | - | 自定义箭头颜色 | -| arrowIcon | IconData? | - | 自定义箭头图标 | -| builder | TDropdownItemBuilder? | - | 下拉菜单构建器，优先级高于[items] | -| closeOnClickOverlay | bool? | true | 是否在点击遮罩层后关闭菜单 | -| decoration | Decoration? | - | 下拉菜单的装饰器 | -| direction | TDropdownMenuDirection? | TDropdownMenuDirection.auto | 菜单展开方向（down、up、auto） | -| duration | double? | 200.0 | 动画时长，毫秒 | -| height | double? | 48 | menu的高度 | -| isScrollable | bool? | false | 是否开启滚动列表 | -| items | List? | - | 下拉菜单 | -| key | | - | | -| labelBuilder | LabelBuilder? | - | 自定义标签内容 | -| onMenuClosed | ValueChanged? | - | 关闭菜单事件 | -| onMenuOpened | ValueChanged? | - | 展开菜单事件 | -| showOverlay | bool? | true | 是否显示遮罩层 | -| tabBarAlign | MainAxisAlignment? | MainAxisAlignment.center | [TDropdownItem.label]和[arrowIcon]/[TDropdownItem.arrowIcon]的对齐方式 | -| width | double? | - | menu的宽度 | - +下拉菜单控制器 \ No newline at end of file diff --git a/tdesign-site/src/form/README.md b/tdesign-site/src/form/README.md index 4ec9a4528..25d02941b 100644 --- a/tdesign-site/src/form/README.md +++ b/tdesign-site/src/form/README.md @@ -709,6 +709,35 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ## API +### TForm +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| btnGroup | List? | - | 表单按钮组 | +| colon | bool? | false | 是否在表单标签字段右侧显示冒号 | +| data | Map | - | 表单数据 | +| disabled | bool | false | 是否禁用整个表单 | +| errorMessage | Object? | - | 表单信息错误信息配置 | +| formContentAlign | TextAlign | TextAlign.left | 表单内容对齐方式: 左对齐、右对齐、居中对齐 | +| formController | FormController? | - | 表单控制器 | +| formLabelAlign | TextAlign? | TextAlign.left | 表单字段标签的对齐方式： | +| formShowErrorMessage | bool? | true | 校验不通过时，是否显示错误提示信息，统一控制全部表单项 | +| isHorizontal | bool | true | 表单排列方式是否为 水平方向 | +| items | List | - | 表单内容 items | +| key | | - | | +| labelWidth | double? | 20.0 | 可以整体设置 label 标签宽度 | +| onReset | Function? | - | 表单重置时触发 | +| onSubmit | Function | - | 表单提交时触发 | +| preventSubmitDefault | bool? | true | 是否阻止表单提交默认事件（表单提交默认事件会刷新页面） | +| requiredMark | bool? | true | 是否显示必填符号（*），默认显示 | +| rules | Map | - | 整个表单字段校验规则 | +| scrollToFirstError | String? | - | 表单校验不通过时，是否自动滚动到第一个校验不通过的字段，平滑滚动或是瞬间直达。 | +| submitWithWarningMessage | bool? | false | 【讨论中】当校验结果只有告警信息时，是否触发 submit 提交事件 | + +``` +``` + ### TFormItem #### 默认构造方法 @@ -750,34 +779,5 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; | type | TFormItemType | - | 校验对象的类型 | | validate | String? Function(dynamic) | - | 校验方法 | -``` -``` - -### TForm -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| btnGroup | List? | - | 表单按钮组 | -| colon | bool? | false | 是否在表单标签字段右侧显示冒号 | -| data | Map | - | 表单数据 | -| disabled | bool | false | 是否禁用整个表单 | -| errorMessage | Object? | - | 表单信息错误信息配置 | -| formContentAlign | TextAlign | TextAlign.left | 表单内容对齐方式: 左对齐、右对齐、居中对齐 | -| formController | FormController? | - | 表单控制器 | -| formLabelAlign | TextAlign? | TextAlign.left | 表单字段标签的对齐方式： | -| formShowErrorMessage | bool? | true | 校验不通过时，是否显示错误提示信息，统一控制全部表单项 | -| isHorizontal | bool | true | 表单排列方式是否为 水平方向 | -| items | List | - | 表单内容 items | -| key | | - | | -| labelWidth | double? | 20.0 | 可以整体设置 label 标签宽度 | -| onReset | Function? | - | 表单重置时触发 | -| onSubmit | Function | - | 表单提交时触发 | -| preventSubmitDefault | bool? | true | 是否阻止表单提交默认事件（表单提交默认事件会刷新页面） | -| requiredMark | bool? | true | 是否显示必填符号（*），默认显示 | -| rules | Map | - | 整个表单字段校验规则 | -| scrollToFirstError | String? | - | 表单校验不通过时，是否自动滚动到第一个校验不通过的字段，平滑滚动或是瞬间直达。 | -| submitWithWarningMessage | bool? | false | 【讨论中】当校验结果只有告警信息时，是否触发 submit 提交事件 | - \ No newline at end of file diff --git a/tdesign-site/src/image-viewer/README.md b/tdesign-site/src/image-viewer/README.md index fea213e97..4f159dc3e 100644 --- a/tdesign-site/src/image-viewer/README.md +++ b/tdesign-site/src/image-viewer/README.md @@ -69,6 +69,17 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ## API +### TImageViewer + +#### 静态方法 + +| 名称 | 返回类型 | 参数 | 说明 | +| --- | --- | --- | --- | +| showImageViewer | | required BuildContext context, required List images, List? labels, bool? closeBtn, bool? deleteBtn, bool? showIndex, bool? loop, bool? autoplay, int? duration, Color? bgColor, Color? navBarBgColor, Color? iconColor, TextStyle? labelStyle, TextStyle? indexStyle, Color? modalBarrierColor, bool? barrierDismissible, int? defaultIndex, double? width, double? height, OnIndexChange? onIndexChange, OnClose? onClose, OnDelete? onDelete, bool? ignoreDeleteError, OnImageTap? onTap, OnLongPress? onLongPress, LeftItemBuilder? leftItemBuilder, RightItemBuilder? rightItemBuilder, | 显示图片预览 | + +``` +``` + ### TImageViewerWidget #### 默认构造方法 @@ -100,16 +111,5 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; | showIndex | bool? | - | 是否显示页码 | | width | double? | - | 图片宽度 | -``` -``` - -### TImageViewer - -#### 静态方法 - -| 名称 | 返回类型 | 参数 | 说明 | -| --- | --- | --- | --- | -| showImageViewer | | required BuildContext context, required List images, List? labels, bool? closeBtn, bool? deleteBtn, bool? showIndex, bool? loop, bool? autoplay, int? duration, Color? bgColor, Color? navBarBgColor, Color? iconColor, TextStyle? labelStyle, TextStyle? indexStyle, Color? modalBarrierColor, bool? barrierDismissible, int? defaultIndex, double? width, double? height, OnIndexChange? onIndexChange, OnClose? onClose, OnDelete? onDelete, bool? ignoreDeleteError, OnImageTap? onTap, OnLongPress? onLongPress, LeftItemBuilder? leftItemBuilder, RightItemBuilder? rightItemBuilder, | 显示图片预览 | - \ No newline at end of file diff --git a/tdesign-site/src/indexes/README.md b/tdesign-site/src/indexes/README.md index 1d3fb2fb0..991028b4b 100644 --- a/tdesign-site/src/indexes/README.md +++ b/tdesign-site/src/indexes/README.md @@ -205,6 +205,30 @@ Widget _buildOther(BuildContext context) { ## API +### TIndexes +#### 简介 +索引 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| builderAnchor | Widget? Function(BuildContext context, String index, bool isPinnedToTop)? | - | 锚点自定义构建 | +| builderContent | Widget? Function(BuildContext context, String index) | - | 内容自定义构建 | +| builderIndex | Widget Function(BuildContext context, String index, bool isActive)? | - | 索引文本自定义构建，包括索引激活左侧提示 | +| capsuleTheme | bool? | false | 锚点是否为胶囊式样式 | +| indexList | List? | - | 索引字符列表。不传默认 A-Z | +| indexListMaxHeight | double? | 0.8 | 索引列表最大高度（父容器高度的百分比，默认 0.8） | +| key | | - | | +| onChange | void Function(String index)? | - | 索引发生变更时触发事件 | +| onSelect | void Function(String index)? | - | 点击侧边栏时触发事件 | +| reverse | bool? | false | 反方向滚动置顶 | +| scrollController | ScrollController? | - | 滚动控制器 | +| sticky | bool? | true | 锚点是否吸顶 | +| stickyOffset | double? | 0 | 锚点吸顶时与顶部的距离 | + +``` +``` + ### TIndexesAnchor #### 简介 索引锚点 @@ -236,29 +260,5 @@ Widget _buildOther(BuildContext context) { | key | | - | | | onSelect | void Function(String newIndex, String oldIndex) | - | 点击侧边栏时触发事件 | -``` -``` - -### TIndexes -#### 简介 -索引 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| builderAnchor | Widget? Function(BuildContext context, String index, bool isPinnedToTop)? | - | 锚点自定义构建 | -| builderContent | Widget? Function(BuildContext context, String index) | - | 内容自定义构建 | -| builderIndex | Widget Function(BuildContext context, String index, bool isActive)? | - | 索引文本自定义构建，包括索引激活左侧提示 | -| capsuleTheme | bool? | false | 锚点是否为胶囊式样式 | -| indexList | List? | - | 索引字符列表。不传默认 A-Z | -| indexListMaxHeight | double? | 0.8 | 索引列表最大高度（父容器高度的百分比，默认 0.8） | -| key | | - | | -| onChange | void Function(String index)? | - | 索引发生变更时触发事件 | -| onSelect | void Function(String index)? | - | 点击侧边栏时触发事件 | -| reverse | bool? | false | 反方向滚动置顶 | -| scrollController | ScrollController? | - | 滚动控制器 | -| sticky | bool? | true | 锚点是否吸顶 | -| stickyOffset | double? | 0 | 锚点吸顶时与顶部的距离 | - \ No newline at end of file diff --git a/tdesign-site/src/message/README.md b/tdesign-site/src/message/README.md index da6676df5..176eafef1 100644 --- a/tdesign-site/src/message/README.md +++ b/tdesign-site/src/message/README.md @@ -286,30 +286,6 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ## API -### MessageLink -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| color | Color? | - | 颜色 | -| name | String | - | 名称 | -| uri | Uri? | - | 资源链接 | - -``` -``` - -### MessageMarquee -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| delay | int? | - | 延迟时间(毫秒) | -| loop | int? | - | 循环次数 | -| speed | int? | - | 速度 | - -``` -``` - ### TMessage #### 默认构造方法 @@ -336,5 +312,29 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; | --- | --- | --- | --- | | showMessage | | required BuildContext context, String? content, bool? visible, int? duration, dynamic closeBtn, dynamic icon, dynamic link, MessageMarquee? marquee, List? offset, MessageTheme? theme, VoidCallback? onCloseBtnClick, VoidCallback? onDurationEnd, VoidCallback? onLinkClick, | | +``` +``` + +### MessageMarquee +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| delay | int? | - | 延迟时间(毫秒) | +| loop | int? | - | 循环次数 | +| speed | int? | - | 速度 | + +``` +``` + +### MessageLink +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| color | Color? | - | 颜色 | +| name | String | - | 名称 | +| uri | Uri? | - | 资源链接 | + \ No newline at end of file diff --git a/tdesign-site/src/notice-bar/README.md b/tdesign-site/src/notice-bar/README.md index 00740aeaa..f9b95f595 100644 --- a/tdesign-site/src/notice-bar/README.md +++ b/tdesign-site/src/notice-bar/README.md @@ -285,30 +285,6 @@ Widget _cardNoticeBar(BuildContext context) { ## API -### TNoticeBarStyle -#### 简介 -公告栏样式 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| backgroundColor | Color? | - | 公告栏背景色 | -| context | BuildContext? | - | 上下文 | -| leftIconColor | Color? | - | 公告栏左侧图标颜色 | -| padding | EdgeInsetsGeometry? | - | 公告栏内边距 | -| rightIconColor | Color? | - | 公告栏右侧图标颜色 | -| textStyle | TextStyle? | - | 公告栏内容样式 | - - -#### 工厂构造方法 - -| 名称 | 说明 | -| --- | --- | -| TNoticeBarStyle.generateTheme | 根据主题生成样式 | - -``` -``` - ### TNoticeBar #### 简介 @@ -333,5 +309,29 @@ Widget _cardNoticeBar(BuildContext context) { | suffixIcon | IconData? | - | 右侧图标 | | theme | TNoticeBarTheme? | TNoticeBarTheme.info | 主题 | +``` +``` + +### TNoticeBarStyle +#### 简介 +公告栏样式 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| backgroundColor | Color? | - | 公告栏背景色 | +| context | BuildContext? | - | 上下文 | +| leftIconColor | Color? | - | 公告栏左侧图标颜色 | +| padding | EdgeInsetsGeometry? | - | 公告栏内边距 | +| rightIconColor | Color? | - | 公告栏右侧图标颜色 | +| textStyle | TextStyle? | - | 公告栏内容样式 | + + +#### 工厂构造方法 + +| 名称 | 说明 | +| --- | --- | +| TNoticeBarStyle.generateTheme | 根据主题生成样式 | + \ No newline at end of file diff --git a/tdesign-site/src/picker/README.md b/tdesign-site/src/picker/README.md index 701dbc78e..2dfa16264 100644 --- a/tdesign-site/src/picker/README.md +++ b/tdesign-site/src/picker/README.md @@ -480,6 +480,31 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ## API +### TPicker +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| cancel | Widget? | - | 工具栏左侧自定义插槽，默认使用 [TResourceDelegate.cancel] | +| confirm | Widget? | - | 工具栏右侧自定义插槽，默认使用 [TResourceDelegate.confirm] | +| disabled | bool | false | 是否禁用整个选择器（禁止滚动和操作），默认 false | +| height | double | 200 | 视窗高度，默认 200 | +| initialValue | List? | - | 初始选中值列表（按 value 匹配） | +| itemBuilder | ItemBuilderType? | - | 自定义子项构建器（disabled 项仍由内部统一渲染，不会走此 builder） | +| itemCount | int | 5 | 每屏显示 item 数，默认 5 | +| itemDistanceCalculator | ItemDistanceCalculator? | - | 自定义距离计算器（控制颜色/字重/字号随"离中心距离"的变化） | +| items | TPickerItems | - | 数据源（必填） | +| key | | - | | +| onCancel | VoidCallback? | - | 点击「取消」按钮回调 | +| onChange | void Function(TPickerValue)? | - | 值改变回调（滚动时实时触发） | +| onConfirm | void Function(TPickerValue)? | - | 点击「确认」按钮回调 | +| onLoad | void Function(TPickerLoadEvent)? | - | 列选中项变化的事件回调 | +| title | String? | - | 工具栏中部标题（可选，不传时中部留白） | +| titleWidget | Widget? | - | 工具栏中部自定义标题插槽 | + +``` +``` + ### TPickerOption #### 默认构造方法 @@ -503,32 +528,16 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ``` ``` -### TPicker +### TPickerLoadEvent #### 默认构造方法 | 参数 | 类型 | 默认值 | 说明 | | --- | --- | --- | --- | -| cancel | Widget? | - | 工具栏左侧自定义插槽，默认使用 [TResourceDelegate.cancel] | -| confirm | Widget? | - | 工具栏右侧自定义插槽，默认使用 [TResourceDelegate.confirm] | -| disabled | bool | false | 是否禁用整个选择器（禁止滚动和操作），默认 false | -| height | double | 200 | 视窗高度，默认 200 | -| initialValue | List? | - | 初始选中值列表（按 value 匹配） | -| itemBuilder | ItemBuilderType? | - | 自定义子项构建器（disabled 项仍由内部统一渲染，不会走此 builder） | -| itemCount | int | 5 | 每屏显示 item 数，默认 5 | -| itemDistanceCalculator | ItemDistanceCalculator? | - | 自定义距离计算器（控制颜色/字重/字号随"离中心距离"的变化） | -| items | TPickerItems | - | 数据源（必填） | -| key | | - | | -| onCancel | VoidCallback? | - | 点击「取消」按钮回调 | -| onChange | void Function(TPickerValue)? | - | 值改变回调（滚动时实时触发） | -| onConfirm | void Function(TPickerValue)? | - | 点击「确认」按钮回调 | -| onLoad | void Function(TPickerLoadEvent)? | - | 列选中项变化的事件回调 | -| title | String? | - | 工具栏中部标题（可选，不传时中部留白） | -| titleWidget | Widget? | - | 工具栏中部自定义标题插槽 | - -``` -``` +| column | int | - | 触发事件的列索引（0 表示第一列） | +| displayedCount | int | - | 当前列已展示的选项总数 | +| parentValue | dynamic | - | 当前列的父级选中值（联动模式下使用） | +| remaining | int | - | 距底部剩余的选项数（业务可用此值做"接近底部时加载"判断） | -### TPickerItems ``` ``` @@ -580,6 +589,10 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ``` ``` +### TPickerItems +``` +``` + ### TPickerKeys #### 默认构造方法 @@ -590,18 +603,5 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; | label | String | 'label' | 展示文案对应的字段名，默认 `label` | | value | String | 'value' | 业务值对应的字段名，默认 `value` | -``` -``` - -### TPickerLoadEvent -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| column | int | - | 触发事件的列索引（0 表示第一列） | -| displayedCount | int | - | 当前列已展示的选项总数 | -| parentValue | dynamic | - | 当前列的父级选中值（联动模式下使用） | -| remaining | int | - | 距底部剩余的选项数（业务可用此值做"接近底部时加载"判断） | - \ No newline at end of file diff --git a/tdesign-site/src/popover/README.md b/tdesign-site/src/popover/README.md index fe8cb93bb..60e8283db 100644 --- a/tdesign-site/src/popover/README.md +++ b/tdesign-site/src/popover/README.md @@ -1275,6 +1275,19 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ## API +### TPopover +#### 简介 + + +#### 静态方法 + +| 名称 | 返回类型 | 参数 | 说明 | +| --- | --- | --- | --- | +| showPopover | | required BuildContext context, String? content, Widget? contentWidget, double offset, TPopoverTheme? theme, bool closeOnClickOutside, TPopoverPlacement? placement, bool? showArrow, double arrowSize, EdgeInsetsGeometry? padding, double? width, double? height, Color? overlayColor, OnTap? onTap, OnLongTap? onLongTap, BorderRadius? radius, | | + +``` +``` + ### TPopoverWidget #### 简介 @@ -1298,18 +1311,5 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; | theme | TPopoverTheme? | - | 弹出气泡主题 | | width | double? | - | 内容宽度（包含padding，实际高度：height - paddingLeft - paddingRight） | -``` -``` - -### TPopover -#### 简介 - - -#### 静态方法 - -| 名称 | 返回类型 | 参数 | 说明 | -| --- | --- | --- | --- | -| showPopover | | required BuildContext context, String? content, Widget? contentWidget, double offset, TPopoverTheme? theme, bool closeOnClickOutside, TPopoverPlacement? placement, bool? showArrow, double arrowSize, EdgeInsetsGeometry? padding, double? width, double? height, Color? overlayColor, OnTap? onTap, OnLongTap? onLongTap, BorderRadius? radius, | | - \ No newline at end of file diff --git a/tdesign-site/src/popup/README.md b/tdesign-site/src/popup/README.md index 9c3e12c11..ec55fb953 100644 --- a/tdesign-site/src/popup/README.md +++ b/tdesign-site/src/popup/README.md @@ -459,6 +459,32 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ## API +### TSlidePopupRoute +#### 简介 +从屏幕的某个方向滑动弹出的Dialog框的路由，比如从顶部、底部、左、右滑出页面 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| barrierClick | VoidCallback? | - | 蒙层点击事件，仅在[modalBarrierFull]为false时触发 | +| barrierLabel | | - | | +| builder | WidgetBuilder | - | 控件构建器 | +| close | VoidCallback? | - | 关闭前事件 | +| focusMove | bool | false | 是否有输入框获取焦点时整体平移避免输入框被遮挡 | +| isDismissible | bool | true | 点击蒙层能否关闭 | +| modalBarrierColor | Color? | Colors.black54 | 蒙层颜色 | +| modalBarrierFull | bool | false | 是否全屏显示蒙层 | +| modalHeight | double? | - | 弹出框高度 | +| modalLeft | double? | 0 | 弹出框左侧距离 | +| modalTop | double? | 0 | 弹出框顶部距离 | +| modalWidth | double? | - | 弹出框宽度 | +| open | VoidCallback? | - | 打开前事件 | +| opened | VoidCallback? | - | 打开后事件 | +| slideTransitionFrom | SlideTransitionFrom | SlideTransitionFrom.bottom | 设置从屏幕的哪个方向滑出 | + +``` +``` + ### TPopupBottomDisplayPanel #### 简介 右上角带关闭的底部浮层面板 @@ -530,31 +556,5 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; | key | | - | | | radius | double? | - | 圆角 | -``` -``` - -### TSlidePopupRoute -#### 简介 -从屏幕的某个方向滑动弹出的Dialog框的路由，比如从顶部、底部、左、右滑出页面 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| barrierClick | VoidCallback? | - | 蒙层点击事件，仅在[modalBarrierFull]为false时触发 | -| barrierLabel | | - | | -| builder | WidgetBuilder | - | 控件构建器 | -| close | VoidCallback? | - | 关闭前事件 | -| focusMove | bool | false | 是否有输入框获取焦点时整体平移避免输入框被遮挡 | -| isDismissible | bool | true | 点击蒙层能否关闭 | -| modalBarrierColor | Color? | Colors.black54 | 蒙层颜色 | -| modalBarrierFull | bool | false | 是否全屏显示蒙层 | -| modalHeight | double? | - | 弹出框高度 | -| modalLeft | double? | 0 | 弹出框左侧距离 | -| modalTop | double? | 0 | 弹出框顶部距离 | -| modalWidth | double? | - | 弹出框宽度 | -| open | VoidCallback? | - | 打开前事件 | -| opened | VoidCallback? | - | 打开后事件 | -| slideTransitionFrom | SlideTransitionFrom | SlideTransitionFrom.bottom | 设置从屏幕的哪个方向滑出 | - \ No newline at end of file diff --git a/tdesign-site/src/side-bar/README.md b/tdesign-site/src/side-bar/README.md index b41fed384..9e5e9cc99 100644 --- a/tdesign-site/src/side-bar/README.md +++ b/tdesign-site/src/side-bar/README.md @@ -635,22 +635,6 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ## API -### TSideBarItem -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| badge | TBadge? | - | 徽标 | -| disabled | bool | false | 是否禁用 | -| icon | IconData? | - | 图标 | -| key | | - | | -| label | String | '' | 标签 | -| textStyle | TextStyle? | - | 标签样式 | -| value | int | -1 | 值 | - -``` -``` - ### TSideBar #### 默认构造方法 @@ -674,5 +658,21 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; | unSelectedColor | Color? | - | 未选中颜色 | | value | int? | - | 选项值 | +``` +``` + +### TSideBarItem +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| badge | TBadge? | - | 徽标 | +| disabled | bool | false | 是否禁用 | +| icon | IconData? | - | 图标 | +| key | | - | | +| label | String | '' | 标签 | +| textStyle | TextStyle? | - | 标签样式 | +| value | int | -1 | 值 | + \ No newline at end of file diff --git a/tdesign-site/src/steps/README.md b/tdesign-site/src/steps/README.md index 5d49bdb41..2209c4d34 100644 --- a/tdesign-site/src/steps/README.md +++ b/tdesign-site/src/steps/README.md @@ -703,21 +703,6 @@ Vertical Customize Steps 垂直自定义步骤条 ## API -### TStepsItemData -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| content | String? | - | 内容 | -| customContent | Widget? | - | 自定义内容 | -| customTitle | Widget? | - | 自定义标题 | -| errorIcon | IconData? | - | 失败图标 | -| successIcon | IconData? | - | 成功图标 | -| title | String? | - | 标题 | - -``` -``` - ### TSteps #### 默认构造方法 @@ -732,5 +717,20 @@ Vertical Customize Steps 垂直自定义步骤条 | steps | List | - | 步骤条数据 | | verticalSelect | bool | false | 步骤条垂直自定义步骤条选择模式 | +``` +``` + +### TStepsItemData +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| content | String? | - | 内容 | +| customContent | Widget? | - | 自定义内容 | +| customTitle | Widget? | - | 自定义标题 | +| errorIcon | IconData? | - | 失败图标 | +| successIcon | IconData? | - | 成功图标 | +| title | String? | - | 标题 | + \ No newline at end of file diff --git a/tdesign-site/src/swiper/README.md b/tdesign-site/src/swiper/README.md index 5d07eb6db..87b5dda46 100644 --- a/tdesign-site/src/swiper/README.md +++ b/tdesign-site/src/swiper/README.md @@ -267,6 +267,21 @@ import 'package:flutter_swiper_null_safety/flutter_swiper_null_safety.dart'; ## API +### TSwiperPagination +#### 简介 +TDesign风格的Swiper指示器样式，与flutter_swiper的Swiper结合使用 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| alignment | Alignment? | - | 当 scrollDirection== Axis.horizontal 时，默认Alignment.bottomCenter | +| builder | SwiperPlugin | TSwiperPagination.dots | 具体样式 | +| key | Key? | - | | +| margin | EdgeInsetsGeometry | const EdgeInsets.all(10.0) | 指示器和container之间的距离 | + +``` +``` + ### TPageTransformer #### 简介 TD默认PageTransformer @@ -286,20 +301,5 @@ TD默认PageTransformer | TPageTransformer.margin | 普通margin的卡片式 | | TPageTransformer.scaleAndFade | 缩放或透明的卡片式 | -``` -``` - -### TSwiperPagination -#### 简介 -TDesign风格的Swiper指示器样式，与flutter_swiper的Swiper结合使用 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| alignment | Alignment? | - | 当 scrollDirection== Axis.horizontal 时，默认Alignment.bottomCenter | -| builder | SwiperPlugin | TSwiperPagination.dots | 具体样式 | -| key | Key? | - | | -| margin | EdgeInsetsGeometry | const EdgeInsets.all(10.0) | 指示器和container之间的距离 | - \ No newline at end of file diff --git a/tdesign-site/src/tab-bar/README.md b/tdesign-site/src/tab-bar/README.md index e85926081..f17afd5e9 100644 --- a/tdesign-site/src/tab-bar/README.md +++ b/tdesign-site/src/tab-bar/README.md @@ -571,38 +571,6 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ## API -### BadgeConfig -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| badgeRightOffset | double? | - | 消息右侧偏移量 | -| badgeTopOffset | double? | - | 消息顶部偏移量 | -| showBadge | bool | - | 是否展示消息 | -| tBadge | TBadge? | - | 消息样式（未设置但 showBadge 为 true，则默认使用红点） | - -``` -``` - -### TBottomTabBarTabConfig -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| allowMultipleTaps | bool | false | onTap 方法允许点击多次 | -| badgeConfig | BadgeConfig? | - | 消息配置 | -| onLongPress | GestureLongPressCallback? | - | 长按事件 | -| onTap | GestureTapCallback? | - | tab点击事件 | -| popUpButtonConfig | TBottomTabBarPopUpBtnConfig? | - | 弹窗配置 | -| selectedIcon | Widget? | - | 选中时图标 | -| selectTabTextStyle | TextStyle? | - | 文本已选择样式 basicType为text时必填 | -| tabText | String? | - | tab 文本 | -| unselectedIcon | Widget? | - | 未选中时图标 | -| unselectTabTextStyle | TextStyle? | - | 文本未选择样式 basicType为text时必填 | - -``` -``` - ### TBottomTabBar #### 默认构造方法 @@ -635,6 +603,38 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ``` ``` +### BadgeConfig +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| badgeRightOffset | double? | - | 消息右侧偏移量 | +| badgeTopOffset | double? | - | 消息顶部偏移量 | +| showBadge | bool | - | 是否展示消息 | +| tBadge | TBadge? | - | 消息样式（未设置但 showBadge 为 true，则默认使用红点） | + +``` +``` + +### TBottomTabBarTabConfig +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| allowMultipleTaps | bool | false | onTap 方法允许点击多次 | +| badgeConfig | BadgeConfig? | - | 消息配置 | +| onLongPress | GestureLongPressCallback? | - | 长按事件 | +| onTap | GestureTapCallback? | - | tab点击事件 | +| popUpButtonConfig | TBottomTabBarPopUpBtnConfig? | - | 弹窗配置 | +| selectedIcon | Widget? | - | 选中时图标 | +| selectTabTextStyle | TextStyle? | - | 文本已选择样式 basicType为text时必填 | +| tabText | String? | - | tab 文本 | +| unselectedIcon | Widget? | - | 未选中时图标 | +| unselectTabTextStyle | TextStyle? | - | 文本未选择样式 basicType为text时必填 | + +``` +``` + ### TBottomTabBarPopUpBtnConfig #### 默认构造方法 diff --git a/tdesign-site/src/tabs/README.md b/tdesign-site/src/tabs/README.md index aaeb9618b..f8d59da60 100644 --- a/tdesign-site/src/tabs/README.md +++ b/tdesign-site/src/tabs/README.md @@ -192,6 +192,58 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; + +带内容区选项卡（autoHeight 自适应高度） + + + + 
+  Widget _buildItemWithAutoHeight(BuildContext context) {
+    // 演示 issue #519 的修复：开启 autoHeight 后，外部无需再包 SizedBox
+    // 显式设置高度，TTabBarView 会根据当前激活 tab 的子内容高度自适应，
+    // 切换 tab 时高度会平滑过渡。
+    var tabController = TabController(length: 3, vsync: this);
+    // 三个子内容高度故意不同，用于观察外层容器的高度过渡效果
+    final autoHeightTabViews = [
+      Container(
+        height: 100,
+        color: const Color(0xFFE3F0FF),
+        alignment: Alignment.center,
+        child: const TText('内容区 1（高度 100）'),
+      ),
+      Container(
+        height: 200,
+        color: const Color(0xFFE8F7E3),
+        alignment: Alignment.center,
+        child: const TText('内容区 2（高度 200）'),
+      ),
+      Container(
+        height: 150,
+        color: const Color(0xFFFFF5E0),
+        alignment: Alignment.center,
+        child: const TText('内容区 3（高度 150）'),
+      ),
+    ];
+    return Column(
+      children: [
+        TTabBar(
+          tabs: subList(3),
+          controller: tabController,
+          showIndicator: true,
+          isScrollable: false,
+        ),
+        // 此处未给 TTabBarView 包 SizedBox、也未指定 height
+        TTabBarView(
+          autoHeight: true,
+          controller: tabController,
+          children: autoHeightTabViews,
+        ),
+      ],
+    );
+  }
+ + + ### 1 组件状态 选项卡状态 @@ -308,19 +360,6 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; ## API -### TTabBarView -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| children | List | - | 子widget列表 | -| controller | TabController? | - | 控制器 | -| isSlideSwitch | bool | false | 是否可以滑动切换 | -| key | | - | | - -``` -``` - ### TTabBar #### 默认构造方法 @@ -375,5 +414,20 @@ import 'package:tdesign_flutter/tdesign_flutter.dart'; | text | String? | - | 文字内容 | | textMargin | EdgeInsetsGeometry? | - | 中间内容宽度 | +``` +``` + +### TTabBarView +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| animationDuration | Duration | const Duration(milliseconds: 300) | 高度自适应模式下的过渡动画时长（默认 300ms） | +| autoHeight | bool | false | 是否开启高度自适应（默认 false，保持向后兼容） | +| children | List | - | 子 widget 列表（每一项对应一个 tab 页的内容） | +| controller | TabController? | - | Tab 控制器，用于和外部 [TabBar] 联动 | +| isSlideSwitch | bool | false | 是否可以左右滑动切换 tab 页 | +| key | | - | | + \ No newline at end of file diff --git a/tdesign-site/src/time-counter/README.md b/tdesign-site/src/time-counter/README.md index 790bed559..f7dec7c0a 100644 --- a/tdesign-site/src/time-counter/README.md +++ b/tdesign-site/src/time-counter/README.md @@ -608,6 +608,31 @@ TTimeCounter _buildCustomUnitLargeSize(BuildContext context) { ## API +### TTimeCounter +#### 简介 +计时组件 +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| autoStart | bool | true | 是否自动开始倒计时 | +| content | dynamic | 'default' | 'default' / Widget Function(int time) / Widget | +| controller | TTimeCounterController? | - | 控制器，可控制开始/暂停/继续/重置 | +| direction | TTimeCounterDirection | TTimeCounterDirection.down | 计时方向，默认倒计时 | +| format | String | 'HH:mm:ss' | 时间格式，DD-日，HH-时，mm-分，ss-秒，SSS-毫秒（分隔符必须为长度为1的非空格的字符） | +| key | | - | | +| millisecond | bool | false | 是否开启毫秒级渲染 | +| onChange | Function(int time)? | - | 时间变化时触发回调 | +| onFinish | VoidCallback? | - | 计时结束时触发回调 | +| size | TTimeCounterSize | TTimeCounterSize.medium | 尺寸 | +| splitWithUnit | bool | false | 使用时间单位分割 | +| style | TTimeCounterStyle? | - | 自定义样式，有则优先用它，没有则根据size和theme选取 | +| theme | TTimeCounterTheme | TTimeCounterTheme.defaultTheme | 风格 | +| time | int | - | 必需；计时时长，单位毫秒 | + +``` +``` + ### TTimeCounterController #### 简介 倒计时组件控制器，可控制开始(`start()`)/暂停(`pause()`)/继续(`resume()`)/重置(`reset([int? time])`) @@ -644,30 +669,5 @@ TTimeCounter _buildCustomUnitLargeSize(BuildContext context) { | --- | --- | | TTimeCounterStyle.generateStyle | 生成默认样式 | -``` -``` - -### TTimeCounter -#### 简介 -计时组件 -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| autoStart | bool | true | 是否自动开始倒计时 | -| content | dynamic | 'default' | 'default' / Widget Function(int time) / Widget | -| controller | TTimeCounterController? | - | 控制器，可控制开始/暂停/继续/重置 | -| direction | TTimeCounterDirection | TTimeCounterDirection.down | 计时方向，默认倒计时 | -| format | String | 'HH:mm:ss' | 时间格式，DD-日，HH-时，mm-分，ss-秒，SSS-毫秒（分隔符必须为长度为1的非空格的字符） | -| key | | - | | -| millisecond | bool | false | 是否开启毫秒级渲染 | -| onChange | Function(int time)? | - | 时间变化时触发回调 | -| onFinish | VoidCallback? | - | 计时结束时触发回调 | -| size | TTimeCounterSize | TTimeCounterSize.medium | 尺寸 | -| splitWithUnit | bool | false | 使用时间单位分割 | -| style | TTimeCounterStyle? | - | 自定义样式，有则优先用它，没有则根据size和theme选取 | -| theme | TTimeCounterTheme | TTimeCounterTheme.defaultTheme | 风格 | -| time | int | - | 必需；计时时长，单位毫秒 | - \ No newline at end of file diff --git a/tdesign-site/src/tree-select/README.md b/tdesign-site/src/tree-select/README.md index 5d824d1ea..dbb2ecb37 100644 --- a/tdesign-site/src/tree-select/README.md +++ b/tdesign-site/src/tree-select/README.md @@ -186,21 +186,6 @@ String类型ID(问题3) ## API -### TSelectOption -#### 默认构造方法 - -| 参数 | 类型 | 默认值 | 说明 | -| --- | --- | --- | --- | -| children | List | const [] | 子选项 | -| columnWidth | double? | - | 自定义宽度，允许用户指定每个选项的宽度 | -| label | String | - | 标签 | -| maxLines | int | 1 | 最大显示行数 | -| multiple | bool | false | 当前子项支持多选 | -| value | dynamic | - | 值 | - -``` -``` - ### TTreeSelect #### 默认构造方法 @@ -215,5 +200,20 @@ String类型ID(问题3) | outwardCornerRadius | double | 9 | 一级菜单选中项的外弯折圆角半径，默认为 9 | | style | TTreeSelectStyle | TTreeSelectStyle.normal | 一级菜单样式 | +``` +``` + +### TSelectOption +#### 默认构造方法 + +| 参数 | 类型 | 默认值 | 说明 | +| --- | --- | --- | --- | +| children | List | const [] | 子选项 | +| columnWidth | double? | - | 自定义宽度，允许用户指定每个选项的宽度 | +| label | String | - | 标签 | +| maxLines | int | 1 | 最大显示行数 | +| multiple | bool | false | 当前子项支持多选 | +| value | dynamic | - | 值 | + \ No newline at end of file