为什么BorderThickness
会更改渲染的CornerRadius
?
还有,它背后的设计原理/哲学是什么?我就是不明白,也许我错过了什么。
<Border Width="300"
Height="300"
Background="Red"
BorderBrush="Blue"
CornerRadius="5"
BorderThickness="50" />
<Border Width="300"
Height="300"
Background="Red"
BorderBrush="Blue"
CornerRadius="5"
BorderThickness="10" />
我看到Rectangle具有相同的行为。
在WPF或WinUI中有没有什么元素可以用来绘制精确的半径,这样我就可以尊重设计师的要求?
除了路径与自定义点,我没有看到任何其他的方式。路径的问题是我需要重新计算点自己时,宽度/高度的变化,这将损害性能。
编辑:尝试调整加铺转角半径以使其符合设计规格结果是不可能的。
例如,假设设计者需要CornerRadius=5且BorderThickness = 30的Border。
在下图中,顶部边界显示了CornerRadius=5的实际外观。
在底部的Border中,我尝试满足设计规格。我将BorderThickness设置为30,并将CornerRadius调整为非常小的值,以便它看起来接近上方Border的圆角半径。但即使值非常小,CornerRadius仍保持相当大的值0.0000002
:
<Border Width="100"
Height="100"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Background="Red"
BorderThickness="0"
CornerRadius="5"/>
<Border Width="100"
Height="100"
HorizontalAlignment="Left"
VerticalAlignment="Top"
Background="Red"
BorderBrush="Blue"
BorderThickness="30"
CornerRadius="0.0000002" />
编辑#2:
因此,与顶部的Border相比,底部Border的圆角半径更明显:
1条答案
按热度按时间vm0i2vca1#
为什么BorderThickness会更改渲染的CornerRadius?
观察Border的方法
OnRender
,如果设置了CornerRadius
属性,则有一个Pen
,其目的是绘制圆角矩形...笔具有Thickness
属性,笔的厚度= Border的厚度。这是当
CornerRadius
和BorderThickness
都被设置时(在均匀厚度和均匀半径的情况下),OnRender
方法内部的执行流程。因此,有一个厚度-半径的权衡是无法避免的,可能唯一的方法来处理它是设置一个基础边界(边界,满足设计师的指导方针)和其他边界,你会增加其半径,如果其厚度小于基础边界的厚度!
更新
请注意,边界的尺寸(
Width
和Height
)是等式中的第三个因子(请参见DrawRoundedRectangle
调用)。假设您要使用粗细为30的笔绘制大小为100 x100的矩形。您从顶线的中间开始绘制,并将笔向左移动(下图)..现在,你会在到达角落之前很早就开始转移笔,因为你不允许走出100 x100,并且这将导致大的曲线,因此在这种情况下半径的值将不起作用,因为
Width
和Height
具有比CornerRadius
更高的优先级。因此,要使像
0.0000002
这样的非常小的半径生效,必须将矩形的尺寸放大到粗细为30的笔看起来小到足以到达角附近的大小。这是第一个xaml代码后,调整半径的第二个边界(设置为20),使它看起来像第一个边界。
要使第一个边框看起来像第二个边框,可以将其代码更改为