flutter - BorderRadius.circular(radius) 如何作为 RoundedRectangleBorder Flutter 的参数工作？

Question

文档只是说明

圆角矩形边框

带有圆角的矩形边框。
通常与 ShapeDecoration 一起使用以绘制带有圆角矩形的框。
此形状可以在 CircleBorder 之间进行插值。

边界半径.圆形

创建所有半径为 [Radius.circular(radius)] 的边界半径。

这是什么意思？如果我的按钮是 50 个逻辑像素（25 个半径），并且我将半径设置为 20，那么它是否应该剪裁 20 个逻辑像素半径之外的角？如果我将其设置为 30，则整个按钮将在圆形半径内，因此不应剪裁任何内容。不是这种情况。

一切 >=30 似乎都将角剪成 45 度弧，从而在按钮的每个短边上形成一个完整的半圆。

谁能解释这个值以及如何使用它？

标签： flutterflutter-layoutrounded-cornerscornerradius

Answer 1

半径告诉您创建圆弧的拐角有多远。因此，如果您只想要稍微圆角的角，则可以使用较小的值。一个 80pt x 30pt 的 DecoratedBox 可能需要一个 7pt 的圆半径。一个圆的半径从顶部和相邻边延伸 7 点。如果您应用的圆形半径大于您遇到半圆的最短可用边。为此，15pt 或更大的半径会产生这种效果。

如果您正在寻找一个可能会为您确定它是圆角的盒子，那么您可以轻松地创建一个类，将 DecoratedBox 包裹在 LayoutBuilder 内，以找出最短边并根据该长度确定小数半径。