0

我对 WPF 很陌生，我想创建一个模式弹出设置管理器。我的客户可以以不同的分辨率使用我的应用程序。我还想稍后扩展我的设置管理器并添加更多字段（文本框等）。我已经创建了它的基本版本，但我不确定我是否在设计布局时遵循了所有最佳实践（面板类型、元素的宽度/高度等）。我附上了我正在尝试实现的屏幕截图，并且我还附上了 XAML 与这篇文章。如果我可以做任何更改来改进布局，我将非常感谢您的反馈（以使其更易于维护，因为我将很快添加更多这样的表单）。

注意：我知道我现在已经硬编码文本（不支持本地化等），但现在我只关心布局。我真的很感谢你的帮助。

<Window.Resources>

</Window.Resources>
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto" />
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>

    <TextBlock Width="350" VerticalAlignment="Top" Grid.Row="0" FontFamily="Microsoft Sans Serif" FontSize="11" Foreground="#FFFEFFFC" Text="This is the header containing information related to my dialogbox. It can be multiple lines aswell." Background="{StaticResource {x:Static SystemColors.ControlDarkDarkBrushKey}}" TextWrapping="Wrap" Grid.ColumnSpan="3" Padding="5" />

    <GroupBox Grid.Row="1" Header="My Group Box" Margin="5" Padding="5">
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="auto"></RowDefinition>
                <RowDefinition Height="auto"></RowDefinition>
                <RowDefinition Height="auto"></RowDefinition>
                <RowDefinition Height="auto"></RowDefinition>
            </Grid.RowDefinitions>


            <StackPanel  Grid.Row="0" Orientation="Horizontal" HorizontalAlignment="Left">
                <TextBlock VerticalAlignment="Center" Text="My Label1" />
                <Label DockPanel.Dock="Right" VerticalAlignment="Center" Foreground="Crimson" Content="*" />
            </StackPanel>

            <StackPanel Grid.Row="1" Orientation="Vertical">
                <TextBox TextWrapping="Wrap" Margin="0,0,0,0" MaxLength="255" />
                <TextBlock TextWrapping="Wrap" Visibility="Visible"  Margin="0,2,0,0" Name="labelError1" VerticalAlignment="Top" FontSize="10" Foreground="#FFD80000" Text="Error Message for my textbox1" MaxWidth="455"/>
            </StackPanel>

            <StackPanel  Grid.Row="2"  Orientation="Horizontal" HorizontalAlignment="Left" Margin="0,10,0,0">
                <TextBlock VerticalAlignment="Center" Text="My Label 2" />
                <Label DockPanel.Dock="Right" VerticalAlignment="Center" Foreground="Crimson" Content="*"/>
            </StackPanel>
            <StackPanel Grid.Row="3" Orientation="Vertical">
                <TextBox TextWrapping="Wrap" Margin="0,0,0,0" MaxLength="255" />
                <TextBlock TextWrapping="Wrap" Visibility="Visible"  Margin="0,2,0,0" Name="label1" VerticalAlignment="Top" FontSize="10" Foreground="#FFD80000" Text="Error Message for my textbox2" MaxWidth="455"/>
            </StackPanel>

        </Grid>
    </GroupBox>

    <StackPanel Grid.Row="2" Orientation="Horizontal" Margin="0,10,10,10" HorizontalAlignment="Right" >
        <Button Name="OkButton" Width="88" Height="28"  IsDefault="True" Content="OK"  Command="{Binding Path=OkCommand, Mode=OneWay}" HorizontalAlignment="Right"  Margin="0,0,6,0"/>
        <Button Name="CancelButton" Width="88" Height="28" IsCancel="True" Content="Cancel" HorizontalAlignment="Left" Margin="0"/>
    </StackPanel>
</Grid>


<Window xmlns:dxe="http://schemas.devexpress.com/winfx/2008/xaml/editors"  
        x:Class="WpfApplication1.Window1"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="My Settings Manager" 
        SizeToContent="Height"
        Background="#ffe6e6e6"
        MinWidth="350"
        MinHeight="290"
        Width="350"
        >

    <Window.Resources>

    </Window.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

        <TextBlock VerticalAlignment="Top" Grid.Row="0" FontFamily="Microsoft Sans Serif" FontSize="11" Foreground="#FFFEFFFC" Text="This is the header containing information related to my dialogbox. It can be multiple lines aswell." Background="{StaticResource {x:Static SystemColors.ControlDarkDarkBrushKey}}" TextWrapping="Wrap" Grid.ColumnSpan="3" Padding="5" />

        <GroupBox Grid.Row="1" Header="My Group Box" Margin="5" Padding="5">
            <Grid>
                <Grid.RowDefinitions>
                    <RowDefinition Height="auto"></RowDefinition>
                    <RowDefinition Height="auto"></RowDefinition>
                    <RowDefinition Height="auto"></RowDefinition>
                    <RowDefinition Height="10"></RowDefinition>
                    <RowDefinition Height="auto"></RowDefinition>
                    <RowDefinition Height="auto"></RowDefinition>
                    <RowDefinition Height="*"></RowDefinition>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="auto" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>

                <TextBlock Grid.Row="0" Grid.Column="0" VerticalAlignment="Center" Text="My Label1" />
                <TextBlock Grid.Row="0" Grid.Column="1" Foreground="Crimson" Text="*" Margin="4,2,0,0"/>
                <TextBox Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" TextWrapping="Wrap" Margin="0,0,0,0" MaxLength="255" />
                <TextBlock Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2" Margin="0,2,0,0" Name="labelError1" VerticalAlignment="Top" FontSize="10" Foreground="#FFD80000" Text="Error Message for my textbox1" />

                <TextBlock Grid.Row="4" Grid.Column="0" VerticalAlignment="Center" Text="My Label1"  />
                <TextBlock Grid.Row="4" Grid.Column="1" Foreground="Crimson" Text="*" Margin="4,2,0,0"/>
                <TextBox Grid.Row="5" Grid.Column="0" Grid.ColumnSpan="2" TextWrapping="Wrap" Margin="0,0,0,0" MaxLength="255" />
                <TextBlock Grid.Row="6" Grid.Column="0" Grid.ColumnSpan="2" Margin="0,2,0,0" Name="labelError2" VerticalAlignment="Top" FontSize="10" Foreground="#FFD80000" Text="Error Message for my textbox1" />
            </Grid>
        </GroupBox>

    <Button Grid.Row="2" Name="OkButton" Width="88"   IsDefault="True" Content="OK" Padding="0,3,0,3" Margin="0,5,5,5" HorizontalAlignment="Right"/>
    <Button Grid.Row="2" Name="CancelButton" Width="88" IsCancel="True" Content="Cancel"  Margin="0,5,100,5" Padding="0,3,0,3" HorizontalAlignment="Right"/>


    </Grid>
</Window>
4

1 回答 1

1

有几件事对我来说很突出......

  • UI 对象的通用名称。我讨厌看到名为label1,textbox1等的东西。要么给它们命名为描述性的，要么根本不为它们指定名称。通常我不会命名任何东西，除非我需要在代码中的某处引用它。

  • 您将 aGrid用于行，然后将 Horizo​​ntal StackPanels 用于列。你为什么不使用Grid你的行和列？这样一来，您的 UI 树中的对象就会减少，并且您的列将排列整齐

  • 你不需要设置很多默认的东西。例如，控件是Visible默认的，所以Visibility="Visible"看起来没有必要，只会让代码更难阅读

  • 一些通用的东西可以放在 Style 中，而不是放在 中，<Tag>以便更容易阅读 XAML。通常，我会尝试将所有样式属性（Margin、Height、Alignment等）放在<Style>标签中，并且只在 XAML 的正文中保留相关的布局属性（例如DockPanel.Dockor Grid.Column）和数据（Text、Tooltip、Command等）。

于 2012-07-16T20:09:48.003 回答