void listDemo() { // 1.list的创建 listCreate(); // 2.多种类型的输出 listPrint(); // 3.添加数据 listAddElement(); // 4.删除数据 listRemoveElement(); // 5.更改列表元素 changeTheListElements(); // 按顺序迭代列表 List<String> names = ["Alice", "Daphne", "Eliz

在通常的对 Flutter 介绍中,最耳熟能详的是下面四个特点: 精美 (Beautiful):充分的赋予和发挥设计师的创造力和想象力,让你真正掌控屏幕上的每一个像素. ** 极速 (Fast)**:基于 Skia 的硬件加速图形引擎,帮助你媲美原生应用的速度. 高效 (Productive):Flutter 的 Stateful Hot Reload (热重载) 特性帮助你实时看到应用修改的结果. 开放 (Open):不管是 Flutter 引擎还是 Dart 开发语言,甚至是工程团队的工作空

老孟导读:昨天期待已久的 Flutter 2.0 终于发布了, Flutter Web和Null安全性趋于稳定,Flutter桌面安全性逐渐转向Beta版! 原文链接:https://medium.com/flutter/whats-new-in-flutter-2-0-fe8e95ecc65 今天,我们很高兴地宣布Flutter 2的发布.距离Flutter 1.0的发布已经两年多了,但是在很短的时间内,我们已经关闭了24,541期,并合并了765个贡献者的17,039个PR.自9月Flutt

Flutter 2.2 版已正式发布!要获取新版本,您只需切换到 stable 渠道并更新目前安装的 Flutter,或前往 flutter.cn/docs/get-started 从头开始安装. 虽然与 2.0 版只相隔数月,2.2 版还是满载大量改进.此版本共计纳入了框架.引擎和插件库等方面的 2,456 个 PR 并解决了 3,105 个问题.我们要特此鸣谢为此版本贡献了大量 PR 和 PR review 的整个 Flutter 社区,包括 PR 贡献最多 (17) 的 Abhishek0

Swift 和 Flutter 是考虑创建 iOS 应用程序的公司最想要的两种技术.开发者能用原生技术取胜吗?如何选择,哪种更适合您的应用?让我们一探究竟吧! 根据 Statista 的数据, 2019 年全球移动应用带来了 4620 亿美元的收入.两个最受欢迎的应用商店 Google Play 和 Apple App Store 分别提供了 29 和 200 万个应用.据Hootsuite 称,全球有 45 亿互联网用户消费了所有这些. 很遗憾不能成为这个不断增长的业务的一部分.现在,让我们来

56.购物车_商品数量控制区域制作 主要做购物车中的数量这里 cart_page文件夹下新建cart_count.dart 减少按钮 因为会有点击事件,所以这里我们使用InkWell. child里面外层套一个Container,为什么要外层始终套一个Container呢,因为我们可以设置内边距.外边距.宽和高等等 //减少按钮 Widget _reduceBtn(){ return InkWell( onTap: (){}, child: Container( width: ScreenUti

59.购物车_计算商品价格和数量 本节课主要是加上自动计算的功能 provide/cart.dart 在provide的类里面增加两个变量 cart_bottom.dart 三个组件因为我们都需要套一层provide所以这里都传入context对象 把三个组件方法,分别都加上context 引入provide和cart.dart import 'package:provide/provide.dart'; import '../../provide/cart.dart'; 总价 从provide

61.购物车_商品数量的加减操作 provide/cart.dart pages/cart_page/cart_count.dart 先引入provide和cartProvide 定义接收一个item对象的参数 把加减的方法都加上下文对象 添加和减少的点击事件 中间数字的数量的设置 cart_item.dart cart_item在调用CartCount的时候需要传入上篇的单个对象 效果演示: 修正一个地方provide/cart.dart 这里toString是放在外面的 最终代码: prov

63.购物车_详细页显示购物车商品数量 购物车的图标嵌套在statck组件里面 外层套了一个stack组件 数量我们需要用Provide 返回一个container来做样式 气泡效果,中间是个数字外面 是一个圆 如果想组成一个圆的形式,内边距就必须用formLRB这种形式 点击加入购物车后,数量发生变化provide/cart.dart provide/cart.dart 效果展示: 最终代码 details_page/detail.dart import 'package:flutter/ma

这篇主要讲flutter最基本的操作.我们从一个实例入手,先不需要知道它里面的每一行是什么意思,我会慢慢说. main.dart import 'package:flutter/material.dart'; import 'model/post.dart'; void main() => runApp(App()); class App extends StatelessWidget { @override Widget build(BuildContext context) { return

Native App React Native(RN)发布于2015年,也是使用JavaScript语言进行跨平台APP的开发.与H5开发不同的是,它使用JS桥接技术在运行时编译成各个平台的Native代码,其使用的技术Facebook的Flux技术. 其特点是: 使用JavaScript语言,由于JS被广泛地使用,所以RN也很容易被接受. RN依赖JS的运行时环境,也就是JS桥接技术.其使用Facebook的Flux架构. RN仅提供了UI渲染和设备访问的API,很多功能必须依赖第三方库来实现

1. 动画介绍 动画对于App来说,非常的重要.很多App,正是因为有了动画,所以才会觉得炫酷.移动端的动画库有非常的多,例如iOS上的Pop.web端的animate.css.Android端的AndroidViewAnimations.跨平台的Lottie等.正是因为有了这些封装好的动画库,我们制作酷炫的效果方便了不少.当然了,这些库都是基于各平台基础的动画API实现的,笔者今天要聊的,也就是基础的动画及背后的原理. 1.1 动画的本质 动画顾名思义,就是动起来的画面.画面为什么会动起来了呢

文中所有示例代码请点击: gitee.com/yumi0629/Fl… 今天呢,我小拉面主要想给大家讲一讲Flutter中的 Slivers 大家族的使用场景和方法.开发过列表布局的同学们应该对 Slivers 系列的控件不陌生,或多或少都用过这个库中的控件,来解决复杂的滑动嵌套布局. 比如之前讲Hero的时候提到的下面这个界面,使用普通的GridView的话是没法实现的,我们选择使用 CustomScrollView ,然后在 slivers 属性中添加子控件,在这个例子里,我们可以用Sliv

Flutter中的手势系统有两个层次.第一层具有原始指针事件,其描述了穿过屏幕的指针(例如触摸.鼠标和触控笔)的位置和移动.第二层具有手势,其描述由一个或多个指针移动组成的语义动作. 指针指针代表用户与设备屏幕交互的原始数据.有四种类型的指针事件: PointerDownEvent:指针已经在特定位置联系了屏幕.PointerMoveEvent:指针已经从屏幕上的一个位置移动到另一个位置.PointerUpEvent:指针已停止接触屏幕.PointerCancelEvent:此指针的输入不再针对

学习了Flutter,来分享一下学习的一些常用的知识,先来说说ListView 案例效果: ListView是一个类似列的widget,它的内容对于其渲染框太长时会自动提供滚动. ListView 摘要:用于组织盒子中列表的特殊Column可以水平或垂直放置检测它的内容超过显示框时提供滚动比Column配置少,但更易于使用并支持滚动 构建ListView有四个选项: 默认构造函数采用子类的显式List <Widget>.此构造函数适用于具有少量子项的列表视图,因为构造List需要为可能在列表视

跨平台一直是老生常谈的话题,cordova.ionic.react-native.weex.kotlin-native.flutter等跨平台框架百花齐放,颇有一股推倒原生开发者的势头. 为什么我们需要跨平台开发? 本质上,跨平台开发是为了增加代码复用,减少开发者对多个平台适配的工作量,降低开发成本,提高业务专注的同时,提供比web更好的体验. 目前移动端跨平台开发中,备受关注的方案大致归纳为以下几种情况: 1)react native.weex均使用JavaScript作为编程语言,目前Jav

模拟器中调试元素的布局: Android Studio 右侧边栏 Flutter Inspector,选择 Toggle Debug Paint 打开. 格式化代码: 编辑器中右键 Reformat Code with dartfmt. 使用外部功能包(https://pub.dartlang.org/flutter): 把外部包名加到 pubspec.yaml 的 dependencies 依赖中,运行 flutter packages get 安装,代码中 import 进来使用. 例子内容

Flutter介绍 Flutter是Google推出的开源移动应用开发框架.开发者可以通过开发一套代码同时运行在iOS和Android平台. 它使用Dart语言进行开发,并且最终编译成各个平台的Native代码,这样既保证了开发效率,也保证了各个平台的运行效率.其相当于从头到尾重写了一套UI框架,不依赖具体平台的组件.其所有的组件都是"Widget".渲染引擎则依靠高效渲染库Skia实现. 下面我们对比一下H5.React Native.Flutter这些跨平台的解决方案. 移动端的跨

1.前言 跨平台一直是老生常谈的话题,cordova.ionic.react-native.weex.kotlin-native.flutter等跨平台框架的百花齐放,颇有一股推倒原生开发者的势头. 为什么我们需要跨平台开发? 本质上,跨平台开发是为了增加代码复用,减少开发者对多个平台差异适配的工作量,降低开发成本,提高业务专注的同时,提供比web更好的体验.嗯-通俗了说就是:省钱.偷懒. 目前移动端跨平台开发中,备受关注的方案大致归纳为以下几种情况: 1)react native.weex均使

本文主要介绍了动画的原理相关概念,对其他平台的动画做了一个简要的梳理,并简要的介绍了Flutter动画的一些知识. 1. 动画介绍 动画对于App来说,非常的重要.很多App,正是因为有了动画,所以才会觉得炫酷.移动端的动画库有非常的多,例如iOS上的Pop.web端的animate.css.Android端的AndroidViewAnimations.跨平台的Lottie等.正是因为有了这些封装好的动画库,我们制作酷炫的效果方便了不少.当然了,这些库都是基于各平台基础的动画API实现的,笔者今

有状态widget:StatefulWidget和无状态widget:StatelessWidget 前者不需要实现Widget build(BuildContext context). 具体的选择取决于widget是否需要管理一些状态 在Dart语言中使用下划线前缀标识符,会强制其变成私有的. Icons.favorite Icons类里面有很多默认图标 isOdd 是否奇数 2.isOdd -> false 1.isOdd -> true pushSaved “”开头的自动转成私有(方法和