java valuewidget_Flutter开发之常用Widget
使用:
body: newCenter(
child:newContainer(
child:newText('非淡泊无以明志,非宁静无以致远。(诸葛亮)',
style: TextStyle(fontSize:30.0),
),
alignment: Alignment.topLeft,
width:500.0,
height:200.0,//color: Colors.lightBlue,//padding: const EdgeInsets.all(10),//内边距
padding: const EdgeInsets.fromLTRB(10.0, 50.0, 0, 0),
margin:const EdgeInsets.all(20.0),
decoration:newBoxDecoration(
gradient:constLinearGradient(
colors: [Colors.lightBlue, Colors.green, Colors.purple]
),
border: Border.all(width:5.0,color:Colors.red
),
),
),
),
三、Image组件
加入图片的方式:
Image.asset 项目资源图片
Image.file (绝对路径) 系统资源图片
Image.network(url) 网络资源图片
fit属性
BoxFit.fill
BoxFit.contain
BoxFit.cover
repeat属性
ImageRepeat.repeat 横向和纵向都重复,铺满整个容器
ImageRepeat.repeatX 横向重复
ImageRepeat.repeatY 纵向重复
body: newCenter(
child:newContainer(
child:newImage.network('https://profile.csdnimg.cn/0/5/2/1_jyd0124',
fit: BoxFit.cover,//color: Colors.lightBlue,//colorBlendMode: BlendMode.darken,//图片混合模式(colorBlendMode)和color属性配合使用
),
width:300.0,
height:200.0,
color: Colors.lightGreen,
)
),
四、ListView组件
列表使用
body: newListView(
children:[/*new Image.network(
'https://cdn2.jianshu.io/assets/web/banner-s-club-aa8bdf19f8cf729a759da42e4a96f366.png'),
new Image.network(
'https://cdn2.jianshu.io/assets/web/banner-s-7-1a0222c91694a1f38e610be4bf9669be.png'),*/ //图片列表使用
newListTile(
leading:newIcon(
Icons.perm_camera_mic,
),
title:new Text('perm_camera_mic'),
),newListTile(
leading:newIcon(
Icons.perm_phone_msg,
),
title:new Text('perm_phone_msg'),
),
],
),
横向列表:ListView组件里加一个scrollDirection属性
body: newCenter(
child:newContainer(
height:200.0,
child:newListView(
scrollDirection: Axis.horizontal,//Axis.vertical:纵向列表 children: [newContainer(
width:230.0,
color: Colors.lightBlue,
),newContainer(
width:230.0,
color: Colors.lightGreen,
),
],
))),
Dart语言List的声明方式:
var myList = List(): 非固定长度的声明。
var myList = List(2): 固定长度的声明。
var myList= List():固定类型的声明方式。
var myList = [1,2,3]: 对List直接赋值
import 'package:flutter/material.dart';void main() =>runApp(MyApp(items: List.generate(1000, (i) => 'item $i')));class MyApp extendsStatelessWidget {final Listitems;
MyApp({Key key, @requiredthis.items}) : super(key: key);
@override
Widget build(BuildContext context) {returnMaterialApp(
title:'ListView Dome',
home:newScaffold(
appBar:new AppBar(title: new Text('ListView Widget')),
body:newListView.builder(
itemCount: items.length,
itemBuilder: (context, index) {return newListTile(
title:new Text('${items[index]}'),
);
}),
),
);
}
}
五、GridView组件
常用属性:
crossAxisSpacing:网格间的空当。
crossAxisCount:一行放置的网格数量
body: GridView.count(
padding: EdgeInsets.all(20.0),
crossAxisSpacing:10.0,
crossAxisCount:3,
children:[const Text('I am j.y.d'),const Text('I love flutter'),const Text('jyd0124.com'),const Text('2020/02/06'),const Text('Come on,China!'),const Text('Come on,Wuhan!'),
],
),
官方已经不鼓励使用这种方法,另一种写法为
body: GridView(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount:3,
mainAxisSpacing:2.0,
crossAxisSpacing:2.0,
childAspectRatio:0.75,
),
children:[new Image.network('http://img5.mtime.cn/mg/2019/10/02/105324.67493314_170X256X4.jpg',fit:BoxFit.cover),new Image.network('http://img5.mtime.cn/mg/2019/09/26/092514.83698073_170X256X4.jpg',fit:BoxFit.cover),new Image.network('http://img5.mtime.cn/mg/2019/11/07/111316.10093613_170X256X4.jpg',fit:BoxFit.cover),new Image.network('http://img5.mtime.cn/mg/2019/12/13/094432.64997517_170X256X4.jpg',fit:BoxFit.cover),new Image.network('http://img31.mtime.cn/mt/2014/02/22/230757.74994253_220X124X4.jpg',fit:BoxFit.cover),new Image.network('http://img5.mtime.cn/mg/2019/07/10/164947.40820910_170X256X4.jpg',fit:BoxFit.cover),
],
),
childAspectRatio:宽高比
mainAxisSpacing:横向网格空档
crossAxisSpacing: 向纵向网格空挡
至此,使用组件的学习就到这儿了,下篇我们将学习布局的相关知识!
java valuewidget_Flutter开发之常用Widget相关推荐
- 程序员的开发工具:Java语言开发人员常用软件
我是 ABin-阿斌:写一生代码,创一世佳话,筑一览芳华. 如果小伙伴们觉得我的文章有点 feel ,那就点个赞再走哦. 文章目录 一.前言 二.相关软件介绍: 1. IDEA(IntelliJ ID ...
- java fel_开发中常用Fel的写法
直接看代码吧: package javademo; import java.util.HashMap; import java.util.Map; import com.greenpineyu.fel ...
- Java EE开发四大常用框架
2019独角兽企业重金招聘Python工程师标准>>> 我们对Java EE的框架有过很多介绍, 本文将对Java EE中常用的四个框架做一下系统的归纳,希望大家喜欢. Struts ...
- JAVA EE 开发中 常用的API包
2019独角兽企业重金招聘Python工程师标准>>> API 常见的几个类:lang/util/io/math/net awt -------- 用于创建用户界面和绘制图形的所有类 ...
- JAVA日常开发中常用的日志记录方式,攒个赞好不好?
引言: 日志大家都再熟悉不过了,日常开发中经常要用到,甲方接口人最喜欢对我说的话就是"赶紧去查一下日志,快点!",说话的同时瞪着个铜铃大的眼睛. 就你接口人知道日志吗?还要你指挥啊 ...
- java ee程序设计师_软件设计师:Java EE开发四大常用框架[1]
Struts Struts是一个基于Sun Java EE平台的MVC框架,主要是采用Servlet和JSP技术来实现的. Struts框架可分为以下四个主要部分,其中三个就和MVC模式紧密相关: 1 ...
- Java 开发人员常用的服务配置(Nginx、Tomcat、JVM、Mysql、Redis)
Nginx Nginx是一款由C语言编写的高性能.轻量级的HTTP和反向代理服务器,同时也是一款IMAP/POP3/SMTP服务器. nginx.conf:Nginx核心配置文件,linux下默认安装 ...
- Java新手看招 常用开发工具介绍
Java新手看招 常用开发工具介绍 Java的应用越来越广泛,学习Java的人也越来越多.学过程序设计的人知道,使用Basic进行程序设计,可以使用QBasic.Visual Basic等开发工具:使 ...
- Java在eclipse下开发的常用快捷键集锦
2019独角兽企业重金招聘Python工程师标准>>> Java在eclipse下开发的常用快捷键集锦 ctrl+shift+o 说明:删除无用的代码引用 使用场景:当前文件中的引用 ...
- java开发常用jar包_Java开发中常用jar包整理及使用
本文整理了我自己在Java开发中常用的jar包以及常用的API记录. 一.common-lang3 简介:一个现在最为常用的jar包,封装了许多常用的工具包 依赖: org.apache.common ...
最新文章
- SMS系列之六:利用SMS实现操作系统的补丁分发
- VB调用C#写的WinForm.NET控件
- 学会python编程容易吗-学习武汉Python编程培训容易吗?别人都是怎么学习的?
- jdk 1.8 concurrenthashmap扩容原理
- 原来以为(Trie)字典树很难,后来发现不久这么一回事嘛
- mysql 数据库函数入门
- 一招上手!这样设计扛住亿级流量活动系统
- [视频]中国军事专家论谷歌地球(Google Earth)
- 四.激光SLAM框架学习之A-LOAM框架---项目工程代码介绍---2.scanRegistration.cpp--前端雷达处理和特征提取
- 入手5G手机别太急!国内部分5G手机可能有网没信号
- visual studio 11开发Win8模板
- 动脑2017android_2017年最佳Android库
- 校园网编写linux网络认证,个人心得:校园网linux锐捷认证ruijie(xrgsu)使用及xrgsu下载...
- 数据挖掘期末论文要求
- 携程python面试题_Python求解啤酒问题(携程2016笔试题)
- Qdata模块-python获取关键词百度指数
- 读《JOINT AND ADVERSARIAL TRAINING WITH ASR FOR EXPRESSIVE SPEECH SYNTHESIS》
- unity-新手引导
- uniapp小程序绘制二维码生成图片截图保存到本地
- 一步一步做项目(3)创建Web项目