Flutter -Clip裁剪

Widget avatar = Image.asset("assets/images/caver.webp", width: 60.0,height: 60,fit: BoxFit.fill,);

Widget avatar2 = Image.asset("assets/images/wy_300x200.webp", width: 90.0,height: 60,fit: BoxFit.fill,);

如果图片是一个 方形的话 ,裁剪结果为原型 ,长方形的话结果为椭圆形

			ClipOval(
              child:avatar
            ),
            ClipOval(
              child:avatar2
            ),

通过圆角裁剪

			ClipRRect(
              borderRadius: BorderRadius.circular(5),
              child: avatar,
            ),
            ClipRRect(
              borderRadius: BorderRadius.circular(15),
              child: avatar2,
            ),

import 'package:flutter/material.dart';
import 'package:english_words/english_words.dart';

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

  @override
  State<MyClipState> createState() => _MyState();
}

class _MyState extends State<MyClipState> {


  @override
  Widget build(BuildContext context) {

    Widget avatar = Image.asset("assets/images/caver.webp", width: 60.0,height: 60,fit: BoxFit.fill,);

    Widget avatar2 = Image.asset("assets/images/wy_300x200.webp", width: 90.0,height: 60,fit: BoxFit.fill,);
    return Scaffold(
      appBar: AppBar(
        title: const Text("Clip"),
      ),
      body: ConstrainedBox(
        constraints: BoxConstraints.tightFor(width: double.infinity),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: <Widget>[
            avatar,
            avatar2,
            ClipOval(
              child:avatar
            ),
            ClipOval(
                child:avatar2
            ),
            ClipRRect(
              borderRadius: BorderRadius.circular(5),
              child: avatar,
            ),
            ClipRRect(
              borderRadius: BorderRadius.circular(15),
              child: avatar2,
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                Align(
                  alignment: Alignment.topLeft,
                  widthFactor: .5,//宽度设为原来宽度一半，另一半会溢出
                  child: avatar,
                ),
                Text("你好世界", style: TextStyle(color: Colors.green),)
              ],
            ),
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: <Widget>[
                ClipRect(//将溢出部分剪裁
                  child: Align(
                    alignment: Alignment.topLeft,
                    widthFactor: .5,//宽度设为原来宽度一半
                    child: avatar,
                  ),
                ),
                Text("你好世界",style: TextStyle(color: Colors.green))
              ],
            ),
          ],
        ),
      ),
    );

  }


}