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です。何かわかりやすい名前を付けるか、名前をまったく指定しないでください。通常、コードのどこかで参照する必要がない限り、名前は付けません。

  • 行にを使用しGrid、次に列に Horizo​​ntal StackPanels を使用しています。Grid行と列の両方にを使用しないのはなぜですか? そうすれば、UI ツリー内のオブジェクトが少なくなり、列が整列します。

  • 多くのデフォルトのものを設定する必要はありません。たとえば、コントロールはVisibleデフォルトでVisibility="Visible"不要であるように見え、コードを読みにくくするだけです

  • 一般的なものの一部は<Tag>、XAML を読みやすくするために、ではなくスタイルに配置できます。通常、すべてのスタイリング プロパティ ( MarginHeightAlignmentなど) を<Style>タグに配置して、関連するレイアウト プロパティ (DockPanel.Dockまたは などGrid.Column) とデータ ( TextTooltipCommandなど) のみを XAML の本体に保持します。

于 2012-07-16T20:09:48.003 に答える