Flutter基础组件总结

最新推荐文章于 2022-07-25 11:07:30 发布
最新推荐文章于 2022-07-25 11:07:30 发布
阅读量121 收藏 1
点赞数
分类专栏： 安卓 文章标签： flutter
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_40353662/article/details/114696804
版权

在这里插入图片描述

一、Text Widget

二、Container Widget

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

三、Image

1、图片的来源
在这里插入图片描述
2、图片填充效果

在这里插入图片描述

在这里插入图片描述

3、图片混合模式

在这里插入图片描述4、图片重复
在这里插入图片描述

四、ListView

1、给ListView添加内容
在这里插入图片描述
在这里插入图片描述
2、设置显示方式
在这里插入图片描述
3、动态显示列表
在这里插入图片描述

五、GridView（网格列表）

在这里插入图片描述
在这里插入图片描述

六、RowWidget

在这里插入图片描述

七、ColumnWidget垂直布局组件

在这里插入图片描述

八、StackWidget层叠布局

在这里插入图片描述

九、PositionedWidget层叠定位组件

三个元素以上才使用Positioned组件。

在这里插入图片描述

十、CardWidget卡片布局组件

在这里插入图片描述

十一、导航父子页面的跳转返回

在这里插入图片描述

十二、导航参数的传递和接收

假设现在要做一个商品列表，那么需要把商品抽象为一个类，像下面这样子。
在这里插入图片描述
用动态方式生成列表
在这里插入图片描述
下面进一步
在这里插入图片描述
实现效果如下
在这里插入图片描述

十三、页面跳转并返回数据

在这里插入图片描述
在这里插入图片描述
效果如下
在这里插入图片描述

十五、Flutter打包

找到本地java目录
在这里插入图片描述使用flutter build apk命令来打包

可以看看这个视频，flutter打包讲的很详细。
https://www.bilibili.com/video/BV15t411U7yf?p=25&spm_id_from=pageDriver

ann0302
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Flutter布局组件
02-24
Flutter中的布局容器主要分为两类：只能包含一个子Widget的布局容器和可以包含多个子Widget的容器，下面分别说明其用法。Center组件中的子组件会居中显示。Center组件会尽可能的大，如果你不给它设置任何约束。下面...
Flutter 组件总结
weixin_33726943的博客
02-24 244
前言 该文章只是自己这两天看电子书的总结，如果想看一手知识的可以转到电子书book.flutterchina.club/chapter7/th…。前端开发无非就两步第一是布局、第二是请求数据刷新界面，这两天看完感觉至少写一些简单的界面是没问题了。剩下的请求以及一些第三方库有时间再继续。对于没有打过Flutter代码的朋友我建议看完至少还要自己动手打一下，不用全打，因为打跟看是两回事，有时候看懂了...
Flutter常用组件构造参数说明
腾飞吧！
07-25 789
Flutter常用组件构造参数说明。
Flutter：常用组件总结
BunnyCoffer的博客
02-24 370
alibaba/flutter_boost：路由 install_plugin 2.0.0#app下载更新插件 audio_recorder: any #录音、播放 flutter_sound: ^1.1.5#录音 dropdown_menu: ^1.1.0#下拉菜单 simple_permissions:#权限获取 easy_alert:#弹框 amap_location: any #高德地图 location: any #gogle位置获取 barcode_scan 0.0.8#二维码识别qr_mo.
flutter学习总结(语法,组件,布局,和路由)
庚中
11-13 3222
按国际惯例,写来一个hello world应用跑一遍. 这段代码写在根目录\lib\main.dart文件中，这就是Flutter主文件. 基本思路: 引入flutter包 入口函数 声明MyApp类 重写build方法,它返回一个Material风格的组件 在Material组件的home属性里赋值一个Scaffold组件 在Scaffold组件里创建appBar和body 在bod...
Flutter组件化开发方案
01-27
这样可以有效的将Flutter和Native进行物理隔离，但随着Flutter承载的业务越来越多，与Native交互的接口变的越来越多，带来了很多管理问题，因此我们迫切需要采用新的开发模式，本文将介绍Flutter的组件化开发方案。...
Flutter 图片组件
01-07
Flutter 加载远程图片 //导入了Material UI组件库 ,快捷操作fim import 'package:flutter/material.dart'; void main(){ runApp(MyApp()); } //自定义组件 //StatelessWidget:无状态组件，状态不可变的widget //...
Flutter 表单组件
01-08
import 'package:flutter/material.dart'; import '../pages/tabs.dart'; import '../pages/TextField.dart'; import '../pages/Radio.dart'; import '../pages/CheckBox.dart'; import '../pages/Switch.dart'; ...
Flutter学习之旅（二）常用的Flutter的基础组件介绍
Ho博客
07-02 5839
前言 为了能更快的创建一个好看的应用，Flutter提供了一系列的组件。有基础组件（Basics Widgets），质感组件（Material Components）等，本篇将介绍常用的基础组件。 目录 看到上面的目录，从事Android开发的同学是不是很熟悉，Flutter中组件和Android中非常的类似，毕竟都是出自Google。 1.Text （文本），Scaffold（脚...
flutter学习--列表组件
pgg_cold的博客
05-17 2248
基本使用 使用ListView，然后在他的内部children中，使用了widget数组，因为是一个列表，所以它接受一个数组，然后有使用了listTite组件（列表瓦片），在组件中放置了图标和文字。 body: new ListView( children:<Widget>[ new ListTile( leading:new Icon(Icons.access...
Flutter常用组件的介绍与总结
码龙-的博客
10-28 530
前言： 在学习Flutter的时候牢记一句话，即是“万物皆组件”，一个Text也是组件。 一.MaterialApp 组件（一般作为顶级widget） MaterialApp 是一个方便的 Widget，它封装了应用程序实现 Material Design 所需要的 一些 Widget，一般作为顶层 widget 使用。 常用的属性: home(主页) -----------------------------设置主页样式 ...
Flutter - 跨组件传参
c_liufeng的博客
12-13 1196
基本用法 1. 创建InheritedWidget 数组贡献组件 class ShareDataWidget extends InheritedWidget { final Widget child; final String title; ShareDataWidget({Key key, this.child, @required this.title}) : super(key: key, child: child); static ShareDataWidget of(Buil
flutter 组件传参
weixin_43294560的博客
09-08 3118
通过类的构造函数来传递参数 代码示例: import 'package:flutter/material.dart'; import 'test.dart'; void main() => runApp(MyApp()); class MyApp extends StatefulWidget { MyApp({Key key}) : super(key: key); @override _MyAppState createState() => _MyAppState(); }
flutter. Container组件参数说明
qq_40250122的博客
03-13 2467
Widget _buildSettingButton(String leftImage, String buttonTitle, String rightImage, GetView page) { return Row( children: <Widget>[ Expanded( child: MaterialButton( color: Colors.white, child: ..
Flutter (十四) 状态组件 传值
没有翅膀的我们，只是随便认为不能飞而已
06-22 3388
import 'package:flutter/material.dart'; void main() { runApp(new MaterialApp(title: 'State', home: new Demo())); } class Demo extends StatelessWidget { int count = 0; @override Widget ...
Flutter基础-组件通信(父子、兄弟）
weixin_34343689的博客
09-18 823
为什么80%的码农都做不了架构师？>>> ...
flutter常用控件参数解析
认真做事，开心生活
12-19 4843
记录fultter一些控件的参数解析，方便查阅（持续更新）： 1.MaterialApp详解：   (1)navigatorKey:导航键   (2)home主页   (3)routes路由(跳转页面) （4）initialRoute：初始路由 （5）onGenerateRoute：生成路由 （6）onUnknownRoute：未知路由 （7）navigatorObservers：...
Flutter ListTile - Flutter每周一组件
你需要一个懂技术的朋友front_jason
12-24 351
该文章属于【Flutter每周一组件】系列，其它组件可以查看该系列下的文章，该系列会不间断更新；所有组件的demo已经上传值Github: https://github.com/xj124456/flutter_widget_demo 欢迎Star 博客：思否, 掘金, 知乎, 简书, 慕课, CSDN, 博客园, DX前端公众号：DX前端框架知识库联系我：公众号菜单点击联系我 使用场景 组件解释：固定高度的单个行，通常包含一些文本以及前导或尾随图标。 当需要给一个列表list的时候..
flutter ui组件库
最新发布
05-30
Flutter是一个开源的跨平台移动应用程序框架，它提供了许多内置的UI组件，如Text，Image，Button，ListView等。除此之外，Flutter还提供了许多第三方UI组件库，这些组件库可以帮助开发者更快速地构建美观的界面并...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值