flutter：Image组件的基本用法以及报错问题解决办法

先上代码

import 'package:flutter/material.dart';
import '../param/config.dart';
import 'dart:ui';
import 'package:device_info/device_info.dart';

class MineInfoWidget extends StatefulWidget {
  /// 组件属性必须使用 final 修饰
  ///   所有的 Widget 组件都是不可变的
  // final String name;
  // final int? age;
  const MineInfoWidget({super.key});

  @override
  State<MineInfoWidget> createState() => _MineInfoWidgetState();
}

class _MineInfoWidgetState extends State<MineInfoWidget> {
  @override
  Widget build(BuildContext context) {
    return Container(
      padding: const EdgeInsets.all(padValue),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.start,
        children: [
          Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Image(
                image: const NetworkImage(infoUlrStr),
                alignment: Alignment.center,
                repeat: ImageRepeat.noRepeat,
                // height: 200.0,
                width: MediaQuery.of(context).size.width - padValue * 2,
              )
            ],
          )
        ],
      ),
    );
  }
}

这是定义的两个固定参数

const infoUlrStr = 'https://lmg.jj20.com/up/allimg/tp09/210H51R3313N3-0-lp.jpg';

const padValue = 15.0;

在使用networkImages的时候报错:
message:"Invalid image data"
hashCode:639365751
会在系系统库的捕获异常的地方报错，闪退，这是因为你引用的图片url不对，你选择图片的时候不要用浏览器的地址，而要选择复制图片的链接地址，这样就不会有这个报错了。
错误示例：https://cn.bing.com/images/search?view=detailV2&ccid=30Ri%2br8Y&id=C0236D1687AEAF3B089855C2315AD6D8AF6F7316&thid=OIP.30Ri-r8Y7dBxlWeaX4o35QHaE2&mediaurl=https%3a%2f%2fts1.cn.mm.bing.net%2fth%2fid%2fR-C.df4462fabf18edd07195679a5f8a37e5%3frik%3dFnNvr9jWWjHCVQ%26riu%3dhttp%253a%252f%252fseopic.699pic.com%252fphoto%252f50059%252f8720.jpg_wh1200.jpg%26ehk%3dofb4q76uCls2S07aIlc8%252bab3H5zwrmj%252bhqiZ%252fyw3Ghw%253d%26risl%3d%26pid%3dImgRaw%26r%3d0&exph=787&expw=1200&q=%e5%9b%be%e7%89%87&simid=608019296324252783&FORM=IRPRST&ck=43E5DD20653A1F45D88C4702230907C8&selectedIndex=1&ajaxhist=0&ajaxserp=0

使用方法：

我们要把照片平铺在页面上，并且宽度等于屏幕的宽度，那我们就需要引入device_info这个库。

device_info: ^2.0.3

宽高的计算方法

float screen_width = MediaQuery.of(context).size.width
float screen_height = MediaQuery.of(context).size.height

其他的方法你们都会用，不再细说。