26

WPFレイアウトグリッドのセル、行、および列のスタイルを設定する方法があるかどうかを知りたいです。私は情報を見つけようとしてきましたが、見つけたいくつかの言及はそれほど有益ではありませんでした。

リンクされたスクリーンショットのようにグリッドのスタイルを設定したいと思います。

実際のコントロールがそれをサポートしていない場合、どうにかしてそれを継承して実行できますか?私はWPFを初めて使用するので、助けていただければ幸いです。

もう1つ、グリッド内のすべてのコントロールのスタイルを設定できることはわかっていますが、やり過ぎのようです。それ自体を行うグリッドが欲しいのですが。

スクリーンショットhttp://img21.imageshack.us/img21/2842/capturehz8.png

4

5 に答える 5

26

@Dan は、私が現在読んでいる WPF Unleashed を推奨しています。ちょうど今朝、あなたの質問に対処しているセクションに出くわしました。

第6章、161ページ:

FAQ: HTML テーブルのセルでできるように、グリッド セルに背景色、パディング、境界線を与えるにはどうすればよいですか?

Grid セルにそのようなプロパティを与える固有のメカニズムはありませんが、どの Grid セルにも複数の要素を表示できるため、非常に簡単にシミュレートできます。セルに背景色を与えるには、適切な Fill を使用して Rectangle を単純に配置できます。これは、デフォルトでセルを塗りつぶすように引き伸ばされます。セルのパディングを指定するには、自動サイズ変更を使用して、適切な子要素に Margin を設定します。境界線については、再び Rectangle を使用できますが、それに適切な色の明示的な Stroke を指定するか、代わりに単純に Border 要素を使用できます。

そのような Rectangles または Borders を他の子の前に Grid に追加する (または ZIndex 添付プロパティで明示的にマークする) ようにしてください。そうすれば、それらの Z オーダーはメイン コンテンツの後ろに配置されます。

ところで、WPF Unleashed rocks。とても丁寧に書かれており、フルカラー印刷でさらに読みやすくなっています。

于 2009-02-19T13:51:59.533 に答える
19

これは、必要な形式を取得するためにハックできる簡単な (非常に大まかなサンプル) です (WPF を真剣に使用している場合は、Blend がレイアウトの見栄えを良くするのに非常に役立つことがわかります)。

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"                                                                                                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
       <Page.Resources>
           <Style x:Key="CustomerDefinition" TargetType="TextBlock">
               <Setter Property="Control.FontFamily" Value="Tahoma"/>
               <Setter Property="Control.FontSize" Value="12"/>
               <Setter Property="Control.Foreground" Value="Red"/>
           </Style>
           <Style TargetType="{x:Type Label}">
               <Setter Property="Width" Value="100"/>
           </Style>
           <Style x:Key="{x:Type TextBox}" TargetType="{x:Type TextBox}">
               <Setter Property="SnapsToDevicePixels" Value="True"/>
               <Setter Property="OverridesDefaultStyle" Value="True"/>
               <Setter Property="KeyboardNavigation.TabNavigation" Value="None"/>
               <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
               <Setter Property="MinWidth" Value="120"/>
               <Setter Property="MinHeight" Value="20"/>
               <Setter Property="AllowDrop" Value="true"/>
               <Setter Property="Width" Value="200"/>
               <Setter Property="Template">
                   <Setter.Value>
                       <ControlTemplate TargetType="{x:Type TextBoxBase}">
                           <Border
                               Name="Border"
                               Background="#FFEBE9E9"
                               BorderBrush="#FF8B8787"
                               BorderThickness="1"
                               CornerRadius="2"
                               Padding="3">
                               <ScrollViewer x:Name="PART_ContentHost" Margin="0"/>
                           </Border>
                           <ControlTemplate.Triggers>
                               <Trigger Property="IsEnabled" Value="False">
                                   <Setter TargetName="Border" Property="Background"
                                                       Value="#EEEEEE"/>
                                   <Setter TargetName="Border" Property="BorderBrush"
                                                       Value="#EEEEEE"/>
                                   <Setter Property="Foreground" Value="#888888"/>
                               </Trigger>
                           </ControlTemplate.Triggers>
                       </ControlTemplate>
                   </Setter.Value>
               </Setter>
           </Style>
           <LinearGradientBrush x:Key="NormalBrush" StartPoint="0,0" EndPoint="0,1">
               <GradientBrush.GradientStops>
                   <GradientStopCollection>
                       <GradientStop Offset="0.0" Color="#FFF0EDED"/>
                       <GradientStop Offset="1.0" Color="#FFE1E0E0"/>
                   </GradientStopCollection>
               </GradientBrush.GradientStops>
           </LinearGradientBrush>
       </Page.Resources>
       <Grid>
           <Grid.ColumnDefinitions>
               <ColumnDefinition Width="*"/>
               <ColumnDefinition Width="*"/>
           </Grid.ColumnDefinitions>
           <Grid.RowDefinitions>
               <RowDefinition Height="26"/>
               <RowDefinition Height="23"/>
               <RowDefinition Height="24"/>
               <RowDefinition Height="24"/>
               <RowDefinition Height="24"/>
           </Grid.RowDefinitions>
           <TextBlock
               Grid.ColumnSpan="2"
               Grid.Row="0"
               Style="{StaticResource CustomerDefinition}"
               Text="Customer Definition"/>
           <Border
               Grid.Column="0"
               Grid.Row="1"
               Background="#FFEBE9E9"
               BorderBrush="#FF8B8787"
               BorderThickness="1">
               <StackPanel Background="{StaticResource NormalBrush}" Orientation="Horizontal">
                   <Label Content="Customer Code"/>
                   <TextBox Text="SMITHA 098 (normally I'd bind here)"/>
               </StackPanel>
           </Border>
           <Border
               Grid.Column="1"
               Grid.Row="1"
               Background="#FFEBE9E9"
               BorderBrush="#FF8B8787"
               BorderThickness="1">
               <StackPanel Background="{StaticResource NormalBrush}" Orientation="Horizontal">
                   <Label Content="Customer Type"/>
                   <TextBox Text="PRIVATE INDIVIDUAL"/>
               </StackPanel>
           </Border>
       </Grid> </Page>
于 2009-02-19T14:34:09.743 に答える
5

WPFGridには、目に見えるセルがありません。それらは、子要素を整列させることができる目に見えないグリッド線と考えてください。

したがって、グリッドのセルのスタイルを設定するには、グリッド内に配置されたアイテムのスタイルを設定する必要があります。

Gridを WinForms のようなものと考えると混乱しますDataGridTableLayout最も近い WinForms の同等物はコントロールだと思います。

サードパーティのグリッド コントロールを確認してください。ベータ版の DevExpress を使用したところ、非常に簡単であることがわかりました。

于 2009-02-19T13:38:08.240 に答える
3

スタイリングにはボーダーを使用することをお勧めします。

各行と各列に境界線を作成し、それに応じて行スパンと列スパンを設定することで、そのレイアウトを非常に簡単に再作成できます。

colspan 2 には 5 つの境界線があります。これらの境界線は、各行のグラデーションの背景と、各行の上下に沿った境界線を処理します。次に、rowspan 5 の 2 つの境界線があり、これらは列の境界線を処理します。境界線を重ねて、目的の視覚的なグリッド効果を形成していると想像してください。

ヘッダーと外側の境界線については、必要に応じてグリッド全体を境界線とスタイルでラップするだけです。

すべてのスタイル情報を 1 か所に保管できるように、スタイルをリソースとして保存することをお勧めします。

スタイリングは非常に強力であるため、その仕組みをよく理解しておいてください。可能であれば、 WPF Unleashedを読むことをお勧めします。

于 2009-02-19T13:38:34.650 に答える
1

DataGridセルのマージン(またはパディング)を設定する方法を探しているときに、この投稿を見つけました。私の問題は、(終わり近くに)投稿されたサンプルxamlコードのおかげで解決されました-かなりミニマルです。

http://forums.silverlight.net/forums/p/16842/55997.aspx

于 2010-08-06T20:43:46.647 に答える