Question

我希望水平显示项目列表，并能够从这个项目列表中进行选择 - 我尝试使用listview并在堆栈上的某些帖子中更改项目模板，我有：

<ListView Height="Auto" HorizontalAlignment="Left" Margin="24,0,0,0" Name="MachinesListView" VerticalAlignment="Top" Width="1455" Background="#FFF0F0F0" ItemsSource="{Binding Machines}" BorderBrush="#FFF0F0F0" Grid.ColumnSpan="2" Grid.Row="2" SelectionChanged="MachinesListView_SelectionChanged">
                <ListView.ItemsPanel>
                    <ItemsPanelTemplate>
                        <WrapPanel Width="{Binding (FrameworkElement.ActualWidth), 
                    RelativeSource={RelativeSource AncestorType=ScrollContentPresenter}}"
                    ItemWidth="{Binding (ListView.View).ItemWidth, 
                    RelativeSource={RelativeSource AncestorType=ListView}}"
                    MinWidth="{Binding ItemWidth, RelativeSource={RelativeSource Self}}"
                    ItemHeight="{Binding (ListView.View).ItemHeight, 
                    RelativeSource={RelativeSource AncestorType=ListView}}" />
                    </ItemsPanelTemplate>
                </ListView.ItemsPanel>
                <ListView.ItemContainerStyle>
                    <Style TargetType="{x:Type ListViewItem}">
                        <Setter Property="Height" Value="175"/>
                        <Setter Property="Width" Value="275"/>
                        <Setter Property="Margin" Value="5,5,0,0"/>
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate>
                                    <Border BorderBrush="Gray" BorderThickness="2" CornerRadius="10">
                                        <StackPanel Orientation="Vertical">
                                            <TextBlock Text="{Binding Machine.MachineId}" TextAlignment="Center" Width="Auto" Foreground="#FF639A70" FontSize="19"/>
                                            <TextBlock Text="{Binding Machine.Name}" TextAlignment="Center" Width="Auto" Foreground="Gray" FontSize="15" />
                                            <Image Source="/URM;component/Images/slot_machine-512.png" Height="60" Width="60" />
                                            <TextBlock Text="{Binding Machine.Description}" TextAlignment="Center" Width="Auto" Foreground="Gray" FontSize="15" Margin="0, 5, 0, 0"/>
                                            <TextBlock TextAlignment="Center" Width="Auto" Foreground="Gray" FontSize="15" Margin="0, 5, 0, 0">
                                                <Run Text ="Actual: "/>
                                                <Run Text ="{Binding Actual, StringFormat=' {0:c}'}"/>
                                            </TextBlock>
                                            <TextBlock TextAlignment="Center" Width="Auto" Foreground="Gray" FontSize="15" Margin="0, 5, 0, 0">
                                                <Run Text ="OverShort: "/>
                                                <Run Text ="{Binding OverShort, StringFormat=' {0:c}'}"/>
                                            </TextBlock>
                                        </StackPanel>
                                    </Border>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                </ListView.ItemContainerStyle>
            </ListView>

这很有效......我从中得到了我想要的整体外观和感觉，但只选择第一项会导致选择的事件触发......

我考虑过将项目作为按钮来实现，但我认为可能有更合适的方法来解决这个问题。

Answer 1

在ControlTemplate的最外边框设置Background为Transparent。

<Border BorderBrush="Gray" Background="Transparent"
        BorderThickness="2" CornerRadius="10">

默认情况下，{x:Null}对鼠标事件无响应。

只有在您点击图片时才会看到该项目被选中或模板中存在的任何控件，但是当您单击空白区域时在边界内，selectionChange事件不会自动触发对鼠标事件没有反应（特别是在你的情况下MouseClick）。 将背景设置为透明将使其响应所有鼠标事件。

有关详细信息，请参阅此处 - {x:Null} Vs. Transparent。

如何使用包装面板作为列表视图的项目面板进行选择

1 个答案: