自定义控件不会随着 window 调整大小而调整大小

Question

我有一个使用此布局的自定义控件：

<Border x:Name="PART_OuterBorder"
    CornerRadius="1000"
    BorderThickness="3"
    BorderBrush="Black">
    <Border.Background>
        <RadialGradientBrush>
            <RadialGradientBrush.GradientStops>
                <GradientStop Offset="0" Color="#438F40"/>
                <GradientStop Offset="0.95" Color="#0D441D"/>
                <GradientStop Offset="2" Color="#106E42"/>
            </RadialGradientBrush.GradientStops>
        </RadialGradientBrush>
    </Border.Background>

    <Border x:Name="PART_InnerBorder"
        CornerRadius="1000">
        <Border.Background>
            <RadialGradientBrush>
                <RadialGradientBrush.GradientStops>
                    <GradientStop Offset="0" Color="#333439"/>
                    <GradientStop Offset="1.5" Color="#000"/>
                </RadialGradientBrush.GradientStops>
            </RadialGradientBrush>
        </Border.Background>
        <userControls:DraggableElement x:Name="PART_DraggableElement"
                                Width="16" Height="16"/>
    </Border>
</Border>

如你所见，我没有为2个边框设置宽度和高度，我在网格行中使用了控件：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition/>
        <RowDefinition Height="1.5*"/>
        <RowDefinition/>
    </Grid.RowDefinitions>

    <customControls:myCustomControl Grid.Row="1" HorizontalAlignment="Stretch"
                                      VerticalAlignment="Stretch"/>
</Grid>

但是当我调整大小时控件没有调整大小window。顺便说一句，如果我把它放在一个更小或更大的网格单元格中，它会修复它的大小，这是它唯一一次修复它的大小。

我还考虑过在我的自定义控件模板中使用 ViewBox 作为边框的父级，但这会改变整个布局：

正常：

使用 ViewBox：

Answer 1

是的，根据你的文字和代码，你的图片符合预期。因为你没有设置“myCustomControl”的宽度和高度，所以这两个边框会填满myCustomControl的所有区域。并且设置了DraggableElement的with和height，它是固定大小的。当你使用 viewbox 时，viewbox 会认为 myCustomControl 的 with 和 height 是 DraggableElement 的。所以黄色会占据所有区域。如果你想让你的控件不填满你的区域，但又保持比例，你可以设置PART_OuterBorder的宽度和高度，并在PART_OuterBorder周围使用viewbox。代码如下：

 <Viewbox Grid.Row="1" StretchDirection="Both" Stretch="Fill">
        <Border  Background="Red" Width="100" Height="100">
            <Border x:Name="PART_OuterBorder" 
                    CornerRadius="1000"
                    BorderThickness="3"
                    BorderBrush="Black">
                <Border.Background>
                    <RadialGradientBrush>
                        <RadialGradientBrush.GradientStops>
                            <GradientStop Offset="0" Color="#438F40"/>
                            <GradientStop Offset="0.95" Color="#0D441D"/>
                            <GradientStop Offset="2" Color="#106E42"/>
                        </RadialGradientBrush.GradientStops>
                    </RadialGradientBrush>
                </Border.Background>

                <Border x:Name="PART_InnerBorder"
                         CornerRadius="1000">
                    <Border.Background>
                        <RadialGradientBrush>
                            <RadialGradientBrush.GradientStops>
                                <GradientStop Offset="0" Color="#333439"/>
                                <GradientStop Offset="1.5" Color="#000"/>
                            </RadialGradientBrush.GradientStops>
                        </RadialGradientBrush>
                    </Border.Background>
                    <TextBlock Foreground="White" FontSize="30" VerticalAlignment="Center" HorizontalAlignment="Center">haha</TextBlock>
                </Border>
            </Border>
        </Border>
    </Viewbox>

自定义控件不会随着 window 调整大小而调整大小

Custom control doesn't resize as window resizes

c#

wpf

xaml

responsiveness