如何计算同心圆角矩形的角的半径（半径）

9

我有一个想包含在另一个Roundrect中的Roundrect按钮。包含的roundrect应该始终与按钮保持1px距离。

如果我将容器上的半径设置得太小，则转角周围的间隙会更大。

有没有很好的“经验法则”可以用来确定较大的圆角矩形的半径？

adobe-photoshop

— 迈克·布兰德
source

12

如果希望外部圆角矩形与内部圆角矩形相距1px，则外部矩形的角半径也应比内部圆角矩形的角半径大1px。

这是一个快速的图表，可以帮助您了解其工作原理：
角半径图
内部矩形的转角半径为r像素；它的角遵循内部红色圆圈的弧线，该内部圆圈的半径为r个像素，其中心与矩形的边相对应，为r个像素。

外矩形的角半径为r +1像素；它的角遵循外部红色圆圈的弧，该半径为r +1个像素，其中心对应于矩形的边距r +1个像素。由于外部矩形也在内部的右侧上移了一个像素（我们可以假设是两个两个像素宽且更高以进行补偿），因此两个圆是同心的，它们之间的距离始终为一个像素。

— 伊尔马里·卡洛宁（Ilmari Karonen）
source

我很高兴答案如此简单！

— Mike Brand

我曾尝试通过比较一个带有50 px的外部边框的圆角矩形和一个半径大于50px的新的（宽50px和高一个）圆角矩形来重新创建此矩形。它们并不太匹配，但是现在我想这主要是Photoshop轮廓渲染的怪癖。谢谢您的回答！

— Mike Brand

@Mike：请记住，距离必须添加到矩形的两侧。因此，如果您希望外部矩形边框距内部矩形边框50像素，则需要使外部矩形边框比内部矩形边框宽100像素（高）（并增加边角半径50像素）。

— Ilmari Karonen 2012年

6

如果希望拐角具有共享的中心，则外部形状的拐角半径应简单地是内部形状的拐角半径加上形状之间的距离。如果您的内部形状的圆角半径为5像素，并且您的外部形状的圆角半径为1像素，则外部形状的角半径应该为6像素。（不考虑任何笔划粗细。）

在此处输入图片说明

— 数组
source