短視訊app開發，Flutter StaggeredGridView的瀑布流效果實現的相關程式碼

dependencies:
   flutter_staggered_grid_view: 0.4.0
import 'dart:math';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
void main(List<String> args) {
 runApp(app());
}
class app extends StatelessWidget {
 const app({Key key}) : super(key: key);
 @override
 Widget build(BuildContext context) {
  return MaterialApp(
   home: homebody(),
  );
 }
}
class homebody extends StatelessWidget {
 @override
 Widget build(BuildContext context) {
  return Scaffold(
   appBar: AppBar(
    title: const Text('StaggeredGridView'),
   ),
   body: Padding(
    padding: const EdgeInsets.all(4),
    child: StaggeredGridView.countBuilder(
      shrinkWrap: true,
      crossAxisCount: 4,
      crossAxisSpacing: 4,
      mainAxisSpacing: 4,
      itemCount: 100,
      itemBuilder: (context, index) {
       return Container(
        height:100+200*Random().nextDouble(),
         color: Colors.green,
         child: new Center(
          child: new CircleAvatar(
           backgroundColor: Colors.white,
           child: new Text('$index'),
          ),
         ));
      },
      staggeredTileBuilder: (index) => StaggeredTile.fit(1)),
   ),
  );
 }
}

​

以上就是短視訊app開發，Flutter StaggeredGridView的瀑布流效果實現的相關程式碼， 更多內容歡迎關注之後的文章