之前的练习加了个详情页面,然后跳转第三方页面抖音用户详情页面
跳转详情页添加了Hero的动画,共享元素过度
一个 标准 hero 动画 使 hero 从一页飞至新页面,通常以不同大小到达不同的目的地。
设定好每个图片的id,通过id作为 'Hero' 组件的标识,id不能重,否则会报错,在这两个页面中必须相同
Hero(tag: "$id",child: Image.asset(imagePath,height: 64,),
),
在跳转的页面也要加入id
Hero(tag: "$id",child: Image.asset("assets/8b10de68e58cfef6bd5f22e5321537.jpg",width: 200,height: 200,fit: BoxFit.cover,),
),
Flutter开发日常练习-小猫咪杂货店https://blog.csdn.net/zxc8890304/article/details/130150733?spm=1001.2014.3001.5501
白名单
<array>
<string>douyinopensdk</string>
<string>douyinsharesdk</string>
<string>snssdk1128</string>
</array>
url_launcher: ^6.0.10
URL Launcher是一个Flutter插件,它允许您的应用程序启动网络浏览器、地图应用程序、拨号器应用程序、邮件应用程序等。URL Launcher插件通过创建意图来打开使用不同URL方案的应用程序。
_launchURL() async {// 1.url Scheme// const url = 'snssdk1128:';const url = 'snssdk1128://user/profile/xxxxxx';//替换你自己的id// 2. 判断当前手机是否安装某app. 能否正常跳转if (await canLaunch(url)) {// 2.1 正常跳转await launch(url);} else {// 2.2 不能跳转throw 'Could not launch $url';}}
给列表上的文字加了个缩放的提示动画,感觉很有意思,也有别的效果可以自己试一下
animated_text_kit: ^4.2.2
ScaleAnimatedTextKit(totalRepeatCount: 99999,text: contextList,textStyle:TextStyle(fontSize: 24.0, fontWeight: FontWeight.bold),textAlign: TextAlign.start,// alignment:AlignmentDirectional.topStart // or Alignment.topLeft),
flutter_staggered_animations: ^1.1.1
列表也都加上了动画效果
AnimationConfiguration.staggeredGrid(position: index,columnCount: value.shopItems.length,duration: const Duration(milliseconds: 375),child: SlideAnimation(verticalOffset: 50.0,child: FadeInAnimation(child: GroceryItemTile(itemName: value.shopItems[index].name,itemPrice: value.shopItems[index].price,imagePath: value.shopItems[index].pic,color: value.shopItems[index].color,id: value.shopItems[index].id,contextList: value.shopItems[index].desList,onPressed: () {Provider.of<CarModel>(context,listen: false).addItemToCart(index);},),),),);}),);
添加了点赞按钮的效果,看了下代码写的很完善,拓展很宽,你也可以按照自己的想法去修改
like_button: ^2.0.5
LikeButton(mainAxisAlignment: MainAxisAlignment.end,),
这个联系要改一下,有些不足的地方,因为不会后端,所以数据写在本地