你是否曾在你的应用程序中有着一张图片或一些内容,并想着:"我希望我可以将那些角变得平滑以进行一些修饰。"
Flutter有着一个针对此情景的widget。
它叫做ClipRRect。一个多余的“r”代表这“rounded(圆角)”
你只需用一个clipper裹着应用程序,注明一个borderRadius—那就是我们想将角修剪成的圆的半径—然后你就得到了一个圆角长方形。
ClipRRect(
borderRaduis:
BorderRadius.circular(15.0),
child: MyDashPicWidget(),
);
像是ClipRRect的widget是通过置入一个特别的Render物体到Render Tree内的方式运作,就在他们的产物上。
那个Render物体在每次Flutter重绘时会进行一次修剪。
除了设定半径之外,ClipRRect有着一个clipBehavior的属性—因此你可以自定Edge。
ClipRRect(
borderRadius:
BorderRadius.circular(15.0),
clipBehavior: Clip.hardEdge,
child: MyDashPicWidget(),
);
如果你想要尝试不一样的形状,它有着叫做ClipOval、ClipPath等的相似的Widget。
如果想了解有关ClipRRect的内容,或者关于Flutter的其他功能,请访问flutter.io
原文翻译自视频:视频地址