material tab widgets

Runtime/material/theme_data.cs

             IconThemeData iconTheme = null,
             IconThemeData primaryIconTheme = null,
             IconThemeData accentIconTheme = null,
+            TabBarTheme tabBarTheme = null,
             RuntimePlatform? platform = null,
             MaterialTapTargetSize? materialTapTargetSize = null,
             PageTransitionsTheme pageTransitionsTheme = null,
                               ? ThemeDataUtils._kDarkThemeSplashColor
                               : ThemeDataUtils._kLightThemeSplashColor);
 
+            tabBarTheme = tabBarTheme ?? new TabBarTheme();
             dialogTheme = dialogTheme ?? new DialogTheme();
 
             D.assert(brightness != null);
             D.assert(colorScheme != null);
             D.assert(typography != null);
             D.assert(buttonColor != null);
+            D.assert(tabBarTheme != null);
             D.assert(dialogTheme != null);
 
             this.brightness = brightness ?? Brightness.light;
             this.iconTheme = iconTheme;
             this.primaryIconTheme = primaryIconTheme;
             this.accentIconTheme = accentIconTheme;
+            this.tabBarTheme = tabBarTheme;
             this.platform = platform.Value;
             this.materialTapTargetSize = materialTapTargetSize ?? MaterialTapTargetSize.padded;
             this.pageTransitionsTheme = pageTransitionsTheme;
             IconThemeData iconTheme = null,
             IconThemeData primaryIconTheme = null,
             IconThemeData accentIconTheme = null,
+            TabBarTheme tabBarTheme = null,
             RuntimePlatform? platform = null,
             MaterialTapTargetSize? materialTapTargetSize = null,
             PageTransitionsTheme pageTransitionsTheme = null,
             D.assert(colorScheme != null);
             D.assert(typography != null);
             D.assert(buttonColor != null);
+            D.assert(tabBarTheme != null);
             D.assert(dialogTheme != null);
 
             return new ThemeData(
                 iconTheme: iconTheme,
                 primaryIconTheme: primaryIconTheme,
                 accentIconTheme: accentIconTheme,
+                tabBarTheme: tabBarTheme,
                 platform: platform,
                 materialTapTargetSize: materialTapTargetSize,
                 pageTransitionsTheme: pageTransitionsTheme,
 
         public readonly IconThemeData accentIconTheme;
 
+        public readonly TabBarTheme tabBarTheme;
+
         public readonly RuntimePlatform platform;
 
         public readonly MaterialTapTargetSize materialTapTargetSize;
             IconThemeData iconTheme = null,
             IconThemeData primaryIconTheme = null,
             IconThemeData accentIconTheme = null,
+            TabBarTheme tabBarTheme = null,
             RuntimePlatform? platform = null,
             MaterialTapTargetSize? materialTapTargetSize = null,
             PageTransitionsTheme pageTransitionsTheme = null,
                 iconTheme: iconTheme ?? this.iconTheme,
                 primaryIconTheme: primaryIconTheme ?? this.primaryIconTheme,
                 accentIconTheme: accentIconTheme ?? this.accentIconTheme,
+                tabBarTheme: tabBarTheme ?? this.tabBarTheme,
                 platform: platform ?? this.platform,
                 materialTapTargetSize: materialTapTargetSize ?? this.materialTapTargetSize,
                 pageTransitionsTheme: pageTransitionsTheme ?? this.pageTransitionsTheme,
                 iconTheme: IconThemeData.lerp(a.iconTheme, b.iconTheme, t),
                 primaryIconTheme: IconThemeData.lerp(a.primaryIconTheme, b.primaryIconTheme, t),
                 accentIconTheme: IconThemeData.lerp(a.accentIconTheme, b.accentIconTheme, t),
+                tabBarTheme: TabBarTheme.lerp(a.tabBarTheme, b.tabBarTheme, t),
                 platform: t < 0.5 ? a.platform : b.platform,
                 materialTapTargetSize: t < 0.5 ? a.materialTapTargetSize : b.materialTapTargetSize,
                 pageTransitionsTheme: t < 0.5 ? a.pageTransitionsTheme : b.pageTransitionsTheme,
                    other.iconTheme == this.iconTheme &&
                    other.primaryIconTheme == this.primaryIconTheme &&
                    other.accentIconTheme == this.accentIconTheme &&
+                   other.tabBarTheme == this.tabBarTheme &&
                    other.platform == this.platform &&
                    other.materialTapTargetSize == this.materialTapTargetSize &&
                    other.pageTransitionsTheme == this.pageTransitionsTheme &&
                 hashCode = (hashCode * 397) ^ this.iconTheme.GetHashCode();
                 hashCode = (hashCode * 397) ^ this.primaryIconTheme.GetHashCode();
                 hashCode = (hashCode * 397) ^ this.accentIconTheme.GetHashCode();
+                hashCode = (hashCode * 397) ^ this.tabBarTheme.GetHashCode();
                 hashCode = (hashCode * 397) ^ this.platform.GetHashCode();
                 hashCode = (hashCode * 397) ^ this.materialTapTargetSize.GetHashCode();
                 hashCode = (hashCode * 397) ^ this.pageTransitionsTheme.GetHashCode();
             properties.add(new DiagnosticsProperty<IconThemeData>("iconTheme", this.iconTheme));
             properties.add(new DiagnosticsProperty<IconThemeData>("primaryIconTheme", this.primaryIconTheme));
             properties.add(new DiagnosticsProperty<IconThemeData>("accentIconTheme", this.accentIconTheme));
+            properties.add(new DiagnosticsProperty<TabBarTheme>("tabBarTheme", this.tabBarTheme));
             properties.add(
                 new DiagnosticsProperty<MaterialTapTargetSize>("materialTapTargetSize", this.materialTapTargetSize));
             properties.add(

Runtime/widgets/perferred_size.cs

     }
 
 
-    public class PreferredSize : StatelessWidget, SizePreferred {
+    public class PreferredSize : PreferredSizeWidget {
         public PreferredSize(
             Key key = null,
             Widget child = null,
 
         public readonly Widget child;
 
-        public Size preferredSize { get; }
+        public override Size preferredSize { get; }
+        public override State createState() {
+            return new _PreferredSizeState();
+        }
+    }
+
+    class _PreferredSizeState : State<PreferredSize> {
-            return this.child;
+            return this.widget.child;
         }
     }
 }

Samples/UIWidgetSample/MaterialSample.cs

 
 namespace UIWidgetsSample {
     public class MaterialSample : UIWidgetsSamplePanel {
-        int testCaseId = 2;
+        int testCaseId = 3;
-            new MaterialAppBarWidget()
+            new MaterialAppBarWidget(),
+            new MaterialTabBarWidget()
-                showPerformanceOverlay: true,
+                showPerformanceOverlay: false,
                 home: this.testCases[this.testCaseId]);
         }
 
+        }
+    }
+
+
+    class MaterialTabBarWidget : StatefulWidget {
+        public MaterialTabBarWidget(Key key = null) : base(key) {
+        }
+
+        public override State createState() {
+            return new MaterialTabBarWidgetState();
+        }
+    }
+
+    class MaterialTabBarWidgetState : SingleTickerProviderStateMixin<MaterialTabBarWidget> {
+        TabController _tabController;
+
+        public override void initState() {
+            base.initState();
+            this._tabController = new TabController(vsync: this, length: Choice.choices.Count);
+        }
+
+        public override void dispose() {
+            this._tabController.dispose();
+            base.dispose();
+        }
+
+        void _nextPage(int delta) {
+            int newIndex = this._tabController.index + delta;
+            if (newIndex < 0 || newIndex >= this._tabController.length) {
+                return;
+            }
+
+            this._tabController.animateTo(newIndex);
+        }
+
+        public override Widget build(BuildContext context) {
+            List<Widget> tapChildren = new List<Widget>();
+            foreach (Choice choice in Choice.choices) {
+                tapChildren.Add(
+                    new Padding(
+                        padding: EdgeInsets.all(16.0f),
+                        child: new ChoiceCard(choice: choice)));
+            }
+
+            return new Scaffold(
+                appBar: new AppBar(
+                    title: new Center(
+                        child: new Text("AppBar Bottom Widget")
+                        ),
+                    leading: new IconButton(
+                        tooltip: "Previous choice",
+                        icon: new Icon(Unity.UIWidgets.material.Icons.arrow_back),
+                        onPressed: () => { this._nextPage(-1); }
+                    ),
+                    actions: new List<Widget> {
+                        new IconButton(
+                            icon: new Icon(Unity.UIWidgets.material.Icons.arrow_forward),
+                            tooltip: "Next choice",
+                            onPressed: () => { this._nextPage(1); })
+                    },
+                    bottom: new PreferredSize(
+                        preferredSize: Size.fromHeight(48.0f),
+                        child: new Theme(
+                            data: Theme.of(context).copyWith(accentColor: Colors.white),
+                            child: new Container(
+                                height: 48.0f,
+                                alignment: Alignment.center,
+                                child: new TabPageSelector(
+                                    controller: this._tabController))))
+                ),
+                body: new TabBarView(
+                    controller: this._tabController,
+                    children: tapChildren
+                ));
         }
     }
 

Runtime/material/tab_bar_theme.cs

+using System;
+using Unity.UIWidgets.foundation;
+using Unity.UIWidgets.painting;
+using Unity.UIWidgets.ui;
+using Unity.UIWidgets.widgets;
+
+namespace Unity.UIWidgets.material {
+    public class TabBarTheme : Diagnosticable, IEquatable<TabBarTheme> {
+        public TabBarTheme(
+            Decoration indicator = null,
+            TabBarIndicatorSize? indicatorSize = null,
+            Color labelColor = null,
+            Color unselectedLabelColor = null) {
+            this.indicator = indicator;
+            this.indicatorSize = indicatorSize;
+            this.labelColor = labelColor;
+            this.unselectedLabelColor = unselectedLabelColor;
+        }
+
+        public readonly Decoration indicator;
+
+        public readonly TabBarIndicatorSize? indicatorSize;
+
+        public readonly Color labelColor;
+
+        public readonly Color unselectedLabelColor;
+
+        public TabBarTheme copyWith(
+            Decoration indicator = null,
+            TabBarIndicatorSize? indicatorSize = null,
+            Color labelColor = null,
+            Color unselectedLabelColor = null) {
+            return new TabBarTheme(
+                indicator: indicator ?? this.indicator,
+                indicatorSize: indicatorSize ?? this.indicatorSize,
+                labelColor: labelColor ?? this.labelColor,
+                unselectedLabelColor: unselectedLabelColor ?? this.unselectedLabelColor);
+        }
+
+        public static TabBarTheme of(BuildContext context) {
+            return Theme.of(context).tabBarTheme;
+        }
+
+        public static TabBarTheme lerp(TabBarTheme a, TabBarTheme b, float t) {
+            D.assert(a != null);
+            D.assert(b != null);
+            return new TabBarTheme(
+                indicator: Decoration.lerp(a.indicator, b.indicator, t),
+                indicatorSize: t < 0.5 ? a.indicatorSize : b.indicatorSize,
+                labelColor: Color.lerp(a.labelColor, b.labelColor, t),
+                unselectedLabelColor: Color.lerp(a.unselectedLabelColor, b.unselectedLabelColor, t)
+            );
+        }
+
+        public override int GetHashCode() {
+            unchecked {
+                var hashCode = (this.indicator != null ? this.indicator.GetHashCode() : 0);
+                hashCode = (hashCode * 397) ^ (this.indicatorSize != null ? this.indicatorSize.GetHashCode() : 0);
+                hashCode = (hashCode * 397) ^ (this.labelColor != null ? this.labelColor.GetHashCode() : 0);
+                hashCode = (hashCode * 397) ^
+                           (this.unselectedLabelColor != null ? this.unselectedLabelColor.GetHashCode() : 0);
+                return hashCode;
+            }
+        }
+
+
+        public bool Equals(TabBarTheme other) {
+            if (ReferenceEquals(null, other)) {
+                return false;
+            }
+
+            if (ReferenceEquals(this, other)) {
+                return true;
+            }
+
+            return other.indicator == this.indicator &&
+                   other.indicatorSize == this.indicatorSize &&
+                   other.labelColor == this.labelColor &&
+                   other.unselectedLabelColor == this.unselectedLabelColor;
+        }
+
+        public override bool Equals(object obj) {
+            if (ReferenceEquals(null, obj)) {
+                return false;
+            }
+
+            if (ReferenceEquals(this, obj)) {
+                return true;
+            }
+
+            if (obj.GetType() != this.GetType()) {
+                return false;
+            }
+
+            return this.Equals((TabBarTheme) obj);
+        }
+
+        public static bool operator ==(TabBarTheme left, TabBarTheme right) {
+            return Equals(left, right);
+        }
+
+        public static bool operator !=(TabBarTheme left, TabBarTheme right) {
+            return !Equals(left, right);
+        }
+    }
+}

Runtime/material/tab_bar_theme.cs.meta

+fileFormatVersion: 2
+guid: e5dde8f06134e4f07a597b48fa14a6eb
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Runtime/material/tab_controller.cs

+using System;
+using Unity.UIWidgets.animation;
+using Unity.UIWidgets.foundation;
+using Unity.UIWidgets.scheduler;
+using Unity.UIWidgets.widgets;
+
+namespace Unity.UIWidgets.material {
+    public class TabController : ChangeNotifier {
+        public TabController(
+            int initialIndex = 0,
+            int length = 0,
+            TickerProvider vsync = null) {
+            D.assert(length >= 0);
+            D.assert(initialIndex >= 0 && (length == 0 || initialIndex < length));
+            this._index = initialIndex;
+            this._previousIndex = initialIndex;
+            this.length = length;
+            this._animationController = length < 2
+                ? null
+                : new AnimationController(
+                    value: initialIndex,
+                    upperBound: (length - 1),
+                    vsync: vsync);
+        }
+
+        public Animation<float> animation {
+            get { return this._animationController?.view ?? Animations.kAlwaysCompleteAnimation; }
+        }
+
+        AnimationController _animationController;
+
+        public readonly int length;
+
+        void _changeIndex(int value, TimeSpan? duration = null, Curve curve = null) {
+            D.assert(value >= 0 && (value < this.length || this.length == 0));
+            D.assert(duration == null ? curve == null : true);
+            D.assert(this._indexIsChangingCount >= 0);
+            if (value == this._index || this.length < 2) {
+                return;
+            }
+
+            this._previousIndex = this.index;
+            this._index = value;
+            if (duration != null) {
+                this._indexIsChangingCount++;
+                this.notifyListeners();
+                this._animationController.animateTo(
+                    this._index, duration: duration, curve: curve).whenCompleteOrCancel(() => {
+                    this._indexIsChangingCount--;
+                    this.notifyListeners();
+                });
+            }
+            else {
+                this._indexIsChangingCount++;
+                this._animationController.setValue(this._index);
+                this._indexIsChangingCount--;
+                this.notifyListeners();
+            }
+        }
+
+        public int index {
+            get { return this._index; }
+            set { this._changeIndex(value); }
+        }
+
+        int _index;
+
+        public int previousIndex {
+            get { return this._previousIndex; }
+        }
+
+        int _previousIndex;
+
+        public bool indexIsChanging {
+            get { return this._indexIsChangingCount != 0; }
+        }
+
+        int _indexIsChangingCount = 0;
+
+        public void animateTo(int value, TimeSpan? duration = null, Curve curve = null) {
+            duration = duration ?? Constants.kTabScrollDuration;
+            curve = curve ?? Curves.ease;
+            this._changeIndex(value, duration: duration, curve: curve);
+        }
+
+        public float offset {
+            get { return this.length > 1 ? this._animationController.value - this._index : 0.0f; }
+            set {
+                D.assert(this.length > 1);
+                D.assert(value >= -1.0f && value <= 1.0f);
+                D.assert(!this.indexIsChanging);
+                if (value == this.offset) {
+                    return;
+                }
+
+                this._animationController.setValue(value + this._index);
+            }
+        }
+
+        public override void dispose() {
+            this._animationController?.dispose();
+            base.dispose();
+        }
+    }
+
+    class _TabControllerScope : InheritedWidget {
+        public _TabControllerScope(
+            Key key = null,
+            TabController controller = null,
+            bool? enabled = null,
+            Widget child = null
+        ) : base(key: key, child: child) {
+            this.controller = controller;
+            this.enabled = enabled;
+        }
+
+        public readonly TabController controller;
+        public readonly bool? enabled;
+
+        public override bool updateShouldNotify(InheritedWidget old) {
+            _TabControllerScope _old = (_TabControllerScope) old;
+            return this.enabled != _old.enabled || this.controller != _old.controller;
+        }
+    }
+
+    class DefaultTabController : StatefulWidget {
+        public DefaultTabController(
+            Key key = null,
+            int? length = null,
+            int initialIndex = 0,
+            Widget child = null
+        ) : base(key: key) {
+            D.assert(length != null);
+            D.assert(child != null);
+            this.length = length;
+            this.initialIndex = initialIndex;
+            this.child = child;
+        }
+
+        public readonly int? length;
+
+        public readonly int initialIndex;
+
+        public readonly Widget child;
+
+        public static TabController of(BuildContext context) {
+            _TabControllerScope scope =
+                (_TabControllerScope) context.inheritFromWidgetOfExactType(typeof(_TabControllerScope));
+            return scope?.controller;
+        }
+
+        public override State createState() {
+            return new _DefaultTabControllerState();
+        }
+    }
+
+    class _DefaultTabControllerState : SingleTickerProviderStateMixin<DefaultTabController> {
+        TabController _controller;
+
+        public override void initState() {
+            base.initState();
+            this._controller = new TabController(
+                vsync: this,
+                length: this.widget.length.Value,
+                initialIndex: this.widget.initialIndex
+            );
+        }
+
+        public override void dispose() {
+            this._controller.dispose();
+            base.dispose();
+        }
+
+        public override Widget build(BuildContext context) {
+            return new _TabControllerScope(
+                controller: this._controller,
+                enabled: TickerMode.of(context),
+                child: this.widget.child
+            );
+        }
+    }
+}

Runtime/material/tab_controller.cs.meta

+fileFormatVersion: 2
+guid: f6cf1d3578f4a4effa3b0988822e3b2e
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Runtime/material/tab_indicator.cs

+using Unity.UIWidgets.foundation;
+using Unity.UIWidgets.painting;
+using Unity.UIWidgets.ui;
+
+namespace Unity.UIWidgets.material {
+    public class UnderlineTabIndicator : Decoration {
+        public UnderlineTabIndicator(
+            BorderSide borderSide = null,
+            EdgeInsets insets = null) {
+            borderSide = borderSide ?? new BorderSide(width: 2.0f, color: Colors.white);
+            insets = insets ?? EdgeInsets.zero;
+            this.borderSide = borderSide;
+            this.insets = insets;
+        }
+
+        public readonly BorderSide borderSide;
+
+        public readonly EdgeInsets insets;
+
+        public override Decoration lerpFrom(Decoration a, float t) {
+            if (a is UnderlineTabIndicator) {
+                UnderlineTabIndicator _a = (UnderlineTabIndicator) a;
+                return new UnderlineTabIndicator(
+                    borderSide: BorderSide.lerp(_a.borderSide, this.borderSide, t),
+                    insets: EdgeInsets.lerp(_a.insets, this.insets, t)
+                );
+            }
+
+            return base.lerpFrom(a, t);
+        }
+
+        public override Decoration lerpTo(Decoration b, float t) {
+            if (b is UnderlineTabIndicator) {
+                UnderlineTabIndicator _b = (UnderlineTabIndicator) b;
+                return new UnderlineTabIndicator(
+                    borderSide: BorderSide.lerp(this.borderSide, _b.borderSide, t),
+                    insets: EdgeInsets.lerp(this.insets, _b.insets, t)
+                );
+            }
+
+            return base.lerpTo(b, t);
+        }
+
+
+        public override BoxPainter createBoxPainter(VoidCallback onChanged) {
+            return new _UnderlinePainter(this, onChanged);
+        }
+    }
+
+
+    class _UnderlinePainter : BoxPainter {
+        public _UnderlinePainter(
+            UnderlineTabIndicator decoration = null,
+            VoidCallback onChanged = null
+        ) : base(onChanged: onChanged) {
+            D.assert(decoration != null);
+            this.decoration = decoration;
+        }
+
+        public readonly UnderlineTabIndicator decoration;
+
+        public BorderSide borderSide {
+            get { return this.decoration.borderSide; }
+        }
+
+        public EdgeInsets insets {
+            get { return this.decoration.insets; }
+        }
+
+        Rect _indicatorRectFor(Rect rect) {
+            D.assert(rect != null);
+            Rect indicator = this.insets.deflateRect(rect);
+            return Rect.fromLTWH(
+                indicator.left,
+                indicator.bottom - this.borderSide.width,
+                indicator.width,
+                this.borderSide.width);
+        }
+
+        public override void paint(Canvas canvas, Offset offset, ImageConfiguration configuration) {
+            D.assert(configuration != null);
+            D.assert(configuration.size != null);
+            Rect rect = offset & configuration.size;
+            Rect indicator = this._indicatorRectFor(rect).deflate(this.borderSide.width / 2.0f);
+            Paint paint = this.borderSide.toPaint();
+            paint.strokeCap = StrokeCap.square;
+            canvas.drawLine(indicator.bottomLeft, indicator.bottomRight, paint);
+        }
+    }
+}

Runtime/material/tab_indicator.cs.meta

+fileFormatVersion: 2
+guid: 07582ba5529ac435f98f69a5eea30831
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: 

Runtime/material/tabs.cs.meta

+fileFormatVersion: 2
+guid: 27058ed141c4f4476a7db65aacfda644
+MonoImporter:
+  externalObjects: {}
+  serializedVersion: 2
+  defaultReferences: []
+  executionOrder: 0
+  icon: {instanceID: 0}
+  userData: 
+  assetBundleName: 
+  assetBundleVariant: