2

2 つの Border が重なり合っています。1 つは BorderThickness があるが背景がない、もう 1 つは境界線の太さがないが背景がある。両方の Border の CornerRadius は 3 です。問題は、一方の Border の Background の角が、もう一方の Border の角の後ろから突き出ていることです。

隅の青の後ろから灰色が突き出ていることに注目してください。

これは、背景を持つ最初の境界要素と、BorderThickness を持つ FocusVisual という名前の境界線を持つ XAML です。

<Grid x:Name="grid">
    <Border Background="{TemplateBinding Background}"  
            CornerRadius="3">
        <Grid>
            <Border x:Name="MouseOverVisual" 
                Opacity="0"
                Background="{StaticResource NuiFieldHoverBrush}"
                CornerRadius="3" />
            <Border>
                <Grid>
                    <ScrollViewer x:Name="PART_ContentHost" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" />
                    <ContentPresenter x:Name="PART_WatermarkHost" 
                          Content="{TemplateBinding Watermark}"
                          ContentTemplate="{TemplateBinding WatermarkTemplate}"
                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                          IsHitTestVisible="False"
                          Margin="{TemplateBinding Padding}"
                          Visibility="Collapsed"/>
                </Grid>
            </Border>
        </Grid>
    </Border>
    <Border x:Name="FocusVisual" 
            Opacity="0" 
            BorderThickness="{TemplateBinding BorderThickness}"
            BorderBrush="{StaticResource NuiFocusBrush}" 
            CornerRadius="3" />
</Grid>

Border オブジェクトの Background と Border に異なる効果を持つ CornerRadius は、WPF のバグのようです。

BorderThickness を Border に Background とともに追加し、BorderBrush を Background 色に設定することもできますが、これにより、その Border の子要素が BorderThickness によって押し込まれます。要素を再配置することでおそらくこれを回避できますが、それはちょっと面倒なので、誰かがより良い回避策を持っているかどうかを確認したいと思いました.

4

2 に答える 2

1

CornerRadius内側の境界線を再計算する必要があります。
次のようなより単純な例を想定します。

<Border x:Name="OuterBorder" Width="50" Height="25" Background="Gray" CornerRadius="5">
    <Border x:Name="InnerBorder" BorderBrush="red" BorderThickness="4" CornerRadius="5"/>
</Border>

InnerBorder の幅と高さは、各辺から BorderThickness/2 だけ OuterBorder よりも小さいため、この方法でコーダー半径を計算する必要があります。

'内側の境界線のコーナー半径' = '外側の境界線のコーナー半径' - '内側の境界線の境界線の太さ'/2.

この例では、内側の境界線の CornerRadius は 3 にする必要があります。

編集：このSOはあなたの質問に対するより良い答えだと思います。

于 2011-08-10T21:07:42.877 に答える
0

濃い灰色の枠線に透明な枠線を追加すると、青みがかった枠線と一致します。境界線の太さが同じであることを確認してください。

<Grid Width="50" Height="40">
    <Border Background="Red" CornerRadius="3" BorderBrush="Transparent" BorderThickness="1">
        <TextBlock Text="Hello" VerticalAlignment="Center" HorizontalAlignment="Center"/>
    </Border>
    <Border BorderBrush="Blue" CornerRadius="3" BorderThickness="1" Background="Transparent"/>       
</Grid>
于 2011-08-10T21:18:44.603 に答える