|
|
|
|
|
|
using Unity.UIWidgets.foundation; |
|
|
|
using Unity.UIWidgets.material; |
|
|
|
using Unity.UIWidgets.painting; |
|
|
|
using Unity.UIWidgets.rendering; |
|
|
|
using Image = Unity.UIWidgets.widgets.Image; |
|
|
|
using Text = Unity.UIWidgets.widgets.Text; |
|
|
|
using ui_ = Unity.UIWidgets.widgets.ui_; |
|
|
|
using TextStyle = Unity.UIWidgets.painting.TextStyle; |
|
|
|
|
|
|
|
|
|
|
bodyText2: new TextStyle(fontSize: 14.0f) |
|
|
|
) |
|
|
|
), |
|
|
|
home: new ImageFlow() |
|
|
|
home: new Container(color: new Color(0xAF000000), |
|
|
|
child: new ImageFlow()) |
|
|
|
); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
"lottieflow-social-networks-16-7-000000-easey.json", |
|
|
|
}; |
|
|
|
|
|
|
|
public static List<string> imageUrls = new List<string>() |
|
|
|
{ |
|
|
|
"https://cdn.pixabay.com/photo/2016/10/21/14/50/plouzane-1758197_960_720.jpg", |
|
|
|
"https://cdn.pixabay.com/photo/2016/11/16/10/59/mountains-1828596_960_720.jpg", |
|
|
|
"https://cdn.pixabay.com/photo/2017/08/24/22/37/gyrfalcon-2678684_960_720.jpg", |
|
|
|
"https://cdn.pixabay.com/photo/2013/01/17/08/25/sunset-75159_960_720.jpg", |
|
|
|
"https://cdn.pixabay.com/photo/2021/04/06/21/08/crown-anemone-6157488_960_720.jpg", |
|
|
|
"https://cdn.pixabay.com/photo/2021/05/10/10/46/yellow-wall-6243164_960_720.jpg", |
|
|
|
}; |
|
|
|
|
|
|
|
|
|
|
|
public static bool UseImage = true; |
|
|
|
|
|
|
|
public static T RandomSelect<T>(this List<T> a) |
|
|
|
{ |
|
|
|
|
|
|
|
|
|
|
class ImageFlowState : State<ImageFlow> |
|
|
|
{ |
|
|
|
readonly List<StaggeredTile> _staggeredTiles = new List<StaggeredTile> |
|
|
|
public ImageFlowState() |
|
|
|
StaggeredTile.count(2, 2), |
|
|
|
StaggeredTile.count(2, 1), |
|
|
|
}; |
|
|
|
UpdateTiles(); |
|
|
|
} |
|
|
|
|
|
|
|
private readonly List<StaggeredTile> _staggeredTiles = new List<StaggeredTile>(); |
|
|
|
|
|
|
|
private readonly List<Widget> _tiles = new List<Widget>(); |
|
|
|
|
|
|
|
private int count = 4; |
|
|
|
private int tileCount = 10; |
|
|
|
readonly List<Widget> _tiles = new List<Widget> |
|
|
|
public void UpdateTiles() |
|
|
|
new LottieTile(Colors.green, "1055-world-locations.json"), |
|
|
|
new LottieTile(Colors.lightBlue, "1370-confetti.json"), |
|
|
|
}; |
|
|
|
while (_tiles.Count < tileCount) |
|
|
|
{ |
|
|
|
if (Utils.UseImage) |
|
|
|
{ |
|
|
|
_tiles.Add( |
|
|
|
new ImageTile( |
|
|
|
Utils.colors.RandomSelect(), |
|
|
|
Utils.imageUrls.RandomSelect() |
|
|
|
) |
|
|
|
); |
|
|
|
} |
|
|
|
else |
|
|
|
{ |
|
|
|
_tiles.Add( |
|
|
|
new LottieTile( |
|
|
|
Utils.colors.RandomSelect(), |
|
|
|
Utils.lotties.RandomSelect() |
|
|
|
) |
|
|
|
); |
|
|
|
} |
|
|
|
|
|
|
|
_staggeredTiles.Add( |
|
|
|
StaggeredTile.count( |
|
|
|
Utils.random.Next(2) + 1, |
|
|
|
Utils.random.Next(2) + 1) |
|
|
|
); |
|
|
|
} |
|
|
|
private int count = 4; |
|
|
|
while (_tiles.Count > tileCount) |
|
|
|
{ |
|
|
|
_tiles.RemoveAt(0); |
|
|
|
_staggeredTiles.RemoveAt(0); |
|
|
|
} |
|
|
|
} |
|
|
|
return new Scaffold( |
|
|
|
appBar: new AppBar( |
|
|
|
title: new Text("Flow") |
|
|
|
), |
|
|
|
body: |
|
|
|
new Column( |
|
|
|
children: new List<Widget>() |
|
|
|
{ |
|
|
|
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<Widget>() |
|
|
|
return new Column( |
|
|
|
children: new List<Widget>() |
|
|
|
{ |
|
|
|
new Expanded(child: |
|
|
|
new Container( |
|
|
|
child: |
|
|
|
StaggeredGridView.count( |
|
|
|
crossAxisCount: count, |
|
|
|
staggeredTiles: _staggeredTiles, |
|
|
|
mainAxisSpacing: 3, |
|
|
|
crossAxisSpacing: 3, |
|
|
|
padding: EdgeInsets.all(4), |
|
|
|
children: _tiles |
|
|
|
) |
|
|
|
)), |
|
|
|
new Slider( |
|
|
|
activeColor: Colors.blue, |
|
|
|
inactiveColor: Colors.white, |
|
|
|
value: count, |
|
|
|
min: 2, |
|
|
|
max: 8, |
|
|
|
divisions: 6, |
|
|
|
label: count.ToString(), |
|
|
|
onChanged: v => |
|
|
|
{ |
|
|
|
int newCount = (int) v; |
|
|
|
if (newCount != count) |
|
|
|
{ |
|
|
|
setState(() => { count = newCount; }); |
|
|
|
} |
|
|
|
} |
|
|
|
), |
|
|
|
new Slider( |
|
|
|
activeColor: Colors.blue, |
|
|
|
inactiveColor: Colors.white, |
|
|
|
value: tileCount, |
|
|
|
min: 0, |
|
|
|
max: 20, |
|
|
|
divisions: 20, |
|
|
|
label: tileCount.ToString(), |
|
|
|
onChanged: v => |
|
|
|
{ |
|
|
|
int newCount = (int) v; |
|
|
|
if (newCount != tileCount) |
|
|
|
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) |
|
|
|
); |
|
|
|
}); |
|
|
|
}) |
|
|
|
), |
|
|
|
setState(() => |
|
|
|
{ |
|
|
|
tileCount = newCount; |
|
|
|
UpdateTiles(); |
|
|
|
}); |
|
|
|
) |
|
|
|
} |
|
|
|
} |
|
|
|
), |
|
|
|
} |
|
|
|
); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
internal class ImageTile : StatefulWidget |
|
|
|
{ |
|
|
|
internal ImageTile(Color backgroundColor, string path) |
|
|
|
{ |
|
|
|
this.backgroundColor = backgroundColor; |
|
|
|
this.path = path; |
|
|
|
} |
|
|
|
|
|
|
|
public readonly Color backgroundColor; |
|
|
|
public readonly string path; |
|
|
|
|
|
|
|
public override State createState() |
|
|
|
{ |
|
|
|
return new ImageTileState(); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
internal class ImageTileState : State<ImageTile> |
|
|
|
{ |
|
|
|
public override Widget build(BuildContext context) |
|
|
|
{ |
|
|
|
return new Card( |
|
|
|
color: widget.backgroundColor, |
|
|
|
child: new InkWell( |
|
|
|
onTap: () => { }, |
|
|
|
child: Image.network( |
|
|
|
widget.path, |
|
|
|
fit: BoxFit.cover |
|
|
|
) |
|
|
|
) |
|
|
|
); |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
public readonly Color backgroundColor; |
|
|
|
public readonly string path; |
|
|
|
|
|
|
|
|
|
|
|
public override State createState() |
|
|
|
{ |
|
|
|