短视频app开发,Flutter StaggeredGridView的瀑布流效果
短视频app开发,Flutter StaggeredGridView的瀑布流效果实现的相关代码
1 | dependencies:<br> flutter_staggered_grid_view: 0.4.0<br>import 'dart:math' ;<br>import 'package:flutter/cupertino.dart' ;<br>import 'package:flutter/material.dart' ;<br>import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart' ;<br>void main(List<String> args) {<br> runApp(app());<br>}<br> class app extends StatelessWidget {<br> const app({Key key}) : super(key: key);<br> @override<br> Widget build(BuildContext context) {<br> return MaterialApp(<br> home: homebody(),<br> );<br> }<br>}<br> class homebody extends StatelessWidget {<br> @override<br> Widget build(BuildContext context) {<br> return Scaffold(<br> appBar: AppBar(<br> title: const Text( 'StaggeredGridView' ),<br> ),<br> body: Padding(<br> padding: const EdgeInsets.all(4),<br> child: StaggeredGridView.countBuilder(<br> shrinkWrap: true,<br> crossAxisCount: 4,<br> crossAxisSpacing: 4,<br> mainAxisSpacing: 4,<br> itemCount: 100,<br> itemBuilder: (context, index) {<br> return Container(<br> height:100+200*Random().nextDouble(),<br> color: Colors.green,<br> child: new Center(<br> child: new CircleAvatar(<br> backgroundColor: Colors.white,<br> child: new Text( '$index' ),<br> ),<br> ));<br> },<br> staggeredTileBuilder: (index) => StaggeredTile.fit(1)),<br> ),<br> );<br> }<br>} |
以上就是短视频app开发,Flutter StaggeredGridView的瀑布流效果实现的相关代码, 更多内容欢迎关注之后的文章
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 分享一个免费、快速、无限量使用的满血 DeepSeek R1 模型,支持深度思考和联网搜索!
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· ollama系列01:轻松3步本地部署deepseek,普通电脑可用
· 25岁的心里话
· 按钮权限的设计及实现