負の高さのマージン値を使用してコントロールを垂直方向に正しく配置する

Question

グリッドベースのXAMLページを作成しました。グリッドでは、上端余白、垂直、値を必要としない画像を表示します。私のページでは、テキストブロックに2つのラベルがあります。これらのラベルは、グリッドスタックパネルに適切に配置されず、テキストブロック内の上余白の値が負になります。私はMargin = "0、-35,0,0"を使用しなければならない最初のラベルのテキストブロックと2番目に余白= "0、-650、0、0を使用する必要があります。XAMLは助けてください。

<Window 
 
    x:Class="MasterPage.ApplicationInfoWindow" 
 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
 
    xmlns:v="clr-namespace:MasterPage" 
 
    Title="Intake 4" Height="900" Width="1000" Background="#FFD9DDE8"> 
 
    <DockPanel> 
 
     <Grid> 
 
      <Grid.RowDefinitions> 
 
       <RowDefinition Height="*"/> 
 
       <RowDefinition Height="*"/> 
 
       <RowDefinition Height="*"/> 
 
      </Grid.RowDefinitions> 
 
      <Grid.ColumnDefinitions> 
 
       <ColumnDefinition Width="*"/> 
 
       <ColumnDefinition Width="*"/> 
 

 
      </Grid.ColumnDefinitions> 
 
     </Grid> 
 
     <StackPanel > 
 
       <Border Margin="0, 0, 0, 0" BorderBrush="Black" BorderThickness="1"> 
 
       <StackPanel Height="133" VerticalAlignment="Top" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2"> 
 

 
        <StackPanel> 
 
         <Image Source="Images\header.jpg" Stretch="Fill" DockPanel.Dock="Top" Height="47" /> 
 
        </StackPanel> 
 

 
        <StackPanel Margin="3,0,0,5" HorizontalAlignment="Left"> 
 
         <Image Source="Images\DSPASS_logo.png" Width="324" Stretch="Fill" DockPanel.Dock="Top" Height="80" /> 
 
        </StackPanel> 
 
        <StackPanel DockPanel.Dock="Top" HorizontalAlignment="Right" > 
 
         <TextBlock FontSize="15" TextWrapping="WrapWithOverflow" Height="25" Margin="0,-35,0,0" > 
 
       <Label FontSize="10" HorizontalContentAlignment="Right" HorizontalAlignment="Right" Name="Namelabel" Width="230" FontWeight="Bold" Foreground="#1664A1" Content="Name"/> 
 
         </TextBlock> 
 
        </StackPanel> 
 
     </StackPanel> 
 

 
     </Border> 
 

 
     <Border Margin="0, 0, 0, 0" BorderBrush="Black" BorderThickness="1"> 
 

 
       <StackPanel Background="wHITE" Height="358" VerticalAlignment="Top" Grid.Column="0" Grid.ColumnSpan="2" Grid.Row="1"> 
 
        <StackPanel> 
 
        <Image Source="Images\silhouette.jpg" VerticalAlignment="Top" HorizontalAlignment="Left" Width="320" Stretch="Fill" DockPanel.Dock="Top" Height="360" /> 
 
       </StackPanel> 
 
        <StackPanel VerticalAlignment="Top" > 
 
         <TextBlock FontSize="15" HorizontalAlignment="Right" Height="75" Margin="0, -650, 0, 0" TextWrapping="WrapWithOverflow" > 
 
       <Label FontSize="35" HorizontalContentAlignment="Left" Name="Namelabel2" Width="640" FontWeight="Bold" Foreground="#1664A1" Content="Name"/> 
 
        </TextBlock> 
 
       </StackPanel> 
 
        </StackPanel> 
 
     </Border> 
 
     </StackPanel> 
 

 

 
    </DockPanel> 
 
</Window>

Answer 1

あなたのコードと2つの問題があります。

1）DockPanelを使用するときは、ビジュアルツリーを破ることはできませんが、あなたがドッキングしているコントロールを意味の直接の子でなければなりませんDockPanel。例：

<DockPanel> 
    <Image DockPanel.Dock="Left" ... /> 
    <Label DockPanel.Dock="Right" .../> 
</DockPanel> 

これ以外の場合、DockPanelは表示/ドッキングできなくなります。同じことが、グリッドと子の列/行の設定にも適用されます。

2）コンテナ内のすべてのコントロールをラップしています。これが必要でないときは、Visual Treeを に汚染します。この場合、作成しようとしている接続が切断されます。

は、リファクタリングした後、負のマージンは、もはや必要ではない：

<Window 
    x:Class="MasterPage.ApplicationInfoWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:v="clr-namespace:MasterPage" 
    Title="Intake 4" Height="900" Width="1000" Background="#FFD9DDE8"> 
    <StackPanel> 
     <Border Margin="0, 0, 0, 0" BorderBrush="Black" BorderThickness="1"> 
      <StackPanel Height="133" VerticalAlignment="Top"> 
       <Image Source="Images\header.jpg" Stretch="Fill" Height="47" /> 
       <DockPanel Margin="3,0,0,5"> 
        <Image DockPanel.Dock="Left" Source="Images\DSPASS_logo.png" Width="324" Stretch="Fill" Height="80" /> 
        <Label DockPanel.Dock="Right" FontSize="10" HorizontalContentAlignment="Right" HorizontalAlignment="Right" VerticalAlignment="Bottom" Name="Namelabel" Width="230" FontWeight="Bold" Foreground="#1664A1" Content="Name"/> 
       </DockPanel> 
      </StackPanel> 
     </Border>  
     <Border Margin="0, 0, 0, 0" BorderBrush="Black" BorderThickness="1"> 
      <DockPanel Background="White" Height="358" VerticalAlignment="Top"> 
       <Image DockPanel.Dock="Left" Source="Images\silhouette.jpg" VerticalAlignment="Top" HorizontalAlignment="Left" Width="320" Stretch="Fill" Height="360" /> 
       <Label DockPanel.Dock="Right" FontSize="35" HorizontalContentAlignment="Left" Name="Namelabel2" Width="640" FontWeight="Bold" Foreground="#1664A1" Content="Name"/> 
      </DockPanel> 
     </Border> 
    </StackPanel> 
</Window> 

Answer 2

私は位置コントロールに私のXmaIで負のマージン値を使用していた私の記事で述べたように。ネストされたグリッドを含むStackPanelsでグリッドを正しく使用できないようにするには、適切な垂直方向の配置が可能です。ここで、次の技術の水平配向利用の世話をするために

はこれを処理します：

<StackPanel Orientation=Vertical /> 
    <StackPanel Orientation=Horizontal /> 
     content..... 
    </StackPanel> 
</StackPanel>