Flutter基础组件学习–仿写美呗官方小程序界面

Flutter基础组件学习–仿写美呗官方小程序界面Flutter基础组件学习–仿写美呗官方小程序界面

大家好,又见面了,我是你们的朋友全栈君。

学会这几个基础组件就可以写了:

flutter基础组件

  • Container 就是一容器,可以设置padding,margin,圆角等

Row横向布局

Cloum垂直布局

Image图片

Text文本

ScaffoldMaterial Design布局结构的基本实现。此类提供了用于显示drawer、snackbar和底部sheet的API。

原官方小程序图:

对比flutter实现的:

会员中心页面没什么好说的,主要说一下发现页的吸顶和推荐页的banner轮播

//发现页
@override
  Widget build(BuildContext context) {
    // TODO: implement build
    return DefaultTabController(
      length: pTabs.length,
      child: Scaffold(
        appBar: new AppBar(
          elevation: 0,
          title: _widget_barSearch(),//搜索放在appbar
        ),
        body: NestedScrollView(
            headerSliverBuilder:
                (BuildContext context, bool innerBoxIsScrooled) {
              return <Widget>[
                _header_pic(), //顶部图片
                SliverOverlapAbsorber(
                  handle:
                      NestedScrollView.sliverOverlapAbsorberHandleFor(context),
                  child: SliverAppBar(
                    pinned: true,
                    forceElevated: innerBoxIsScrooled,
                    title: TabBar(
                        isScrollable: true,
                        tabs: pTabs.map((ProjectTab tab) {
                          return new Tab(
                            text: tab.text,
                          );
                        }).toList()),
                  ),
                )
              ];
            },
            body: TabBarView(
              children: pTabs.map((item) {
                return item.caseList;
              }).toList(),
            )),
      ),
    );
  }
复制代码

安卓apk下载

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/106908.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • 影视短视频剪辑的完整操作流程(普通人也能学会)

    影视短视频剪辑的完整操作流程(普通人也能学会)嗨喽,大家好,我是会玩运营,能写代码,文案设计样样精通的江湖美男子菜鸟哥,一名走在营销路上的小菜鸟。点击上方蓝字“关注”,每天为你分享有用的营销运营干货。上一篇文章我们讲解了《全网最全抖音运营攻略》,相信看完这篇文章的朋友对于短视频运营多少有了一定的了解,文中的2020年抖音用户画像报告,我们了解到短视频用户对于影视类的作品关注度还是非常高的,今天我们就结合案例来为大家进行更加详细的讲解。本文将带你初步了解抖音、快手短视频中影视剪辑的完整操作流程,没有过多复杂的骚操作,零基础的普通人也能够看懂。

  • 关于 lockfree 算法[通俗易懂]

    关于 lockfree 算法[通俗易懂]lockfree的本质是乐观锁。也就是说,它假设多数情况下,别人不会改变。一个通用的lockfree算法可描述如下: lockfree_modify(DataT*data){   for(;;)   {       Saveoldstateofdatatoalocalvariable;       domodify;       lock{           

  • 智能点餐系统开发纪实2—–系统整体结构和业务流程「建议收藏」

    1请看这里http://blog.csdn.net/jason0539/article/details/20854329 写完之前这个就没写,趁着新鲜感几天就把这个弄完了,也没再写别的东西,前几天已经完成了,今天需要写一个文档,写完文档就把里面我写的部分贴到这里来了,有点罗嗦,凑字数。其实就是讲了一个整体流程,整个系统主要分四部分:小车,手机,收银台,厨房。服务器写了两个,收银

  • Linux C语言写的超级简单port扫描器

    Linux C语言写的超级简单port扫描器

    2021年12月15日
  • SpringBoot安全线程锁工具类[通俗易懂]

    SpringBoot安全线程锁工具类[通俗易懂]这几日对接物联网项目,前端请求数据,后端接口发起TCP请求,由另一个线程来接收数据,这时候需要阻塞前端发起的请求,直到TCP接收数据完毕,再返回数据给前端。特此写了一个工具类importjava.util.concurrent.ConcurrentHashMap;importjava.util.concurrent.locks.LockSupport;publicclassLockSupportUtil{//存放线程引用的全局容器publicstaticfina

  • 【Java】JVM垃圾回收机制与类加载机制

    【Java】JVM垃圾回收机制与类加载机制不同于C++需要编程人员手动释放内存,Java有虚拟机,因此Java不需要程序员主动去释放内存,而是通过虚拟机自身的垃圾回收器(GarbageCollector-GC)来进行对象的回收。Java语言由于有虚拟机的存在,实现了平台无关性,在任意平台都是通过将代码转换为字节码文件,从而在平台下的虚拟机中运行代码的。JVM内存区域分布虚拟机栈:存放每个方法执行时的栈帧,一个方法调用到…

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号