如何在 StackPanel 中垂直和水平显示 TextBlock？答案

【问题标题】：How to display in a StackPanel the TextBlock vertically and horizontally?如何在 StackPanel 中垂直和水平显示 TextBlock？
【发布时间】：2015-01-22 18:32:55
【问题描述】：

我有一个包含一些元素的 ListView。对于每个项目，我都会插入一个图像、对象的名称和其中一个属性。

我设置了堆栈面板的水平方向。

左边是图片，右边是对象的名字。

然后我想在名称下显示属性，始终显示在图像的右侧。如果 StackPanel 我水平设置，我该怎么做？

 <StackPanel Orientation="Horizontal">
     <Image Source="Assets/rsz_1rsz_museumiclip.jpg"/>
     <TextBlock Text=""/>
     <TextBlock Text="{Binding Path=NomeMuseo}" FontSize="26"/>
     <TextBlock Text="{Binding Path=Paese}"/>//THIS IS
 </StackPanel>

【问题讨论】：

你能在 WP8 中使用 DockPanel 吗？
DockPanel 仅 W8，不是 WP8
将它们嵌入另一个堆栈面板或仅使用网格。
您可以在另一个垂直方向的 StackPanel 中找到您的两个属性

标签： c# xaml windows-phone-8

【解决方案1】：

由于DockPanel 不是一个选项，我只会使用Grid。它会让你精确控制这种布局：

<Grid>
   <Grid.RowDefinitions>
      <RowDefinition Width="Auto"/>
      <RowDefinition Width="Auto"/>
   </Grid.RowDefinitions>
   <Grid.ColumnDefinitions>
      <ColumnDefinition Height="Auto"/>
      <ColumnDefinition Height="20"/>
   </Grid.ColumnDefinitions>
     <Image Source="Assets/rsz_1rsz_museumiclip.jpg"/>
     <TextBlock Text=""/>
     <TextBlock Text="{Binding Path=NomeMuseo}" FontSize="26" Grid.Row="0" Grid.Column="1"/>
     <TextBlock Text="{Binding Path=Paese}" Grid.Row="1" Grid.Column="1"/>
</Grid>

或者，您可以按照 ChrisW 的建议使用两个 StackPanels。它更容易设置，但您会失去一些控制。

<StackPanel Orientation="Horizontal">
   <Image Source="Assets/rsz_1rsz_museumiclip.jpg"/>
   <StackPanel>
       <TextBlock Text="{Binding Path=NomeMuseo}" FontSize="26"/>
       <TextBlock Text="{Binding Path=Paese}"/>
   </StackPanel>
</StackPanel>

【讨论】：

或<StackPanel Orientation="Horizontal"><Image/><StackPanel><TextBlock/><TextBlock/></StackPanel></StackPanel>