WPF ListView 项目控件对齐方式

Question

我是 WPF 的新手，我正在创建一个如下图所示的 ListView：

我的问题是我希望每个项目的图像（蓝色床 img）像 TextBlock 一样从项目的开头开始，但要保持层次结构相同（图像在顶部，文本在底部）

这是我的 XAML:

<Window x:Class="MenuPick.Windows.Views.Wards"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MenuPick" Height="720" Width="1200"
        Loaded="Window_Loaded">

    <Window.Resources>
        <Style x:Key="FileItemStyle" TargetType="{x:Type ListViewItem}">
            <Setter Property="Margin" Value="5,5,5,5"/>
            <Setter Property="Padding" Value="0,0,0,0"/>
            <Setter Property="HorizontalAlignment" Value="Left"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate  TargetType="{x:Type ListViewItem}">
                        <Grid HorizontalAlignment="Left" VerticalAlignment="Top" Height="207" >
                            <Border x:Name="border" BorderBrush="{x:Null}" BorderThickness="1" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" CornerRadius="2.5"/>
                            <StackPanel HorizontalAlignment="Stretch"  VerticalAlignment="Stretch">
                                <ContentPresenter/>
                            </StackPanel>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="207*"/>
            <RowDefinition Height="129*"/>
        </Grid.RowDefinitions>

        <ListView x:Name="lvWards" HorizontalAlignment="Left" Height="608" Margin="0,72,0,0" VerticalAlignment="Top" Width="1185" Grid.RowSpan="2"
                  ItemsSource="{Binding}" ScrollViewer.HorizontalScrollBarVisibility="Disabled"
              SelectedItem="{Binding SelectedComputer, RelativeSource={RelativeSource AncestorType=Window}}"
              ItemContainerStyle="{StaticResource FileItemStyle}">
                <ListView.ItemsPanel>
                    <ItemsPanelTemplate>
                        <WrapPanel/>
                    </ItemsPanelTemplate>
                </ListView.ItemsPanel>

                <ListView.ItemTemplate>
                    <DataTemplate>
                        <DockPanel>
                        <Image DockPanel.Dock="TOP" Source="..\Resources\Images\icon-ward.png" Width="55" Height="36" />
                        <TextBlock  DockPanel.Dock="Bottom"  Text="{Binding Name}" Background="Green" Width="155" Height="180"/>

                    </DockPanel>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>

    </Grid>
</Window>

Answer 1

我不知道你为什么要使用 DockPanel，但正常的 Grid 应该可以：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Width="Auto"/ >
        <RowDefinition/ >
    </Grid.RowDefinitions>
    <Image HorizontalAlignment="Left" ... />
    <TextBlock Grid.Row="1" .../>
</Grid>

您可以像现在一样尝试将 HorizontalAlignment="Left"（对于 Image）与 DockPanel 一起使用，结果不确定，也许您必须在内部托管 Image顶部停靠 Grid 以使其工作。

WPF ListView 项目控件对齐方式

WPF ListView item controls alignemnt

c#

wpf

listview

wpf-controls