5.flutter-图片控件

截屏2022-08-03 15.14.17.png
图像 2.gif
import 'dart:ui';
import 'dart:io';

import 'package:cached_network_image/cached_network_image.dart';
import 'package:flutter/material.dart';
import 'package:permission_handler/permission_handler.dart';

import 'package:transparent_image/transparent_image.dart';

class ZFLImageXieChengPage extends StatefulWidget {
  @override
  _ZFLImageXieChengPageState createState() => _ZFLImageXieChengPageState();
}

class _ZFLImageXieChengPageState extends State {
  bool isPermission = false;

  @override
  Widget build(BuildContext context) {
    return Container(
        child: Column(
      children: [
        networkImage(),
        assetImage(),
        assetImage2(),
        setPhoto(),
        fadeImage(),
        fadeImage2(),
        Expanded(child: cacheImage())
      ],
    ));
  }

//网络图片
  networkImage() {
    return Image.network('http://www.devio.org/img/avatar.png');
  }

//静态图片
  assetImage() {
    return Container(
        width: 80,
        height: 80,
        decoration: BoxDecoration(
          image: DecorationImage(
              image: AssetImage('assets/images/icon_detail.png')),
        ));

//    return Container(
//        width: 20,
//        height: 20,
//        decoration: BoxDecoration(
//          image: DecorationImage(
//              image: NetworkImage('http://www.devio.org/img/avatar.png')),
//        ));
//    return AssetImage('assets/images/icon_detail.png');
  }

//静态图片
  assetImage2() {
    return Image.asset(
      'assets/images/icon_detail.png',
      width: 80,
      height: 80,
    );
  }

   // 需要Android-app-src-androidmainfest.xml中 配置权限
//    
//    
//     CircularProgressIndicator(),
        imageUrl:
            'http://t10.baidu.com/it/u=1995885605,1860079861&fm=58&app=83&f=JPEG?w=250&h=250',
      ),
    );
  }
}

你可能感兴趣的:(5.flutter-图片控件)