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 { 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 { 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 { 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() { 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(); } ) ) ) ), new OutlineButton( onPressed: () => { heroItem.heroType = description.heroType; Navigator.of(context).pop(); }, 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 animation, Animation secondaryAnimation) => { return new AnimatedBuilder( animation: animation, builder: (BuildContext subSubContext, Widget child) => { return new Opacity( opacity: opacityCurve.transform(animation.value), child: _buildPage(context, imageName, description) ); } ); } ) ); } ) ) ) ); } } }