2016-08-23 26 views
0

私はこのようになりますDataGridTemplateColumnを持っているデータグリッドを持っている:ボタン - 原因不明の間隔

<DataGridTemplateColumn> 
    <DataGridTemplateColumn.HeaderTemplate> 
     <DataTemplate> 
      <ItemsControl ItemsSource="{Binding DataContext.SomeStrings, Source={StaticResource proxy}}"> 
       <ItemsControl.ItemsPanel> 
        <ItemsPanelTemplate> 
         <StackPanel Orientation="Horizontal"></StackPanel> 
        </ItemsPanelTemplate> 
       </ItemsControl.ItemsPanel> 
       <ItemsControl.ItemTemplate> 
        <DataTemplate> 
         <Border Width="30" Margin="0"> 
          <TextBlock Text="{Binding}" TextAlignment="Left"> 
           <TextBlock.LayoutTransform> 
            <RotateTransform Angle="270" CenterX="0.5" CenterY="0.5"/> 
           </TextBlock.LayoutTransform> 
          </TextBlock> 
         </Border> 
        </DataTemplate> 
       </ItemsControl.ItemTemplate> 
      </ItemsControl> 
     </DataTemplate> 
    </DataGridTemplateColumn.HeaderTemplate> 
    <DataGridTemplateColumn.HeaderStyle> 
     <Style TargetType="DataGridColumnHeader"> 
      <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
      <Setter Property="VerticalContentAlignment" Value="Stretch" /> 
      <Setter Property="Margin" Value="0" /> 
     </Style> 
    </DataGridTemplateColumn.HeaderStyle> 

    <DataGridTemplateColumn.CellTemplate> 
     <DataTemplate> 
      <ItemsControl ItemsSource="{Binding}"> 
       <ItemsControl.ItemsPanel> 
        <ItemsPanelTemplate> 
         <StackPanel Orientation="Horizontal"></StackPanel> 
        </ItemsPanelTemplate> 
       </ItemsControl.ItemsPanel> 
       <ItemsControl.ItemTemplate> 
        <DataTemplate> 
         <Border Width="30"> 
          <Button> 
           <TextBlock Text="{Binding}"/> 
          </Button> 
         </Border> 
        </DataTemplate> 
       </ItemsControl.ItemTemplate> 
      </ItemsControl> 
     </DataTemplate> 
    </DataGridTemplateColumn.CellTemplate> 
</DataGridTemplateColumn> 

アイデアは、データグリッドで「列」のダイナミックなセットを持っていることですが、持ちます単一の列それ自体は、StackPanelと同じことを持つことによって、CellTemplate私はうまく整列するためにすべてを得ることができます。このアイデアはここに来ました:http://blogs.msmvps.com/deborahk/populating-a-datagrid-with-dynamic-columns-in-a-silverlight-application-using-mvvm/

これは私がやっていることに十分に機能します。しかし、TextBlockHeaderTemplateに入れてButtonにしたいと思います。したがって、このような何か:なしという

enter image description here

お知らせ:

<DataGridTemplateColumn.HeaderTemplate> 
    <DataTemplate> 
     <ItemsControl ItemsSource="{Binding DataContext.SomeStrings, Source={StaticResource proxy}}"> 
      <ItemsControl.ItemsPanel> 
       <ItemsPanelTemplate> 
        <StackPanel Orientation="Horizontal"></StackPanel> 
       </ItemsPanelTemplate> 
      </ItemsControl.ItemsPanel> 
      <ItemsControl.ItemTemplate> 
       <DataTemplate> 
        <Border Width="30" Margin="0"> 
         <Button> 
          <TextBlock Text="{Binding}" TextAlignment="Left"> 
           <TextBlock.LayoutTransform> 
            <RotateTransform Angle="270" CenterX="0.5" CenterY="0.5"/> 
           </TextBlock.LayoutTransform> 
          </TextBlock> 
         </Button> 
        </Border> 
       </DataTemplate> 
      </ItemsControl.ItemTemplate> 
     </ItemsControl> 
    </DataTemplate> 
</DataGridTemplateColumn.HeaderTemplate> 

問題は、これはいくつかの余分なスペースを紹介し、私は私の人生のためにそれから来るのどこ把握することはできませんということですボタンを押すと、それは上に並んでいますが、ボタンでは右に数ピクセル移動します。この余分な間隔はどこで分かりますか?どうすればそれをしないの?私はちょうど私のStackPanelに負の左マージンを得ることができたが、それは恐ろしいハックのように感じる。

ご覧のとおり、何らかの理由でCellTemplateでも同じ問題が発生していません。

完全例

MainWindow.xaml:

<Window x:Class="WpfApplication1.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
     xmlns:local="clr-namespace:WpfApplication1" 
     mc:Ignorable="d" 
     Title="MainWindow" Height="350" Width="525" DataContext="{Binding RelativeSource={RelativeSource self}}"> 
    <Window.Resources> 
     <FrameworkElement x:Key="proxy" DataContext="{Binding}"/> 
    </Window.Resources> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition/> 
      <RowDefinition/> 
     </Grid.RowDefinitions> 
     <ContentControl Visibility="Collapsed" 
      Content="{StaticResource proxy}"/> 
     <DataGrid ItemsSource="{Binding SomeData}" AutoGenerateColumns="False"> 
      <DataGrid.Columns> 
       <DataGridTemplateColumn> 
        <DataGridTemplateColumn.HeaderTemplate> 
         <DataTemplate> 
          <ItemsControl ItemsSource="{Binding DataContext.SomeStrings, Source={StaticResource proxy}}"> 
           <ItemsControl.ItemsPanel> 
            <ItemsPanelTemplate> 
             <StackPanel Orientation="Horizontal"></StackPanel> 
            </ItemsPanelTemplate> 
           </ItemsControl.ItemsPanel> 
           <ItemsControl.ItemTemplate> 
            <DataTemplate> 
             <Border Width="30" Margin="0" Background="Pink"> 
              <TextBlock Text="{Binding}" TextAlignment="Left" VerticalAlignment="Center"> 
               <TextBlock.LayoutTransform> 
                <RotateTransform Angle="270" CenterX="0.5" CenterY="0.5"/> 
               </TextBlock.LayoutTransform> 
              </TextBlock> 
             </Border> 
            </DataTemplate> 
           </ItemsControl.ItemTemplate> 
          </ItemsControl> 
         </DataTemplate> 
        </DataGridTemplateColumn.HeaderTemplate> 
        <DataGridTemplateColumn.HeaderStyle> 
         <Style TargetType="DataGridColumnHeader"> 
          <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
          <Setter Property="VerticalContentAlignment" Value="Stretch" /> 
          <Setter Property="Margin" Value="0" /> 
         </Style> 
        </DataGridTemplateColumn.HeaderStyle> 

        <DataGridTemplateColumn.CellTemplate> 
         <DataTemplate> 
          <ItemsControl ItemsSource="{Binding}"> 
           <ItemsControl.ItemsPanel> 
            <ItemsPanelTemplate> 
             <StackPanel Orientation="Horizontal"></StackPanel> 
            </ItemsPanelTemplate> 
           </ItemsControl.ItemsPanel> 
           <ItemsControl.ItemTemplate> 
            <DataTemplate> 
             <Border Width="30"> 
              <Button> 
               <TextBlock Text="{Binding}"/> 
              </Button> 
             </Border> 
            </DataTemplate> 
           </ItemsControl.ItemTemplate> 
          </ItemsControl> 
         </DataTemplate> 
        </DataGridTemplateColumn.CellTemplate> 
       </DataGridTemplateColumn> 
      </DataGrid.Columns> 
     </DataGrid> 
     <DataGrid ItemsSource="{Binding SomeData}" AutoGenerateColumns="False" Grid.Row="1"> 
      <DataGrid.Columns> 
       <DataGridTemplateColumn> 
        <DataGridTemplateColumn.HeaderTemplate> 
         <DataTemplate> 
          <ItemsControl ItemsSource="{Binding DataContext.SomeStrings, Source={StaticResource proxy}}"> 
           <ItemsControl.ItemsPanel> 
            <ItemsPanelTemplate> 
             <StackPanel Orientation="Horizontal"></StackPanel> 
            </ItemsPanelTemplate> 
           </ItemsControl.ItemsPanel> 
           <ItemsControl.ItemTemplate> 
            <DataTemplate> 
             <Border Width="30" Margin="0"> 
              <Button BorderThickness="0"> 
               <TextBlock Text="{Binding}" TextAlignment="Left"> 
                <TextBlock.LayoutTransform> 
                 <RotateTransform Angle="270" CenterX="0.5" CenterY="0.5"/> 
                </TextBlock.LayoutTransform> 
               </TextBlock> 
              </Button> 
             </Border> 
            </DataTemplate> 
           </ItemsControl.ItemTemplate> 
          </ItemsControl> 
         </DataTemplate> 
        </DataGridTemplateColumn.HeaderTemplate> 
        <DataGridTemplateColumn.HeaderStyle> 
         <Style TargetType="DataGridColumnHeader"> 
          <Setter Property="HorizontalContentAlignment" Value="Stretch" /> 
          <Setter Property="VerticalContentAlignment" Value="Stretch" /> 
          <Setter Property="Margin" Value="0" /> 
         </Style> 
        </DataGridTemplateColumn.HeaderStyle> 

        <DataGridTemplateColumn.CellTemplate> 
         <DataTemplate> 
          <ItemsControl ItemsSource="{Binding}"> 
           <ItemsControl.ItemsPanel> 
            <ItemsPanelTemplate> 
             <StackPanel Orientation="Horizontal"></StackPanel> 
            </ItemsPanelTemplate> 
           </ItemsControl.ItemsPanel> 
           <ItemsControl.ItemTemplate> 
            <DataTemplate> 
             <Border Width="30"> 
              <Button> 
               <TextBlock Text="{Binding}"/> 
              </Button> 
             </Border> 
            </DataTemplate> 
           </ItemsControl.ItemTemplate> 
          </ItemsControl> 
         </DataTemplate> 
        </DataGridTemplateColumn.CellTemplate> 
       </DataGridTemplateColumn> 
      </DataGrid.Columns> 
     </DataGrid> 
    </Grid> 
</Window> 

MainWindow.xaml.cs:

public partial class MainWindow : Window 
{ 
    public string[] SomeStrings { get; set; } = new[] { "Foo", "Bar" }; 

    public List<string[]> SomeData { get; set; } = new List<string[]>() { new[] { "a", "b" }, new[] { "c", "d" } }; 
    public MainWindow() 
    { 
     InitializeComponent(); 
    } 
} 

注:私は、ボタンなし例に背景色を追加し、I彼らは総事故で受け入れられていると確信していません。私は、テキストラベルが一番上(一度回転したものが一番左になる)に揃えられているため、整列しているように見えますが、ボタンを追加するとラベルは中央に移動してもう整列しません。

+0

をボタンには、ラベルとは異なるマージン/パディングを持っているので、それはないですか? – Aybe

+0

@Aybe:表示されるラベルとボタンのサイズは同じです。ボタンのマージンは「0」に設定されているため、そのようには見えません。 –

+0

XAMLツリーをデバッグするために小さなブラックボックスを試しましたか?代わりに、https://snoopwpf.codeplex.com/またはhttp://xamlspy.com/ – Aybe

答えて

1

デフォルトでは、Button.HorizontalContentAligmentCenterであり、Textblocks.HorizontalAlignmentLeftです。だから、あなたがラップしているとき、あなたのことが中心ますが、あなたのTextBlockが左側にレイアウトされますButtonTextBlock ..

あなたがセンターにトップTextBoxes水平方向の配置を設定するだけです、とあなたは同じ外観を取得します。

<Border Width="30" Margin="0" Background="Pink"> 
    <TextBlock Text="{Binding}" TextAlignment="Left" HorizontalAlignment="Center" VerticalAlignment="Center"> 
     <TextBlock.LayoutTransform> 
      <RotateTransform Angle="270" CenterX="0.5" CenterY="0.5"/> 
     </TextBlock.LayoutTransform> 
    </TextBlock> 
</Border> 

enter image description here

は、あなたは彼らが、完全に並んでもNBはそれはいくつかのトリガによっておそらく上書きされる0の原因に設定する(DataGridColumnHeaderPaddingを取り除くしたい場合は?時間を持っていないことがあります現時点で調査する。しかし、あなたは以下に設定した場合:

<Style TargetType="DataGridColumnHeader"> 
    <Setter Property="HorizontalContentAlignment" Value="Center" /> 
    <Setter Property="VerticalContentAlignment" Value="Stretch" /> 
    <Setter Property="Margin" Value="0" /> 
    <Setter Property="Padding" Value="0,1" /> 
</Style> 

あなたが望むの間隔を取得します:

enter image description here

+0

'DataGridColumnHeader'のパディングを設定しました。ありがとう。 –

関連する問題