테두리 안쪽에 여러 개의 정렬이 있습니다.

Question

아래 코드는 xaml입니다. 이미지와 오른쪽에 textblock을 정렬하려고합니다. 첫 번째 textblock이 올바르게 표시되고 있으며, 오른쪽 끝에있는 image 및 두 번째 textblock ~ dock이 필요합니다. 이 문제를 어떻게 올바르게 해결할 수 있습니까?

<Border Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" BorderThickness="0" Padding="16,2" 
     BorderBrush="Transparent" Background="{StaticResource AccentBrush}"> 
    <DockPanel LastChildFill="True">     
      <ItemsControl ItemsSource="{Binding Lists}"> 
       <ItemsControl.ItemTemplate> 
        <DataTemplate> 
         <TextBlock Margin="0,5" FontSize="24" FontFamily="Sageo UI Light" TextAlignment="Left" TextWrapping="NoWrap" 
          TextTrimming="WordEllipsis" Foreground="{StaticResource MainBrush}" HorizontalAlignment="Stretch" Text="{Binding Title}" /> 
        </DataTemplate> 
       </ItemsControl.ItemTemplate> 
      </ItemsControl> 
      <StackPanel Orientation="Horizontal" > 
      <Image HorizontalAlignment="Right" Source="/Images/image.png"/> 
      <TextBlock DockPanel.Dock="Right" Margin="16,0,0,0" Text="{Binding ElementName=TreeView, Path=SelectedItem.Name, StringFormat='Name: {0}'}" 
        FontFamily="Segoe UI Light" FontSize="14" TextAlignment="Right" TextWrapping="NoWrap" TextTrimming="WordEllipsis" 
        Foreground="{StaticResource MainBrush}" HorizontalAlignment="Stretch" VerticalAlignment="Center" />    
     </StackPanel>     
    </DockPanel> 
</Border> 

Answer 1

StackPanel의 내부 크기는 Orientation 방향 무제한이며 항상 왼쪽 상단 /에서 항목을 스택. 이 두 속성의 조합은 StackPanel을 사용하여 찾고있는 올바른 정렬을 얻을 수 없음을 의미합니다. 대신 다른 DockPanel을 사용할 수도 있고, 바깥쪽에 직접 모든 것을 넣을 수도 있습니다. DockPanel. 귀하의 코드에서 올바른 도킹 된 항목을 원하는 순서로 말할 수는 없지만 적어도 시작해야합니다.

<Border Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" BorderThickness="0" Padding="16,2" 
     BorderBrush="Transparent" Background="{StaticResource AccentBrush}"> 
    <DockPanel LastChildFill="False">     
      <ItemsControl ItemsSource="{Binding Lists}"> 
       <ItemsControl.ItemTemplate> 
        <DataTemplate> 
         <TextBlock Margin="0,5" FontSize="24" FontFamily="Sageo UI Light" TextAlignment="Left" TextWrapping="NoWrap" 
          TextTrimming="WordEllipsis" Foreground="{StaticResource MainBrush}" HorizontalAlignment="Stretch" Text="{Binding Title}" /> 
        </DataTemplate> 
       </ItemsControl.ItemTemplate> 
      </ItemsControl> 
      <DockPanel DockPanel.Dock="Right"> 
      <Image Source="/Images/image.png"/> 
      <TextBlock Margin="16,0,0,0" Text="{Binding ElementName=TreeView, Path=SelectedItem.Name, StringFormat='Name: {0}'}" 
        FontFamily="Segoe UI Light" FontSize="14" TextAlignment="Right" TextWrapping="NoWrap" TextTrimming="WordEllipsis" 
        Foreground="{StaticResource MainBrush}" HorizontalAlignment="Stretch" VerticalAlignment="Center" />    
     </DockPanel>     
    </DockPanel> 
</Border>