今天新学习了Image组件的应用
首先引入图片有四种方式
new Image,用于从ImageProvider获取图像。
new Image.asset,用于使用key从AssetBundle获取图像。
new Image.network,用于从URL地址获取图像。
new Image.file,用于从File获取图像。为了自动执行像素密度感知资源分辨率,使用AssetImage指定图像,需要确保在控件树中的图片控件上方存在MaterialApp、WidgetsApp和MediaQuery控件。
参考博文:https://blog.csdn.net/hekaiyou/article/details/53204466
然后自己做了一个通过网络url地址引入图片的例子
import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: "Text Widget",
home: Scaffold(
body: Center(
child: Container(
child: Image.network(//图片组件
'https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1352807053,3315013341&fm=26&gp=0.jpg',//图片url地址
// fit: BoxFit.fitWidth,//图片在容器中的填充方式
scale: 1.5,
color: Colors.pink[50],//需要混合在图片上的颜色
colorBlendMode:BlendMode.colorBurn,//图片以何种模式与颜色混合
repeat: ImageRepeat.repeatY,//图片重复,以中心Y轴纵向重复
),
width: 420.0,
height: 700.0,
color: Colors.pink[100],//容器的颜色,我这里把尺寸设置的超过了屏幕,皆为美观
),
),
),
);
}
}
fit下Boxfit的一些属性
个人colorBlendMode的常用属性:
modulate
colorBurn
multiply
darken