From 31bc999f7667ff649562cfb7c48e8dd04b1ca666 Mon Sep 17 00:00:00 2001
From: zflyluo <zflyluo@tencent.com>
Date: Sat, 11 Apr 2026 20:16:25 +0800
Subject: [PATCH] fix(picker): gradient mask height now scales with
 pickerHeight/pickerItemCount (fixes #711)

---
 .../src/components/picker/t_date_picker.dart  | 10 +++++---
 .../src/components/picker/t_multi_picker.dart | 23 +++++++++++--------
 2 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/tdesign-component/lib/src/components/picker/t_date_picker.dart b/tdesign-component/lib/src/components/picker/t_date_picker.dart
index 996778ecf..71a4f6141 100644
--- a/tdesign-component/lib/src/components/picker/t_date_picker.dart
+++ b/tdesign-component/lib/src/components/picker/t_date_picker.dart
@@ -196,9 +196,14 @@ class _TDatePickerState extends State<TDatePicker> {
     return items[itemIndex];
   }
 
+  double _getMaskHeight() =>
+      pickerHeight / widget.pickerItemCount *
+      ((widget.pickerItemCount - 1) / 2.0);
+
   @override
   Widget build(BuildContext context) {
     var maxWidth = MediaQuery.of(context).size.width;
+    var maskHeight = _getMaskHeight();
     return Container(
       width: maxWidth,
       padding: widget.padding ??
@@ -265,13 +270,12 @@ class _TDatePickerState extends State<TDatePicker> {
                             : Container(),
                       ],
                     )),
-                // 蒙层
                 Positioned(
                   top: 0,
                   child: IgnorePointer(
                     ignoring: true,
                     child: Container(
-                      height: _pickerTitleHeight,
+                      height: maskHeight,
                       width: MediaQuery.of(context).size.width,
                       decoration: BoxDecoration(
                           gradient: LinearGradient(
@@ -289,7 +293,7 @@ class _TDatePickerState extends State<TDatePicker> {
                   child: IgnorePointer(
                     ignoring: true,
                     child: Container(
-                      height: _pickerTitleHeight,
+                      height: maskHeight,
                       width: MediaQuery.of(context).size.width,
                       decoration: BoxDecoration(
                           gradient: LinearGradient(
diff --git a/tdesign-component/lib/src/components/picker/t_multi_picker.dart b/tdesign-component/lib/src/components/picker/t_multi_picker.dart
index 43811cc24..60e3f26de 100644
--- a/tdesign-component/lib/src/components/picker/t_multi_picker.dart
+++ b/tdesign-component/lib/src/components/picker/t_multi_picker.dart
@@ -116,6 +116,10 @@ class TMultiPicker extends StatelessWidget {
     Key? key,
   }) : super(key: key);
 
+  double _getMaskHeight() =>
+      pickerHeight / pickerItemCount *
+      ((pickerItemCount - 1) / 2.0);
+
   @override
   Widget build(BuildContext context) {
     final dataLength = data.length;
@@ -128,6 +132,7 @@ class TMultiPicker extends StatelessWidget {
     );
 
     final maxWidth = MediaQuery.of(context).size.width;
+    final maskHeight = _getMaskHeight();
 
     return Container(
       width: maxWidth,
@@ -159,7 +164,6 @@ class TMultiPicker extends StatelessWidget {
                       ),
                     ),
               ),
-              // 列表
               Container(
                 padding: const EdgeInsets.symmetric(horizontal: 32),
                 height: pickerHeight,
@@ -171,13 +175,12 @@ class TMultiPicker extends StatelessWidget {
                   ),
                 ),
               ),
-              // 蒙层
               Positioned(
                 top: 0,
                 child: IgnorePointer(
                   ignoring: true,
                   child: Container(
-                    height: _pickerTitleHeight,
+                    height: maskHeight,
                     width: MediaQuery.of(context).size.width,
                     decoration: BoxDecoration(
                       gradient: LinearGradient(
@@ -197,7 +200,7 @@ class TMultiPicker extends StatelessWidget {
                 child: IgnorePointer(
                   ignoring: true,
                   child: Container(
-                    height: _pickerTitleHeight,
+                    height: maskHeight,
                     width: MediaQuery.of(context).size.width,
                     decoration: BoxDecoration(
                       gradient: LinearGradient(
@@ -478,9 +481,14 @@ class _TMultiLinkedPickerState extends State<TMultiLinkedPicker> {
     );
   }
 
+  double _getMaskHeight() =>
+      pickerHeight / widget.pickerItemCount *
+      ((widget.pickerItemCount - 1) / 2.0);
+
   @override
   Widget build(BuildContext context) {
     final maxWidth = MediaQuery.of(context).size.width;
+    final maskHeight = _getMaskHeight();
     return Container(
       width: maxWidth,
       padding: widget.padding ??
@@ -510,8 +518,6 @@ class _TMultiLinkedPickerState extends State<TMultiLinkedPicker> {
                               TTheme.of(context).radiusDefault))),
                     ),
               ),
-
-              // 列表
               Container(
                   padding: const EdgeInsets.symmetric(horizontal: 32),
                   height: pickerHeight,
@@ -522,13 +528,12 @@ class _TMultiLinkedPickerState extends State<TMultiLinkedPicker> {
                       (i) => Expanded(child: buildList(context, i)),
                     ),
                   )),
-              // 蒙层
               Positioned(
                 top: 0,
                 child: IgnorePointer(
                   ignoring: true,
                   child: Container(
-                    height: _pickerTitleHeight,
+                    height: maskHeight,
                     width: MediaQuery.of(context).size.width,
                     decoration: BoxDecoration(
                       gradient: LinearGradient(
@@ -548,7 +553,7 @@ class _TMultiLinkedPickerState extends State<TMultiLinkedPicker> {
                 child: IgnorePointer(
                   ignoring: true,
                   child: Container(
-                    height: _pickerTitleHeight,
+                    height: maskHeight,
                     width: MediaQuery.of(context).size.width,
                     decoration: BoxDecoration(
                       gradient: LinearGradient(