Flow Widget
Complete Code For Flow Widget In Flutter
main.dart
import 'package:flutter/material.dart'; void main(){ runApp(MyApp()); } class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { return MaterialApp( debugShowCheckedModeBanner: false, home: MyHomePage(), ); } } class MyHomePage extends StatefulWidget { @override MyHomePageState createState() { return new MyHomePageState(); } } class MyHomePageState extends State<MyHomePage> { @override Widget build(BuildContext context) { return Scaffold( backgroundColor: Colors.black, appBar: AppBar( backgroundColor: Colors.blue[900], title: Text("Flow Widget" )), body: Center( child: Flow( delegate: _MyFlowDelegate(), children: <Widget>[ _buildContainer(), _buildContainer(), _buildContainer(), _buildContainer(), _buildContainer(), ], ), ), ); } Widget _buildContainer() { return Padding( padding: const EdgeInsets.only(left:25.0), child: Row( children: [ Container( margin: EdgeInsets.only(bottom: 8.0, top: 8.0,left: 10), height: 50.0, width: 50.0, color: Colors.lightGreen[900], ), Container( margin: EdgeInsets.only(bottom: 8.0, top: 8.0,left: 10), height: 24.0, width: 40.0, color: Colors.lightGreen[700], ), Container( margin: EdgeInsets.only(bottom: 8.0, top: 8.0,left: 10), height: 45.0, width: 50.0, color: Colors.lightGreen[500], ), Container( margin: EdgeInsets.only(bottom: 8.0, top: 8.0,left: 10), height: 45.0, width: 50.0, color: Colors.lightGreen[300], ), Container( margin: EdgeInsets.only(bottom: 8.0, top: 8.0,left: 10), height: 65.0, width: 23.0, color: Colors.lightGreen[100], ), ], ), ); } } class _MyFlowDelegate extends FlowDelegate { @override void paintChildren(FlowPaintingContext context) { double dy = 0.0; double opacity = 0.2; for (int i = 0; i < context.childCount; ++i) { dy = context.getChildSize(i).height * i; context.paintChild( i, transform: Matrix4.translationValues( 0, dy * 0.7, 0, ), ); } } @override bool shouldRepaint(_MyFlowDelegate oldDelegate) { return false; } } class FlowDeg extends FlowDelegate { @override void paintChildren(FlowPaintingContext context) { int count = context.childCount; context.paintChild(0, opacity: .2); context.paintChild(1, opacity: .4); context.paintChild(2, opacity: .6); context.paintChild(3, opacity: .8); context.paintChild(4); } @override bool shouldRepaint(FlowDelegate oldDelegate) { return true; } }