如何实现剪裁功能

标签：功能 child 如何 ClipOval ClipRRect 组件 剪裁 属性

文章目录

• 1 概念介绍
• 2 使用方法
• • 2.1 ClipOval
  • 2.2 ClipRRect
• 3 示例代码

我们在上一章回中介绍了AspectRatio Widget相关的内容，本章回中将介绍剪裁类组件(Clip).闲话休提，让我们一起Talk Flutter吧。

1 概念介绍

我们在这里说的剪裁类组件主要是指对子组件进行剪裁操作，常用的剪裁类组件有ClipOval和ClipRRect。前者可以把子组件剪裁为圆形或者椭圆，后者可以把子组件剪裁为圆角矩形。本章回中将介绍这两种组件的使用方法。

2 使用方法

2.1 ClipOval

该组件主要用来把子组件剪裁成圆形或者椭圆，常用的属性如下：

• clipper属性：主要用来控制剪裁的尺寸；
• child属性：主要用来存放被剪裁的子组件；
  上面提到的clipper属性是可选属性，不给该属性赋值时使用默认的尺寸进行剪裁，我们也可以自定义一个剪裁类，在类中控制被剪裁组件的尺寸；

2.2 ClipRRect

该组件主要用来把子组件剪裁成圆角矩形，常用的属性如下：

• clipper属性：主要用来控制剪裁的尺寸；
• child属性：主要用来存放被剪裁的子组件；
• borderRadius属性：主要用来控制圆角的半径大小；
  上面介绍的这三个属性中，前两个属性的功能和ClipOval组件中同名属性的功能相同，最后一个属性是ClipRRect组件特有的属性。

3 示例代码

//剪裁成椭圆或者圆形形状
Container(
  width: 100, height: 100,
  color: Colors.grey,
  child: ClipOval(
    child: Image.asset(

标签：功能,child,如何,ClipOval,ClipRRect,组件,剪裁,属性
From： https://blog.csdn.net/talk_8/article/details/144152439