Android到Flutter过度如丝般顺滑(一)

本文探讨了Android开发者如何平滑过渡到Flutter开发。从Android的View概念过渡到Flutter的Widget,阐述了Flutter中不可变Widget和StatefulWidget的区别,以及如何通过setState()更新状态。此外,还对比了Android的XML布局与Flutter的Widget树布局,介绍了多种Flutter布局组件的使用。
摘要由CSDN通过智能技术生成

各个大厂都进行跨平台,Flutter算是此方向大势所趋的一产物;
刚开始从Android开发过度到Flutter开始有些吃力,两者架构和实现都不一样,
本人从事Android开发数春秋,把玩Flutter也有一段时间,

当然最权威最详细的还是官方文档:
https://flutterchina.club/flutter-for-android/

Views

1.android中的view:view是屏幕上显示的所有内容的基础,textView,EditView,Button,CheckBox等等都是view,布局文件都是有一个个view组成的,
2.flutter中的view:view相当于widget,

与view相比,widget有一些不同之处,首先widget仅支持一帧,并且在每一帧上flutter的框架都会创建一个widget的实例树(相当于一次性绘制整个界面,相比之下,在android上view绘制结束后,就不会重绘,知道调用invalidate时才会重绘)

States

在Android中,可以直接对view进行改变来更新试图,然而flutter中widget是不可变的,不会直接更新,而必须使用widget的状态,这就是Stateful和Stateless widget的概念的来源,一个Stateless widget就像它的名字,是一个没有状态信息的widget,

例如:在Android中这与将logo图标放在Imageview中很相似,logo在运行时不会更改,因此您可以在flutter中使用statelessWidget,
如果您希望通过http动态请求的数据更改用户界面,则必须使用statefulWidget,并告诉flutter框架该widget的状态已更新,以便可以更新该widget;

更新状态变化方法:setState();

void _updateText(){
   
	setState((){
   
		//todo update the state
	});
}
Layout xml

在android中,您通过xml编写布局,但在flutter中,您可以使用widget树来编写布局;

在android中有布局控件:LinearLayout,RelativeLayout,FrameLayout等等,有子控件、组控件:EidtView,TextView,Button, RadioButton,ScrollView等等

在flutter中使用一下widget来组合布局,有的widget相当于android中某一控件的某一项属性:
拥有单个子元素的布局widget

  • Container:一个拥有绘制、定位、调整大小的widget,
  • Padding:一个widget,会给其字widget添加指定的填充
  • Center:将其子widget居中显示在自身内部的wdiget
  • Align:一个widget,它可以将其子widget对齐,并可以根据子widget的大小自动调整大小
  • FittedBox:按自己的大小调整其子widget的带下和位置
  • AspectRatio:一个widget,试图将子widget的指定为某个特定长宽比
  • ConstrainedBox:对其子项施加附加约束的widget
  • Baseline:根据子项的基线对它们的位置进行定位的widget
  • FractionallySizeBox:一个widget,它把它的子项放在可用空间一小部分
  • IntrinsicHeight:一个widget,它将它的子wi
  • 1
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值