5.5 容器类组件 - Clip

Flutter中，Clip组件用于对子组件进行裁剪

ClipRect: 默认裁减掉子组件布局空间之外的绘制内容

ClipRRect: 将子组件裁剪为圆角矩形

ClipOval: 子组件为正方形时裁剪为内贴圆形，为矩形时，裁剪为内贴椭圆

ClipPath: 按照自定义路径裁剪

@override
Widget build(BuildContext context) {
  Widget avatar = Image.asset("assets/images/tv.jpg", width: 60);
  return Center(
    child: Column(
      children: [
        avatar, // 不裁剪
        ClipOval(child: avatar,), // 裁剪为圆形
        ClipRRect( // 裁剪为圆角矩形
          borderRadius: BorderRadius.circular(5),
          child: avatar,
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Align(
              alignment: Alignment.topLeft,
              widthFactor: 0.5, // 宽度设置为原来的一半，另一半会溢出
              child: avatar,
            ),
            const Text(
              "你好世界",
              style: TextStyle(
                color: Colors.green
              ),
            )
          ],
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ClipRect( // 将溢出部分裁剪
              child: Align(
                alignment: Alignment.topLeft,
                widthFactor: .5, // 宽度为原来的一半
                child: avatar,
              ),
            ),
            const Text("你好世界",
            style: TextStyle(
              color: Colors.green
            ),
            )
          ],
        )
      ],
    ),
  );
}