C# 左边是图像，右边是数据——如何为其创建布局？

我在wpf应用程序中有一个网格。我想把一个图像放在左边和旁边，在右边，在同一行，一些多行文字/信息。因此，在每一行中：

=====================================
Image1    field1: data1
          field2: data1
          field3: data1
          field4: data1
          field5: data1
          field6: data1
=====================================
Image2    field1: data2
          field2: data2
          field3: data2
          field4: data2
          field5: data2
          field6: data2
=====================================

当然，图像的高度应该与右侧所有字段的高度大致相同

---

我该怎么做？也就是说，布局本身。我有点搞不清楚所有能实现这一目标的方法。似乎有很多。你可以使用网格。。。三列六行。然后在第一列上使用行范围。差不多

        <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="50"/>
            <ColumnDefinition Width="50"/>
            <ColumnDefinition Width="50"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>

        <Image Grid.RowSpan="6"/>

        <Label Grid.Row="0" Grid.Column="1"/>
        <Label Grid.Row="1" Grid.Column="1"/>
        <Label Grid.Row="2" Grid.Column="1"/>
        <Label Grid.Row="3" Grid.Column="1"/>
        <Label Grid.Row="4" Grid.Column="1"/>
        <Label Grid.Row="5" Grid.Column="1"/>

        <Label Grid.Row="0" Grid.Column="2"/>
        <Label Grid.Row="1" Grid.Column="2"/>
        <Label Grid.Row="2" Grid.Column="2"/>
        <Label Grid.Row="3" Grid.Column="2"/>
        <Label Grid.Row="4" Grid.Column="2"/>
        <Label Grid.Row="5" Grid.Column="2"/>
    </Grid>

---

您可以使用带有stackpanel的网格来保存字段，下面是一个示例：

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="5*"/>
        <ColumnDefinition Width="5*"/>
    </Grid.ColumnDefinitions>

    <Grid.RowDefinitions>
        <RowDefinition Height="5*"/>
        <RowDefinition Height="5*"/>
    </Grid.RowDefinitions>

    <Image x:Name="leftTopImage"
           Grid.Column="0"
           Grid.Row="0"/>

    <Image x:Name="leftBottomImage"
           Grid.Column="0"
           Grid.Row="1"/>

    <StackPanel Grid.Column="1"
                Grid.Row="0">
        <TextBlock Text="field1Top"/>
        <TextBlock Text="field2Top"/>
        <TextBlock Text="field3Top"/>
        <TextBlock Text="field4Top"/>
        <TextBlock Text="field5Top"/>
    </StackPanel>

    <StackPanel Grid.Column="1"
                Grid.Row="1">
        <TextBlock Text="field1Bottom"/>
        <TextBlock Text="field2Bottom"/>
        <TextBlock Text="field3Bottom"/>
        <TextBlock Text="field4Bottom"/>
        <TextBlock Text="field5Bottom"/>
    </StackPanel>
</Grid>

---

将此代码放在您的设计中，看看它是否符合您的期望。

使用WPF，您可以考虑所有可以使用的整洁布局工具，然后使用网格。谢谢。当它大于窗体时，如何使网格具有垂直滚动条？ScrollViewer.VerticalScrollBarVisibility=“Visible”没有帮助实际上，垂直滚动条会自动显示，但您可以通过使用ScrollViewer包围网格来手动添加//yourGrid@AlanCoromano我不这么认为，它使标签和字段保持对齐。我认为这取决于用户偏好。