using System.Collections.Generic; using uiwidgets; using Unity.UIWidgets.engine; 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 Color = Unity.UIWidgets.ui.Color; using FontStyle = Unity.UIWidgets.ui.FontStyle; using Random = System.Random; using Text = Unity.UIWidgets.widgets.Text; using ui_ = Unity.UIWidgets.widgets.ui_; using TextStyle = Unity.UIWidgets.painting.TextStyle; namespace UIWidgetsSample { public class ImageFlowDemo : UIWidgetsPanel { protected void OnEnable() { base.OnEnable(); } protected override void main() { ui_.runApp(new ImageFlowApp()); } } class ImageFlowApp : StatelessWidget { public override Widget build(BuildContext context) { return new MaterialApp( theme: new ThemeData( brightness: Brightness.dark, accentColor: Colors.cyan[600], textTheme: new TextTheme( headline1: new TextStyle(fontSize: 72.0f, fontWeight: FontWeight.bold), headline6: new TextStyle(fontSize: 36.0f, fontStyle: FontStyle.italic), bodyText2: new TextStyle(fontSize: 14.0f) ) ), home: new ImageFlow() ); } } public static class Utils { public static List colors = new List() { Colors.red, Colors.amber, Colors.cyan, Colors.brown, Colors.purpleAccent, Colors.blue }; public static List lotties = new List() { "1055-world-locations.json", "1370-confetti.json", "1798-check-animation.json", "226-splashy-loader.json", "66992-the-flying-rocket.json", "77-im-thirsty.json", "782-check-mark-success.json", "91-mailsent.json", "lottieflow-checkbox-06-000000-easey.json", "lottieflow-cta-04-000000-easey.json", "lottieflow-radio-07-000000-easey.json", "lottieflow-social-networks-16-12-000000-easey.json", "lottieflow-social-networks-16-7-000000-easey.json", }; internal static Random random = new Random(); public static T RandomSelect(this List a) { if (a.isEmpty()) { return default; } return a[random.Next(a.Count)]; } } class ImageFlow : StatefulWidget { public override State createState() { return new ImageFlowState(); } } class ImageFlowState : State { readonly List _staggeredTiles = new List { StaggeredTile.count(2, 2), StaggeredTile.count(2, 1), }; readonly List _tiles = new List { new LottieTile(Colors.green, "1055-world-locations.json"), new LottieTile(Colors.lightBlue, "1370-confetti.json"), }; private int count = 4; public override Widget build(BuildContext context) { return new Scaffold( appBar: new AppBar( title: new Text("Flow") ), body: new Column( children: new List() { new Expanded(child: new Container( child: StaggeredGridView.count( crossAxisCount: count, staggeredTiles: _staggeredTiles, mainAxisSpacing: 3, crossAxisSpacing: 3, padding: EdgeInsets.all(4), children: _tiles ) )), new Row( mainAxisAlignment: MainAxisAlignment.center, children: new List() { new Expanded( child: new MaterialButton( color: Colors.amber, child: new Text("Expand Column", style: new TextStyle(fontSize: 10)), onPressed: () => { setState(() => { count++; }); }) ), new Expanded(child: new MaterialButton( color: Colors.blue, child: new Text("Shrink Column", style: new TextStyle(fontSize: 10)), onPressed: () => { setState(() => { count--; }); }) ), new Expanded(child: new MaterialButton( color: Colors.green, child: new Text("Remove Tile", style: new TextStyle(fontSize: 10)), onPressed: () => { if (!_tiles.isEmpty()) { setState(() => { _tiles.RemoveAt(0); _staggeredTiles.RemoveAt(0); }); } }) ), new Expanded(child: new MaterialButton( color: Colors.pink, child: new Text("Add Tile", style: new TextStyle(fontSize: 10)), onPressed: () => { setState(() => { _tiles.Add( new LottieTile( Utils.colors.RandomSelect(), Utils.lotties.RandomSelect() ) ); _staggeredTiles.Add( StaggeredTile.count( Utils.random.Next(2) + 1, Utils.random.Next(2) + 1) ); }); }) ), } ) } ) ); } } internal class LottieTile : StatefulWidget { internal LottieTile(Color backgroundColor, string path) { this.backgroundColor = backgroundColor; this.path = path; } public readonly Color backgroundColor; public readonly string path; public override State createState() { return new LottieTileState(); } } internal class LottieTileState : State { public override Widget build(BuildContext context) { return new Card( color: widget.backgroundColor, child: new InkWell( onTap: () => { }, child: new Center( child: new Padding( padding: EdgeInsets.all(4), child: new Lottie(widget.path, size: new Size(100, 100)) ) ) ) ); } } }