Flutter_Image详解例子

NetworkImage 例子：
先上效果图：

<code>import &#039;package:flutter/material.dart&#039;;

main(){
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text(&quot;Image详解_例子&quot;),
        centerTitle: true,
      ),
      body: const MyHomeContent(),
    );
  }
}

class MyHomeContent extends StatefulWidget {
  const MyHomeContent({Key? key}) : super(key: key);

  @override
  State&lt;MyHomeContent&gt; createState() =&gt; _MyHomeContentState();
}

class _MyHomeContentState extends State&lt;MyHomeContent&gt; {
  final String imageUrl = &quot;https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fnews.yxrb.net%2Fuploadfile%2F2021%2F0419%2F20210419103029168.jpg&amp;refer=http%3A%2F%2Fnews.yxrb.net&amp;app=2002&amp;size=f9999,10000&amp;q=a80&amp;n=0&amp;g=0n&amp;fmt=auto?sec=1660126448&amp;t=f05df4856138d1f1a82712c9cd9e7546&quot;;

  @override
  Widget build(BuildContext context) {
    return Image(
        image: NetworkImage(imageUrl),
        width: 300,
        height: 300,
        fit: BoxFit.fitWidth,
        //color: Colors.purple,
        //colorBlendMode: BlendMode.colorDodge,
    );
  }
}</code>

AssetImage 例子：

<code>import &#039;package:flutter/material.dart&#039;;

main(){
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text(&quot;Image详解_例子&quot;),
        centerTitle: true,
      ),
      body: const MyHomeContent(),
    );
  }
}

class MyHomeContent extends StatefulWidget {
  const MyHomeContent({Key? key}) : super(key: key);

  @override
  State&lt;MyHomeContent&gt; createState() =&gt; _MyHomeContentState();
}

class _MyHomeContentState extends State&lt;MyHomeContent&gt; {

  @override
  Widget build(BuildContext context) {
    return const Image(
        image: AssetImage(&quot;assets/images/lizi.jpeg&quot;),
        width: 300,
        height: 300,
        fit: BoxFit.fitWidth,
        //color: Colors.purple,
        //colorBlendMode: BlendMode.colorDodge,
    );
  }
}</code>