From 68665fe5449f82450d609832cdfbbd0f6364ef09 Mon Sep 17 00:00:00 2001 From: v_szheshi Date: Mon, 27 May 2024 11:58:45 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E9=80=89=E4=B8=AD=E6=A0=B7?= =?UTF-8?q?=E5=BC=8F=EF=BC=8C=E4=BB=A5=E5=8F=8A=E8=87=AA=E5=AE=9A=E4=B9=89?= =?UTF-8?q?=E6=96=87=E6=9C=AC=E8=BE=B9=E8=B7=9D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../page/sidebar/td_sidebar_page_custom.dart | 2 + .../src/components/sidebar/td_sidebar.dart | 15 +++++++ .../sidebar/td_wrap_sidebar_item.dart | 43 ++++++++++--------- 3 files changed, 39 insertions(+), 21 deletions(-) diff --git a/tdesign-component/example/lib/page/sidebar/td_sidebar_page_custom.dart b/tdesign-component/example/lib/page/sidebar/td_sidebar_page_custom.dart index 5a3a98dca..e1eb55523 100644 --- a/tdesign-component/example/lib/page/sidebar/td_sidebar_page_custom.dart +++ b/tdesign-component/example/lib/page/sidebar/td_sidebar_page_custom.dart @@ -86,7 +86,9 @@ class TDSideBarCustomPageState extends State { textStyle: ele.textStyle, icon: ele.icon)) .toList(), + selectedTextStyle:TextStyle(color: Colors.red), onSelected: setCurrentValue, + contentPadding:EdgeInsets.only(left: 16, top: 16,bottom: 16), ), ), Expanded( diff --git a/tdesign-component/lib/src/components/sidebar/td_sidebar.dart b/tdesign-component/lib/src/components/sidebar/td_sidebar.dart index bd766c34c..ae0bb5ecc 100644 --- a/tdesign-component/lib/src/components/sidebar/td_sidebar.dart +++ b/tdesign-component/lib/src/components/sidebar/td_sidebar.dart @@ -32,11 +32,14 @@ class TDSideBar extends StatefulWidget { Key? key, this.value, this.defaultValue, + this.selectedColor, this.children = const [], this.onChanged, this.onSelected, this.height, this.controller, + this.contentPadding, + this.selectedTextStyle, this.style = TDSideBarStyle.normal, }) : super(key: key); @@ -55,12 +58,21 @@ class TDSideBar extends StatefulWidget { /// 选中值发生变化（点击事件） final ValueChanged? onSelected; + /// 选中值后颜色 + final Color? selectedColor; + + /// 选中样式 + final TextStyle? selectedTextStyle; + /// 样式 final TDSideBarStyle style; /// 高度 final double? height; + /// 自定义文本框内边距 + final EdgeInsetsGeometry? contentPadding; + /// 控制器 final TDSideBarController? controller; @@ -202,6 +214,9 @@ class _TDSideBarState extends State { badge: ele.badge, textStyle: ele.textStyle, selected: currentIndex == ele.index, + selectedColor:widget.selectedColor, + selectedTextStyle:widget.selectedTextStyle, + contentPadding:widget.contentPadding, topAdjacent: currentIndex != null && currentIndex! + 1 == ele.index, bottomAdjacent: currentIndex != null && diff --git a/tdesign-component/lib/src/components/sidebar/td_wrap_sidebar_item.dart b/tdesign-component/lib/src/components/sidebar/td_wrap_sidebar_item.dart index 218bab396..47429820f 100644 --- a/tdesign-component/lib/src/components/sidebar/td_wrap_sidebar_item.dart +++ b/tdesign-component/lib/src/components/sidebar/td_wrap_sidebar_item.dart @@ -9,12 +9,15 @@ class TDWrapSideBarItem extends StatelessWidget { required this.disabled, this.icon, this.label = '', + this.contentPadding, this.textStyle = const TextStyle( fontSize: 16, height: 1.5, ), + this.selectedTextStyle, this.value = -1, this.selected = false, + this.selectedColor, this.topAdjacent = false, this.bottomAdjacent = false, this.onTap, @@ -25,9 +28,12 @@ class TDWrapSideBarItem extends StatelessWidget { final bool disabled; final IconData? icon; final String label; + final EdgeInsetsGeometry? contentPadding; final TextStyle? textStyle; + final TextStyle? selectedTextStyle; final int value; final bool selected; + final Color? selectedColor; final bool topAdjacent; final bool bottomAdjacent; final VoidCallback? onTap; @@ -39,24 +45,20 @@ class TDWrapSideBarItem extends StatelessWidget { Widget build(BuildContext context) { return GestureDetector( onTap: onTap, - child: style == TDSideBarStyle.normal - ? renderNormalItem(context) - : renderOutlineItem(context), + child: style == TDSideBarStyle.normal ? renderNormalItem(context) : renderOutlineItem(context), ); } Widget renderNormalItem(BuildContext context) { return Container( - decoration: const BoxDecoration( + decoration: BoxDecoration( color: Colors.white, ), child: ConstrainedBox( constraints: const BoxConstraints(minHeight: 56), child: Container( decoration: BoxDecoration( - color: selected - ? Colors.white - : const Color.fromRGBO(246, 246, 246, 1), + color: selected ? Colors.white : const Color.fromRGBO(246, 246, 246, 1), borderRadius: bottomAdjacent || topAdjacent ? bottomAdjacent ? const BorderRadius.only(bottomRight: Radius.circular(9)) @@ -67,7 +69,7 @@ class TDWrapSideBarItem extends StatelessWidget { renderPreLine(context), Expanded( child: Padding( - padding: const EdgeInsets.all(16), + padding: contentPadding ?? const EdgeInsets.all(16), child: renderMainContent(context), )) ], @@ -82,14 +84,12 @@ class TDWrapSideBarItem extends StatelessWidget { constraints: const BoxConstraints(minHeight: 56), child: Container( height: 56, - decoration: - const BoxDecoration(color: Color.fromRGBO(246, 246, 246, 1)), + decoration: const BoxDecoration(color: Color.fromRGBO(246, 246, 246, 1)), child: Padding( padding: const EdgeInsets.all(8), child: Container( decoration: BoxDecoration( - color: selected && !disabled ? Colors.white : null, - borderRadius: BorderRadius.circular(6)), + color: selected && !disabled ? Colors.white : null, borderRadius: BorderRadius.circular(6)), child: Padding( padding: const EdgeInsets.all(8), child: renderMainContent(context), @@ -125,7 +125,9 @@ class TDWrapSideBarItem extends StatelessWidget { width: preLineWidth, height: 14, decoration: BoxDecoration( - color: TDTheme.of(context).brandNormalColor, + color: selectedTextStyle != null + ? selectedTextStyle?.color + : (selectedColor ?? TDTheme.of(context).brandNormalColor), borderRadius: BorderRadius.circular(4)), ) ], @@ -143,7 +145,9 @@ class TDWrapSideBarItem extends StatelessWidget { color: disabled ? TDTheme.of(context).fontGyColor4 : selected - ? TDTheme.of(context).brandNormalColor + ? selectedTextStyle != null + ? selectedTextStyle?.color + : (selectedColor ?? TDTheme.of(context).brandNormalColor) : Colors.black, ), )); @@ -156,13 +160,12 @@ class TDWrapSideBarItem extends StatelessWidget { WidgetSpan( child: TDText( label, - style: textStyle, - fontWeight: - selected && !disabled ? FontWeight.w600 : FontWeight.w400, + style: selected ? (selectedTextStyle ?? TextStyle(color: selectedColor)) : textStyle, + fontWeight: selected && !disabled ? FontWeight.w600 : FontWeight.w400, textColor: disabled ? TDTheme.of(context).fontGyColor4 : selected - ? TDTheme.of(context).brandNormalColor + ? selectedColor ?? TDTheme.of(context).brandNormalColor : Colors.black, forceVerticalCenter: true, )), @@ -172,9 +175,7 @@ class TDWrapSideBarItem extends StatelessWidget { height: 16, child: Stack( clipBehavior: Clip.none, - children: [ - badge != null ? Positioned(top: -6, child: badge!) : Container() - ], + children: [badge != null ? Positioned(top: -6, child: badge!) : Container()], ), )) ],