awesome-uiwidgets/AwesomeUIWidgets/Assets/Scripts/heroSample/widgets.cs

using System.Collections.Generic;
using uiwidgets;
using Unity.UIWidgets.animation;
using Unity.UIWidgets.foundation;
using Unity.UIWidgets.material;
using Unity.UIWidgets.painting;
using Unity.UIWidgets.rendering;
using Unity.UIWidgets.ui;
using Unity.UIWidgets.widgets;
using UnityEngine;
using Color = Unity.UIWidgets.ui.Color;
using Image = Unity.UIWidgets.widgets.Image;
using Rect = Unity.UIWidgets.ui.Rect;
using TextStyle = Unity.UIWidgets.painting.TextStyle;
using Transform = Unity.UIWidgets.widgets.Transform;

namespace UIWidgetsGallery.gallery {
    class AnimationWidgetsUtils {
        public const float kSectionIndicatorWidth = 32.0f;
    }

    public class SectionCard : StatelessWidget {
        public SectionCard(
            Key key = null,
            Section section = null
        ) : base(key: key) {
            D.assert(section != null);
            this.section = section;
        }

        public readonly Section section;

        public override Widget build(BuildContext context) {
            return new DecoratedBox(
                decoration: new BoxDecoration(
                    gradient: new LinearGradient(
                        begin: Alignment.centerLeft,
                        end: Alignment.centerRight,
                        colors: new List<Color> {
                            this.section.leftColor, this.section.rightColor
                        }
                    )
                ),
                /*child: Image.asset(this.section.backgroundAsset,
                    color: Color.fromRGBO(255, 255, 255, 0.075f),
                    colorBlendMode: BlendMode.modulate,
                    fit: BoxFit.cover
                )*/
                child: new Container()
            );
        }
    }

    public class SectionTitle : StatelessWidget {
        public SectionTitle(
            Key key = null,
            Section section = null,
            float? scale = null,
            float? opacity = null
        ) : base(key: key) {
            D.assert(section != null);
            D.assert(scale != null);
            D.assert(opacity != null && opacity >= 0.0f && opacity <= 1.0f);
            this.section = section;
            this.scale = scale;
            this.opacity = opacity;
        }

        public readonly Section section;
        public readonly float? scale;
        public readonly float? opacity;

        public static readonly TextStyle sectionTitleStyle = new TextStyle(
            fontFamily: "Raleway",
            inherit: false,
            fontSize: 24.0f,
            fontWeight: FontWeight.w500,
            color: Colors.white,
            textBaseline: TextBaseline.alphabetic
        );

        public static readonly TextStyle sectionTitleShadowStyle = sectionTitleStyle.copyWith(
            color: new Color(0x19000000)
        );

        public override Widget build(BuildContext context) {
            var scale = this.scale ?? 1.0f;
            return new IgnorePointer(
                child: new Opacity(
                    opacity: this.opacity ?? 1.0f,
                    child: new Transform(
                        transform: Matrix4.diagonal3(new Vector3(scale, scale, scale)),
                        alignment: Alignment.center,
                        child: new Stack(
                            children: new List<Widget> {
                                new Positioned(
                                    top: 4.0f,
                                    child: new Text(this.section.title, style: sectionTitleShadowStyle)
                                ),
                                new Text(this.section.title, style: sectionTitleStyle)
                            }
                        )
                    )
                )
            );
        }
    }

    public class SectionIndicator : StatelessWidget {
        public SectionIndicator(Key key = null, float opacity = 1.0f) : base(key: key) {
            this.opacity = opacity;
        }

        public readonly float opacity;

        public override Widget build(BuildContext context) {
            return new IgnorePointer(
                child: new Container(
                    width: AnimationWidgetsUtils.kSectionIndicatorWidth,
                    height: 3.0f,
                    color: Colors.white.withOpacity(this.opacity)
                )
            );
        }
    }

    public class SectionDetailView : StatelessWidget {
        public SectionDetailView(
            Key key = null,
            Section detail = null
        ) : base(key: key) {
            this.detail = detail;
        }

        public readonly Section detail;

        public override Widget build(BuildContext context)
        {
            return new Column(
                
                children: new List<Widget>
                {
                    new Padding(padding: EdgeInsets.only(top: 50f)),
                    _buildHero(context, detail.details[0].imageAsset, detail),
                    new Padding(
                        padding: EdgeInsets.symmetric(vertical: 15f, horizontal: 20f),
                        child: new Text(data: detail.details[0].title, style: new TextStyle(color: Color.white)))
                });
        }
        
        const float kMinRadius = 64.0f;
        const float kMaxRadius = 96.0f;
        static Interval opacityCurve = new Interval(0.0f, 0.75f, curve: Curves.fastOutSlowIn);

        static RectTween _createRectTween(Rect begin, Rect end) {
            return new MaterialRectCenterArcTween(begin: begin, end: end);
        }

        static Widget _buildPage(BuildContext context, string imageName, Section description)
        {
            return new Container(
                color: description.leftColor,
                child: new Center(
                    child: new Card(
                        elevation: 8.0f,
                        color: description.rightColor,
                        child: new Column(
                            mainAxisSize: MainAxisSize.min,
                            children: new List<Widget>() {
                            new SizedBox(
                                width: kMaxRadius * 2.0f,
                                height: kMaxRadius * 2.0f,
                                child: new Hero(
                                    createRectTween: _createRectTween,
                                    tag: imageName,
                                    child: new RadialExpansion(
                                        maxRadius: kMaxRadius,
                                        child: new Photo(
                                            photo: imageName,
                                            onTap: () =>
                                            {
                                                Navigator.of(context).pop<object>();
                                            }
                                            
            )
            )
            )
            ),
            new OutlineButton(
                onPressed: () =>
                {
                    heroItem.heroType = description.heroType;
                    Navigator.of(context).pop<object>();
                },
                borderSide:new BorderSide(color: Colors.white),
                highlightedBorderColor: Colors.transparent,
                child: new Text(
                    "Choose",
                    style: new TextStyle(fontWeight: FontWeight.bold, color: Colors.white),
                    textScaleFactor: 1.5f
                )),
            new SizedBox(height: 16.0f)
                }
                )
                )
                )
                );
        }
        
        Widget _buildHero(BuildContext context, string imageName, Section description) {
            return new Container(
                width: kMinRadius * 2.0f,
                height: kMinRadius * 2.0f,
                child: new Hero(
                    createRectTween: _createRectTween,
                    tag: imageName,
                    child: new RadialExpansion(
                        maxRadius: kMaxRadius,
                        child: new Photo(
                            photo: imageName,
                            onTap: () => {
                    Navigator.of(context).push(
                    new PageRouteBuilder(
                        pageBuilder: (BuildContext subContext, Animation<float> animation, Animation<float> secondaryAnimation) => {
                    return new AnimatedBuilder(
                        animation: animation,
                        builder: (BuildContext subSubContext, Widget child) => {
                        return new Opacity(
                            opacity: opacityCurve.transform(animation.value),
                            child: _buildPage(context, imageName, description)
                        );
                    }
                    );
                }
                )
                );
            }
            )
            )
            )
            );
        }
    }
}