ListView 搞乱了 DataTemplates 的 UI

Question

我正在将我的 WP8.1 应用程序移植到 UWP，我发现新的通用 ListView 喜欢通过添加一些额外的元素和逻辑（比如一些背景颜色，当鼠标覆盖了一个项目）。

假设我有一个像这样的非常简单的模板：

<DataTemplate x:Key="IconsTemplate">
    <Grid Width="40"
          Height="40">
        <Image Source="{Binding IconImage}"/>
    </Grid>
</DataTemplate>

还有这个 ListView：

<ListView ItemTemplate="{StaticResource IconsTemplate}"
          ItemsSource="{x:Bind ViewModel.Source, Mode=OneWay}"
          CanReorderItems="False">
    <ListView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid Orientation="Horizontal"/>
        </ItemsPanelTemplate>
    </ListView.ItemsPanel>
</ListView>

我希望得到一个简单的包装网格，就像在 WP8.1 上一样，其中包含我的 40*40 项目，其中包含图像。相反，我得到这个：

每个项目都是矩形而不是正方形（我的意思是，那些显然不是我的 40*40 模板），而且我的背景颜色也有自动逻辑模板。

我不想要这些，我希望我的模板完全按原样显示，我想能够为指针事件手动设置我的逻辑。

我尝试查看默认的 ListView 模板，但没有发现任何有用的东西，是否有我遗漏的参数，或者是否有办法让 ListView 像以前一样显示普通项目在 WP8.1 中做什么？

Answer 1

我通过为 ListViewItems 使用自定义样式设法解决了这个问题。这是我使用的样式：

<Style TargetType="ListViewItem" x:Key="CustomListViewItemExpanded">
    <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
    <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="Foreground" Value="Transparent" />
    <Setter Property="TabNavigation" Value="Local"/>
    <Setter Property="IsHoldingEnabled" Value="True"/>
    <Setter Property="Padding" Value="0"/>
    <Setter Property="Margin" Value="0"/>
    <Setter Property="HorizontalAlignment" Value="Stretch"/>
    <Setter Property="VerticalAlignment" Value="Stretch"/>
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    <Setter Property="VerticalContentAlignment" Value="Stretch"/>
    <Setter Property="MinWidth" Value="0"/>
    <Setter Property="MinHeight" Value="0"/>
    <Setter Property="UseSystemFocusVisuals" Value="True" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ListViewItem">
                <Grid x:Name="ContentBorder"
                        BorderThickness="0">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal">
                                <Storyboard>
                                    <PointerUpThemeAnimation Storyboard.TargetName="ContentPresenter" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="PointerOver">
                                <Storyboard>
                                    <PointerUpThemeAnimation Storyboard.TargetName="ContentPresenter" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Pressed">
                                <Storyboard>
                                    <PointerDownThemeAnimation TargetName="ContentPresenter" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Selected">
                                <Storyboard>
                                    <PointerUpThemeAnimation Storyboard.TargetName="ContentPresenter" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="PointerOverSelected">
                                <Storyboard>
                                    <PointerUpThemeAnimation Storyboard.TargetName="ContentPresenter" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="PressedSelected">
                                <Storyboard>
                                    <PointerDownThemeAnimation TargetName="ContentPresenter" />
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="DisabledStates">
                            <VisualState x:Name="Enabled"/>
                            <VisualState x:Name="Disabled"/>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="MultiSelectStates">
                            <VisualState x:Name="MultiSelectDisabled"/>
                            <VisualState x:Name="MultiSelectEnabled"/>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="DataVirtualizationStates">
                            <VisualState x:Name="DataAvailable"/>
                            <VisualState x:Name="DataPlaceholder"/>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="ReorderHintStates">
                            <VisualState x:Name="NoReorderHint"/>
                            <VisualState x:Name="BottomReorderHint"/>
                            <VisualState x:Name="TopReorderHint"/>
                            <VisualState x:Name="RightReorderHint"/>
                            <VisualState x:Name="LeftReorderHint"/>
                            <VisualStateGroup.Transitions>
                                <VisualTransition To="NoReorderHint" GeneratedDuration="0:0:0.2"/>
                            </VisualStateGroup.Transitions>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="DragStates">
                            <VisualState x:Name="NotDragging" />
                            <VisualState x:Name="Dragging"/>
                            <VisualState x:Name="DraggingTarget"/>
                            <VisualState x:Name="MultipleDraggingPrimary"/>
                            <VisualState x:Name="MultipleDraggingSecondary"/>
                            <VisualState x:Name="DraggedPlaceholder"/>
                                <VisualStateGroup.Transitions>
                                <VisualTransition To="NotDragging" GeneratedDuration="0:0:0.2"/>
                            </VisualStateGroup.Transitions>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <ContentPresenter x:Name="ContentPresenter"
                                        ContentTransitions="{TemplateBinding ContentTransitions}"
                                        ContentTemplate="{TemplateBinding ContentTemplate}"
                                        Content="{TemplateBinding Content}"
                                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                        Margin="{TemplateBinding Padding}"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

这将禁用所有 VisualStates，它将删除模板中存在的所有不必要的控件，并允许每个项目以其原始大小呈现。

ListView 搞乱了 DataTemplates 的 UI

ListView messing up the UI of DataTemplates

c#

xaml

win-universal-app

windows-10

uwp