flutter button button类型: RaisedButton : 凸起的按钮,其实就是Android中的Material Design风格的Button ,继承自MaterialButton FlatButton : 扁平化的按钮,继承自MaterialButton OutlineButton :带边框的按钮,继承自MaterialButton IconButton : 图标按钮,继承自StatelessWidget shape:属性 BeveledRectangleBorder…

如需转载,请注明出处:Flutter学习笔记(29)--Flutter如何与native进行通信 前言:在我们开发Flutter项目的时候,难免会遇到需要调用native api或者是其他的情况,这时候就需要处理Flutter与native的通信问题,一般常用的Flutter与native的通信方式有3中. 1.MethodChannel:Flutter端向native端发送通知,通常用来调用native的某一个方法. 2.EventChannel:用于数据流的通信,有监听功能,比如电量变化后直…

flutter 里面 RaisedButton.FloatingActionButton.FlatButton.OutlineButton 中四个button都无高度设置,如下用RaisedButton举例: 处理办法第一种:没有高度就用一个有高度的 View 来加载 Container,于是有了 new Container( height: 60.0, child: new RaisedButton(onPressed: (){}, child: new Text("测试Buton的宽度&qu…

一,概述 由于Flutter是跨平台的,所以有适用于Android和iOS的两种风格的组件.一套是Google极力推崇的Material,一套是iOS的Cupertino风格的组件.无论哪种风格,都是通用的. 二,Material与Cupertino风格比较 控件 Material Cupertino Button RaisedButton CupertinoButton DatePick showDatePicker CupertinoDatePicker 从多年与设计师打交道来看,App更青…

注意:无特殊说明,Flutter版本及Dart版本如下: Flutter版本: 1.12.13+hotfix.5 Dart版本: 2.7.0 Flutter内置了10多种Button(按钮)类控件供我们使用,了解这些控件有助于提高我们的开发速度. RaisedButton RaisedButton是一个material风格"凸起"的按钮,基本用法: RaisedButton( child: Text('Button'), onPressed: (){ }, ) 效果: onPresse…

Flutter 1.22版本新增了3个按钮,TextButton.OutlinedButton.ElevatedButton,虽然以前的Button没有被废弃,但还是建议使用新的Button. 为什么会新增 Button?因为想要将以前的按钮调整为统一的外观比较麻烦,因此以前经常使用自定义的按钮,而新增的按钮解决了此类问题,可以非常方便的设置整体外观. 1.22版本前的按钮 主题 1.22版本后的按钮 主题 FlatButton ButtonTheme TextButton TextButton…

前言 其实如果打算在实际项目中引入 Flutter,完全将旧有项目改造成纯 Flutter 项目的可能性比较小,更多的是在旧有项目引入 Flutter. 因此本篇我们就说一说如何在旧有项目引入 Flutter. 官方 WIKI 有说明,但是里面坑还是不少的,变化也是存在的. 因此就让我们来看一看. 目录 1. 按照官网实现基本引入 Add Flutter to existing apps 上面为GitHub WIKI 的引入方式,通过 Module 的形式进行引入. 可以看出文档还是在不断更新的…

### 主题 ``` // 1.main主文件 import 'package:flutter_smart_park/config/theme.dart' show AppTheme; Provide.value<ConfigModel>(context).$getTheme(); Provide<ConfigModel>( builder: (context, child, configModel) { return MaterialApp( title: '智慧xx区', de…

作为忠实与较资深的Android汪, 最近抽出了一些时间研究了一下Google的亲儿子Flutter, 尚属皮毛, 只能算是个简单的记录吧. Google自2017年第一次提出Flutter, 到2018年Beta, 再加之RN的各种风波与问题, 使得Flutter的热度不断上升, 国内不少公司都公布Flutter在其产品中的应用, 如美团, 闲鱼等. 前言 Flutter作为跨平台框架, 常常被人拿出来与React Native, 以及Xamarin进行对比, 除了大家都是跨平台框架之外且能达…

Flutter for iOS 开发者 本文档适用那些希望将现有 iOS 经验应用于 Flutter 的开发者.如果你拥有 iOS 开发基础,那么你可以使用这篇文档开始学习 Flutter 的开发. 开发 Flutter 时,你的 iOS 经验和技能将会大有裨益,因为 Flutter 依赖于移动操作系统的众多功能和配置.Flutter 是用于为移动设备构建用户界面的全新方式,但它也有一个插件系统用于和 iOS(及 Android)进行非 UI 任务的通信.如果你是 iOS 开发专家,则你不必将…

前言: 最近在自学flutter跨平台开发,从学习的过程来看真心感觉不是那么一件特别容易的事.不但要了解语法规则, 还要知晓常用控件,和一些扩展性的外延知识,所以套一句古人的话“路漫漫其修远矣,无将上下而求索”. 关于Material Design 以下是摘录的一篇非常好的关于“Material Design”的文章,传送门 1.安卓是什么? 想象一下,过年同学聚会上,大家把手机都放在饭桌前,除了各种型号的 iPhone 之外,你还能看到什么品牌的手机呢?我猜一定会有 OPPO.VIVO.魅族.…

flutter 新状态管理方案 Provide (一)-使用     版权声明:本文为博主原创文章,基于CC4.0协议,首发于https://kikt.top ,同步发于csdn,转载必须注明出处! https://blog.csdn.net/qq_28478281/article/details/87858386 开这篇文章是因为看到这个库被托管在google的仓库下,而且说明是被设计出来替代ScopedModel的,而且更加灵活 支持Builder模式和StreamBuilder模式,全局,…

Windows Install 1.系统需要:> win7 > 400M磁盘空间 Windows PowerShell(Windows 搜索框中找) Git for Windows 2.x,能在 cmd 使用 git 命令 2.下载 Flutter SDK 稳定版:https://storage.googleapis.com/flutter_infra/releases/stable/windows/flutter_windows_v1.0.0-stable.zip 解压到不需要特殊权限的位置…

解析开始 Flutter中一切皆widget,一切皆组件.学习Flutter中,必须首先了解Flutter的widget.先从最基本的MaterialApp和Scaffold开始了解 1 MaterialApp 一个封装了很多Android MD设计所必须要的组件的小部件,一般作为顶层widget使用. 继承关系InheritanceObject->Diagnosticable ->DiagnosticableTree ->Widget ->StatefulWidget ->…

之前搞的Flutter版工具链已经弄完了,感兴趣的朋友可以围观下,Android版本dio库(v2.0.14)发送网络请求老是报错,去官方提了issue还没回,于是今天搞一下把Flutter模块接入到已有项目中. 首先Flutter官方已经出了wiki,教大家怎么接入.懒得看官方原文的可以看看这个简易版快速集成,先来看看效果. 一.创建Flutter模块 一般用Flutter或者React Native的团队大部分原因都是因为需要跨平台,所以在已有项目目录的上一级创建Flutter模块,譬如你的…

一.Container 是一个便利的Widget,它把通用的绘制.定位和Widget的大小结合了起来. Container会先用padding填充子Widget和border之间的空白,然后添加其他的额外的约束constraints,最后会把剩余的都用margin来填充. 在绘制的过程中,会优先绘制transform,然后是decoration,最后是foregroundDecoration. 对于一个没有子Widget的Container,在没有一些约束的条件时,它会尽可能的大:而一旦有了约束…

1. Flutter 是什么? Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面. Flutter可以与现有的代码一起工作.在全世界,Flutter正在被越来越多的开发者和组织使用,并且Flutter是完全免费.开源的. 2. Flutter 特性有哪些? 快速开发(毫秒级热重载) 绚丽UI(内建漂亮的质感设计Material Design和Cupertino Widget和丰富平滑的动画效果和平台感知) 响应式(Reactive,用强大而灵活的AP…

Flutter中给我们预先定义好了一些按钮控件给我们用,常用的按钮如下 RaisedButton :凸起的按钮,其实就是Android中的Material Design风格的Button ,继承自MaterialButton FlatButton :扁平化的按钮,继承自MaterialButton OutlineButton :带边框的按钮,继承自MaterialButton IconButton :图标按钮,继承自StatelessWidget 我们先来看看MaterialButton中的属性…

Flutter控件本身通常由许多小型.单用途的控件组成,结合起来产生强大的效果,例如,Container是一种常用的控件,由负责布局.绘画.定位和大小调整的几个控件组成,具体来说,Container是由LimitedBox.ConstrainedBox. Align.Padding.DecoratedBox和Transform控件组成,而不是将Container子类化来产生自定义效果,您可以用这种新颖的方式组合这些以及其他简单的控件. 类的层次结构是扁平的,以最大化可能的组合数量. 在写应用程序…

flutter可能是未来跨平台开发的又一技术框架,那么对于一个app,我们不可能完全用flutter来开发,那么就意味着我们需要在已有的Android和iOS代码中去集成flutter.目前这一技术还处于预览状态,并且还要切换flutter的channel为mater分支.如下,官方原话: 那么我们在集成之前需要查看现在flutter处于什么渠道: 我的是处于master分支,如果你以前没改过的话,应该是beta分支,那么可以执行: flutter channel master 进行切换. 下面…

flutter可能是未来跨平台开发的又一技术框架,那么对于一个app,我们不可能完全用flutter来开发,那么就意味着我们需要在已有的Android和iOS代码中去集成flutter.目前这一技术还处于预览状态,并且还要切换flutter的channel为mater分支.如下,官方原话: 那么我们在集成之前需要查看现在flutter处于什么渠道: 我的是处于master分支,如果你以前没改过的话,应该是beta分支,那么可以执行: flutter channel master 进行切换. 下面…

(1) 获取当前屏幕宽度 width: MediaQuery.of(context).size.width, (1) pull_to_refresh,smartrefresh 自定义文字: new SmartRefresher( headerBuilder: (context,mode) { return new ClassicIndicator( mode: mode, height: 45.0, releaseText: '松开手刷新', refreshingText: '刷新中', com…

flutter总的地址: https://jspang.com/page/freeVideo.html 视频地址: https://www.bilibili.com/video/av35800108/?p=15 博客的地址: https://jspang.com/post/flutter3.html#toc-7f3 创建项目的时候有个坑,解决的方法 https://www.jianshu.com/p/147f0e20c312 使用flutter create demo03创建一个新的flutte…

24.Provide状态管理基础 Flutter | 状态管理特别篇 —— Provide:https://juejin.im/post/5c6d4b52f265da2dc675b407?tdsourcetag=s_pcqq_aiomsg 点击左侧的导航右侧的导航发生变化,这属于两个widget.这两个widget之间进行通讯.用setstate的形式,耦合性太强 状态管理有这么几种方案 这里我们用Provide,谷歌自己退出的 https://github.com/google/flutter…

如需转载,请注明出处:Flutter学习笔记(5)--Dart运算符 先给出一个Dart运算符表,接下来在逐个解释和使用.如下:                            描述                                                                        运算符                                               一元后缀 expr++ expr-- () [] . ?. 一元前缀…

如需转载,请注明出处:Flutter学习笔记(9)--组件Widget 在Flutter中,所有的显示都是Widget,Widget是一切的基础,我们可以通过修改数据,再用setState设置数据(调用setState()来通知框架,框架会再次调用State的构建方法来更新用户界面),Flutter会自动通过绑定的数据更新Widget,所以你需要做的就是实现Widget界面,并且和数据绑定起来. Widget分为有状态StatefulWidget和无状态StatelessWidget两种,在Fl…

如需转载,请注明出处:Flutter学习笔记(13)--表单组件 表单组件是个包含表单元素的区域,表单元素允许用户输入内容,比如:文本区域,下拉表单,单选框.复选框等,常见的应用场景有:登陆.注册.输入信息等.表单里有两个重要的组件,一个是Form组件用来做整个表单提交使用的,另一个是TextFormField组件用来做用户输入的. Form组件属性 属性 类型 说明 Key Key 组件在整个Widget树中的key值 autovalidate bool 是否自动提交表单 child Widg…

如需转载,请注明出处:Flutter学习笔记(14)--StatefulWidget简单使用 今天上班没那么忙,突然想起来我好像没StatefulWidget(有状态组件)的demo,闲来无事,写一个简单的学习学习,前面我们有说过,Flutter不同于Android.Flutter是只绘制一帧,这一帧会绘制整个widget树,也就是说一次绘制整个界面,那么想一下,如果想要页面内容发生变化,是不是要重新绘制界面呢?如果需要重新绘制的,又怎么样来触发重新绘制的机制呢?先看下demo的代码吧,很简单的…

如需转载,请注明出处:Flutter学习笔记(15)--MaterialApp应用组件及routes路由详解 今天的内容是Scaffold脚手架.AppBar组件.BottomNavigationBar组件,通过这三个组件,能大体构建出一个app的主页面,顶导和底导. Scaffold(脚手架组件) Scaffold实现了基本的Material Design布局,只要是在Material Design中定义过的单个界面显示的布局控件元素,都可以使用Scaffold来绘制. Scaffold组件属…

引言 在之间我已经介绍了关于Flutter的下载安装以及配置,还有开发工具Android Studio的配置,还不知道的同学可以看看我这篇博客--谷歌移动UI框架Flutter入门.这里为什么非要用Android Studio,我可以解释一下.Android Studio是Google的亲儿子,由谷歌一手开发,而Flutter也是谷歌推出的技术,所以在支持和兼容问题上,Android Studio是非常有优势的.老话说得好,肥水不流外人田,谷歌内部肯定是将Android Studio对Flutt…