调整 UserControl 子项的大小有问题,或者可能是比使用 UserControl 更好的方法?
Troubles with resizing UserControl children or perhaps a better method than using an UserControl?
我目前正在开发一个 WPF 小程序,用作离线工单的模板和记录器。
我的程序设计目前基于将用户控件创建为票证。此票证 (UserControl) 是一组文本字段。这是我的用户控件的屏幕截图。
我的程序然后读取票证中的每个字段并将其存储在文本文件中。
这一切都适用于调整大小。 WPF 很难调整大小(在我看来)。我对 WPF 没有太多经验,但我无法让 UserControl 在我的主要 window 中使用的网格上调整大小。控件调整大小,但我的用户控件的 none 个子控件调整大小。
这是我的主要 window 的样子
工单已添加到“工单”选项卡下的网格中。此处调整大小的所有内容都期望 UserControl 的子项(文本字段、按钮等)。
问题:有没有更好的方法来制作这样的东西(IE 不使用用户控件)或者我只需要使用一个凌乱的网格,以及大量的我的 UserControl 和她的 Children 上的 stretch 和 auto 属性可以让它工作吗?
也许我只是在这种情况下完全错误地使用了 UserControls。
大多数 WPF 控件(以及用户控件)的默认行为是展开并占用尽可能多的space
例如(xml 姓名spaces 为清楚起见省略)
<Window>
<Button Content="Hello" />
</Window>
如果您最大化 window
,将创建一个大按钮
在你的情况下,我猜你正在使用 Visual Studio 设计器来对齐和调整各个控件的大小。设计器生成的代码的一种行为是,如果您移动控件来定位它们,则设置 Margin
属性,如果您调整大小,则设置 Width
和 Height
。这会导致它们停止扩张或拉伸。
通常,我避免使用可视化设计器,而是直接使用 XAML 编辑器来设计布局并验证它是否按预期在可视化设计器上显示。
虽然让控件根据屏幕可用性进行扩展和收缩是件好事,但有时可能会导致布局和大小不佳或奇怪。通常,当我使用 Grid
作为布局时,我会为控件设置个别子项的 MinWidth
、MinHeight
、MaxWidth
和 MaxHeight
过度拉伸或压缩(RadioButtons、CheckBox)。对于某些控件,最好仅水平拉伸(单行文本输入对于您的情况下的问题定义字段),其中将 Grid
行高设置为 auto
是明智的,以便控件获得所需的足够高度。
也可以使用具有合理 min/max 宽度限制的 GridSplitter
以允许用户在 window 尺寸太小时调整 LHS 列的大小
类似这样的东西(虽然没有测试)
<Window>
<Window.Resources>
<Style TargetType="TextBox">
<Setter Property="Margin" Value="5" />
</Style>
<Style TargetType="Button">
<Setter Property="Margin" Value="5" />
</Style>
<Style TargetType="TextBlock">
<Setter Property="Margin" Value="5" />
<Setter Property="FontWeight" Value="Bold"/>
</Style>
</Window.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.3*" MinWidth="200" MaxWidth="350" />
<ColumnDefinition Width="0.7*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<!-- first column -->
<TextBlock Grid.Column="0"
Grid.Row="0"
Text="Employee ID" />
<TextBox Grid.Column="0"
Grid.Row="1"
Text="{Binding EmployeeID}" />
<TextBlock Grid.Column="0"
Grid.Row="2"
Text="User Name" />
<TextBox Grid.Column="0"
Grid.Row="3"
Text="{Binding UseName}" />
<TextBlock Grid.Column="0"
Grid.Row="4"
Text="Computer Name" />
<TextBox Grid.Column="0"
Grid.Row="5"
Text="{Binding ComputerName}" />
<TextBlock Grid.Column="0"
Grid.Row="6"
Text="PhoneNumber" />
<TextBox Grid.Column="0"
Grid.Row="7"
Text="{Binding PhoneNumber}" />
<TextBlock Grid.Column="0"
Grid.Row="8"
Text="Location" />
<TextBox Grid.Column="0"
Grid.Row="9"
Grid.RowSpan="2"
Text="{Binding Location}" />
<Button Grid.Column="0"
Grid.Row="11"
Text="Copy All" />
<!-- second column -->
<TextBlock Grid.Column="1"
Grid.Row="0"
Text="Problem Description" />
<Grid Grid.Column="1"
Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<TextBox Grid.Column="0"
Text="{Binding ProblemDescription}" />
<Button Grid.Column="1"
Content="C" />
</Grid>
<TextBlock Grid.Column="1"
Grid.Row="2"
Text="Notes" />
<TextBox Grid.Column="0"
Grid.Row="3"
Grid.RowSpan="7"
Text="{Binding Notes}" />
<TextBlock Grid.Column="1"
Grid.Row="10"
Text="Resolution" />
<Grid Grid.Column="1"
Grid.Row="11">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<TextBox Grid.Column="0"
Text="{Binding Resolution}" />
<Button Grid.Column="1"
Content="C" />
</Grid>
<!-- splitter to make the columns resizable -->
<GridSplitter Grid.Column="1"
Grid.Row="0"
Grid.RowSpan="12"
Width="3"
Background="Blue" />
</Grid>
</Window>
我目前正在开发一个 WPF 小程序,用作离线工单的模板和记录器。
我的程序设计目前基于将用户控件创建为票证。此票证 (UserControl) 是一组文本字段。这是我的用户控件的屏幕截图。
我的程序然后读取票证中的每个字段并将其存储在文本文件中。
这一切都适用于调整大小。 WPF 很难调整大小(在我看来)。我对 WPF 没有太多经验,但我无法让 UserControl 在我的主要 window 中使用的网格上调整大小。控件调整大小,但我的用户控件的 none 个子控件调整大小。
这是我的主要 window 的样子
工单已添加到“工单”选项卡下的网格中。此处调整大小的所有内容都期望 UserControl 的子项(文本字段、按钮等)。
问题:有没有更好的方法来制作这样的东西(IE 不使用用户控件)或者我只需要使用一个凌乱的网格,以及大量的我的 UserControl 和她的 Children 上的 stretch 和 auto 属性可以让它工作吗?
也许我只是在这种情况下完全错误地使用了 UserControls。
大多数 WPF 控件(以及用户控件)的默认行为是展开并占用尽可能多的space
例如(xml 姓名spaces 为清楚起见省略)
<Window>
<Button Content="Hello" />
</Window>
如果您最大化 window
,将创建一个大按钮在你的情况下,我猜你正在使用 Visual Studio 设计器来对齐和调整各个控件的大小。设计器生成的代码的一种行为是,如果您移动控件来定位它们,则设置 Margin
属性,如果您调整大小,则设置 Width
和 Height
。这会导致它们停止扩张或拉伸。
通常,我避免使用可视化设计器,而是直接使用 XAML 编辑器来设计布局并验证它是否按预期在可视化设计器上显示。
虽然让控件根据屏幕可用性进行扩展和收缩是件好事,但有时可能会导致布局和大小不佳或奇怪。通常,当我使用 Grid
作为布局时,我会为控件设置个别子项的 MinWidth
、MinHeight
、MaxWidth
和 MaxHeight
过度拉伸或压缩(RadioButtons、CheckBox)。对于某些控件,最好仅水平拉伸(单行文本输入对于您的情况下的问题定义字段),其中将 Grid
行高设置为 auto
是明智的,以便控件获得所需的足够高度。
也可以使用具有合理 min/max 宽度限制的 GridSplitter
以允许用户在 window 尺寸太小时调整 LHS 列的大小
类似这样的东西(虽然没有测试)
<Window>
<Window.Resources>
<Style TargetType="TextBox">
<Setter Property="Margin" Value="5" />
</Style>
<Style TargetType="Button">
<Setter Property="Margin" Value="5" />
</Style>
<Style TargetType="TextBlock">
<Setter Property="Margin" Value="5" />
<Setter Property="FontWeight" Value="Bold"/>
</Style>
</Window.Resources>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.3*" MinWidth="200" MaxWidth="350" />
<ColumnDefinition Width="0.7*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="auto"/>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<!-- first column -->
<TextBlock Grid.Column="0"
Grid.Row="0"
Text="Employee ID" />
<TextBox Grid.Column="0"
Grid.Row="1"
Text="{Binding EmployeeID}" />
<TextBlock Grid.Column="0"
Grid.Row="2"
Text="User Name" />
<TextBox Grid.Column="0"
Grid.Row="3"
Text="{Binding UseName}" />
<TextBlock Grid.Column="0"
Grid.Row="4"
Text="Computer Name" />
<TextBox Grid.Column="0"
Grid.Row="5"
Text="{Binding ComputerName}" />
<TextBlock Grid.Column="0"
Grid.Row="6"
Text="PhoneNumber" />
<TextBox Grid.Column="0"
Grid.Row="7"
Text="{Binding PhoneNumber}" />
<TextBlock Grid.Column="0"
Grid.Row="8"
Text="Location" />
<TextBox Grid.Column="0"
Grid.Row="9"
Grid.RowSpan="2"
Text="{Binding Location}" />
<Button Grid.Column="0"
Grid.Row="11"
Text="Copy All" />
<!-- second column -->
<TextBlock Grid.Column="1"
Grid.Row="0"
Text="Problem Description" />
<Grid Grid.Column="1"
Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<TextBox Grid.Column="0"
Text="{Binding ProblemDescription}" />
<Button Grid.Column="1"
Content="C" />
</Grid>
<TextBlock Grid.Column="1"
Grid.Row="2"
Text="Notes" />
<TextBox Grid.Column="0"
Grid.Row="3"
Grid.RowSpan="7"
Text="{Binding Notes}" />
<TextBlock Grid.Column="1"
Grid.Row="10"
Text="Resolution" />
<Grid Grid.Column="1"
Grid.Row="11">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="auto" />
</Grid.ColumnDefinitions>
<TextBox Grid.Column="0"
Text="{Binding Resolution}" />
<Button Grid.Column="1"
Content="C" />
</Grid>
<!-- splitter to make the columns resizable -->
<GridSplitter Grid.Column="1"
Grid.Row="0"
Grid.RowSpan="12"
Width="3"
Background="Blue" />
</Grid>
</Window>