widget: vertical tab bar & reverse row & put away

lib/src/widget/put_away.dart

@@ -60,18 +60,12 @@ class _RenderPutAway extends RenderBox
     }
   }
 
-  Ticker? _ticker;
-
-  @override
-  Ticker createTicker(TickerCallback onTick) {
-    assert(_ticker == null);
-    _ticker = Ticker(onTick);
-    return _ticker!;
-  }
-
   late AnimationController _controller;
   late Animation _animation;
 
+  @override
+  Ticker createTicker(TickerCallback onTick) => Ticker(onTick);
+
   @override
   void attach(covariant PipelineOwner owner) {
     super.attach(owner);
@@ -94,7 +88,6 @@ class _RenderPutAway extends RenderBox
     child!.layout(constraints, parentUsesSize: true);
     _childSize = child!.size;
     switch (_direction) {
-
       case PutAwayDirection.rtl:
         size = Size(
           child!.size.width * (1 - _animation.value),

lib/src/widget/reverse_row.dart → lib/src/widget/reverse_flex.dart

@@ -2,7 +2,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter/rendering.dart';
 
 /// 这里靠继承来实现绝大部分功能
-class ReverseRow extends Flex {
+class ReverseRow extends _ReverseFlex {
   ReverseRow({
     Key? key,
     MainAxisAlignment mainAxisAlignment = MainAxisAlignment.start,
@@ -10,15 +10,61 @@ class ReverseRow extends Flex {
     CrossAxisAlignment crossAxisAlignment = CrossAxisAlignment.center,
     TextDirection? textDirection,
     VerticalDirection verticalDirection = VerticalDirection.down,
-    TextBaseline?
-        textBaseline, // NO DEFAULT: we don't know what the text's baseline should be
+    TextBaseline? textBaseline,
+    List<Widget> children = const <Widget>[],
+  }) : super(
+          key: key,
+          children: children,
+          direction: Axis.horizontal,
+          mainAxisSize: mainAxisSize,
+          mainAxisAlignment: mainAxisAlignment,
+          crossAxisAlignment: crossAxisAlignment,
+          textDirection: textDirection,
+          verticalDirection: verticalDirection,
+          textBaseline: textBaseline,
+        );
+}
+
+class ReverseColumn extends _ReverseFlex {
+  ReverseColumn({
+    Key? key,
+    MainAxisAlignment mainAxisAlignment = MainAxisAlignment.start,
+    MainAxisSize mainAxisSize = MainAxisSize.max,
+    CrossAxisAlignment crossAxisAlignment = CrossAxisAlignment.center,
+    TextDirection? textDirection,
+    VerticalDirection verticalDirection = VerticalDirection.down,
+    TextBaseline? textBaseline,
+    List<Widget> children = const <Widget>[],
+  }) : super(
+          key: key,
+          children: children,
+          direction: Axis.vertical,
+          mainAxisSize: mainAxisSize,
+          mainAxisAlignment: mainAxisAlignment,
+          crossAxisAlignment: crossAxisAlignment,
+          textDirection: textDirection,
+          verticalDirection: verticalDirection,
+          textBaseline: textBaseline,
+        );
+}
+
+class _ReverseFlex extends Flex {
+  _ReverseFlex({
+    Key? key,
+    required Axis direction,
+    MainAxisAlignment mainAxisAlignment = MainAxisAlignment.start,
+    MainAxisSize mainAxisSize = MainAxisSize.max,
+    CrossAxisAlignment crossAxisAlignment = CrossAxisAlignment.center,
+    TextDirection? textDirection,
+    VerticalDirection verticalDirection = VerticalDirection.down,
+    TextBaseline? textBaseline,
     List<Widget> children = const <Widget>[],
   }) : super(
           children: children,
           key: key,
+          direction: direction,
           mainAxisAlignment: mainAxisAlignment,
           mainAxisSize: mainAxisSize,
-          direction: Axis.horizontal,
           crossAxisAlignment: crossAxisAlignment,
           textDirection: textDirection,
           verticalDirection: verticalDirection,
@@ -26,8 +72,8 @@ class ReverseRow extends Flex {
         );
 
   @override
-  _RenderReverseRow createRenderObject(BuildContext context) {
-    return _RenderReverseRow(
+  RenderFlex createRenderObject(BuildContext context) {
+    return _RenderReverseFlex(
       direction: direction,
       mainAxisAlignment: mainAxisAlignment,
       mainAxisSize: mainAxisSize,
@@ -54,8 +100,8 @@ class ReverseRow extends Flex {
   }
 }
 
-class _RenderReverseRow extends RenderFlex {
-  _RenderReverseRow({
+class _RenderReverseFlex extends RenderFlex {
+  _RenderReverseFlex({
     List<RenderBox>? children,
     Axis direction = Axis.horizontal,
     MainAxisSize mainAxisSize = MainAxisSize.max,

lib/src/widget/vertical_tab_bar.dart

@@ -683,6 +683,48 @@ class _RenderTabWrapper extends RenderBox
   }
 }
 
+class _ClipRectTab extends SingleChildRenderObjectWidget {
+  const _ClipRectTab({
+    Key? key,
+    required Widget child,
+  }) : super(key: key, child: child);
+
+  @override
+  RenderObject createRenderObject(BuildContext context) {
+    return _RenderClipRectTab();
+  }
+}
+
+class _RenderClipRectTab extends RenderBox
+    with RenderObjectWithChildMixin<_RenderTabWrapper> {
+  _RenderClipRectTab();
+
+  @override
+  _RenderTabWrapper? get child => super.child as _RenderTabWrapper;
+
+  @override
+  void performLayout() {
+    child!.layout(constraints, parentUsesSize: true);
+    size = child!.size;
+  }
+
+  @override
+  bool hitTest(BoxHitTestResult result, {required Offset position}) {
+    return child!.hitTest(result, position: position);
+  }
+
+  @override
+  void paint(PaintingContext context, Offset offset) {
+    super.paint(context, offset);
+    context.pushClipRect(
+      needsCompositing,
+      offset,
+      Offset.zero & Size(size.width + 40, size.height),
+      child!.paint,
+    );
+  }
+}
+
 class VerticalTabBar extends StatefulWidget implements PreferredSizeWidget {
   /// Creates a material design tab bar.
   ///
@@ -718,7 +760,6 @@ class VerticalTabBar extends StatefulWidget implements PreferredSizeWidget {
     this.dragStartBehavior = DragStartBehavior.start,
     this.overlayColor,
     this.mouseCursor,
-    this.enableFeedback,
     this.onTap,
     this.physics,
   })  : assert(tabs != null),
@@ -883,14 +924,6 @@ class VerticalTabBar extends StatefulWidget implements PreferredSizeWidget {
   /// If this property is null, [SystemMouseCursors.click] will be used.
   final MouseCursor? mouseCursor;
 
-  /// Whether detected gestures should provide acoustic and/or haptic feedback.
-  ///
-  /// For example, on Android a tap will produce a clicking sound and a long-press
-  /// will produce a short vibration, when feedback is enabled.
-  ///
-  /// Defaults to true.
-  final bool? enableFeedback;
-
   /// An optional callback that's called when the [VerticalTabBar] is tapped.
   ///
   /// The callback is applied to the index of the tab where the tap occurred.
@@ -1109,7 +1142,8 @@ class _VerticalTabBarState extends State<VerticalTabBar> {
   }
 
   void _scrollToCurrentIndex() {
-    final double offset = _tabCenteredScrollOffset(_tabKeys.length - _currentIndex! - 1);
+    final double offset =
+        _tabCenteredScrollOffset(_tabKeys.length - _currentIndex! - 1);
     _scrollController!
         .animateTo(offset, duration: kTabScrollDuration, curve: Curves.ease);
   }
@@ -1335,7 +1369,7 @@ class _VerticalTabBarState extends State<VerticalTabBar> {
     if (widget.isScrollable) {
       _scrollController ??= _TabBarScrollController(this);
       tabBar = SingleChildScrollView(
-        clipBehavior:Clip.none,
+        clipBehavior: Clip.none,
         dragStartBehavior: widget.dragStartBehavior,
         reverse: true,
         scrollDirection: Axis.horizontal,
@@ -1351,6 +1385,8 @@ class _VerticalTabBarState extends State<VerticalTabBar> {
       );
     }
 
-    return _TabWrapper(child: tabBar);
+    return _TabWrapper(
+      child: tabBar,
+    );
   }
 }

lib/widget.dart

@@ -1,4 +1,4 @@
 export 'src/widget/put_away.dart';
 export 'src/widget/radar_chart.dart';
-export 'src/widget/reverse_row.dart';
+export 'src/widget/reverse_flex.dart';
 export 'src/widget/vertical_tab_bar.dart';