Question

我创建了以下WPF控件的点和描述标签：* North Star

<UserControl x:Class="StopPoint.UserControl1"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">
    <Canvas>
        <Path Fill="SkyBlue" Stroke="Black" StrokeThickness="2">
            <Path.Data>
                <EllipseGeometry Center="10, 10" RadiusX="4" RadiusY="4"/>
            </Path.Data>
        </Path>
        <TextBlock Text="North Star" Canvas.Left="20" Canvas.Top="20"/>
    </Canvas>
</UserControl>

我将在面板中有很多明星。我可以自动调整尽可能小的控件吗？

点赞：<Window SizeToContent="WidthAndHeight">...</Window>？

Answer 1

如何将它包装在简单的堆叠面板中呢？

<UserControl x:Class="StopPoint.UserControl1"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">

    <StackPanel Orientation="Horizontal">
        <Ellipse Margin="4" Stroke="Black" Fill="Yellow" Height="10" Width="10"/>
        <TextBlock Text="North Star">
            <TextBlock.RenderTransform>
                <RotateTransform Angle="45"/>
            </TextBlock.RenderTransform>
         </TextBlock>
    </StackPanel>
</UserControl>

Answer 2

d：DesignHeight / Width属性仅在设计器中受到尊重，即Blend或Visual Studio（Cider）设计者。您可以安全地删除它们，然后您将在设计器中看到您没有任何约束的控件。

您描述的自动调整大小行为是许多容器控件的默认行为。尽量不要像Holstebroe建议的那样使用Canvas。同时尝试研究变换 - 您可以应用旋转和平移变换来实现您描述的效果。

Answer 3

您必须在usercontrol中创建自动调整大小的行为。

WPF方式是让父母向孩子们询问他们需要多少空间（测量阶段），然后根据可用空间告诉他们他们实际获得了多少空间（安排阶段）。

在这里，您希望父级的大小由子级所需的空间决定。因此将顶级父级（Canvas / UserControl）的大小绑定到内容所需的空间 - 使用IMultiValueConverter获取多个输入以进行求和。请参阅我发布的关于创建用户控件以获取形状中心文本的链接，这是上述示例。
一旦你有了这个，你也可以使用Viewbox进行“适合屏幕”。

        <!-- 36 <= 20  (canvas.top) + 16 (textblock.actualheight) -->
        <!--75 <= 20 (canvas.left) + 55 (textblock.actualwidth)-->
        <Canvas Background="SkyBlue" Height="36" Width="75">
        <TextBlock Canvas.Left="25" Text="{Binding ElementName=label, Path=ActualHeight}"/>
        <Path x:Name="dot" Fill="SkyBlue" Stroke="Black" StrokeThickness="2">
                <Path.Data>
                    <EllipseGeometry Center="10, 10" RadiusX="4" RadiusY="4"/>
                </Path.Data>
            </Path>

        <TextBlock x:Name="label" Text="North Star" Canvas.Left="20" Canvas.Top="20"/>

自动调整WPF控件

3 个答案: