减少Xaml中Listview的上下空间(UWP-通用windows平台) [英] Reduce the bottom and top space in Listview in Xaml(UWP-Universal windows platform)

问题描述

我正在开发适用于 windows-10 的通用 windows 平台应用程序.我有关于列表视图的问题.当我单击并悬停在列表视图项上时，所选区域背景很大.你可以在我的图片中看到.

I am working on the universal windows platform app for windows- 10.I have issue regarding the listview.When i click and hover on the listview item the selected area background is large. You can see in my image.

代码:

<ListView  Height="160" Name="lstconfig_option" BorderThickness="0"   BorderBrush="#FFB0B7BE" ItemClick="lstconfig_option_ItemClick" IsItemClickEnabled="True"   HorizontalAlignment="Stretch">
                                    <ListView.ItemsPanel>
                                        <ItemsPanelTemplate>
                                            <WrapGrid Orientation="Horizontal" MaximumRowsOrColumns="10"/>
                                        </ItemsPanelTemplate>
                                    </ListView.ItemsPanel>
                                    <ListView.ItemContainerStyle>
                                        <Style TargetType="ListViewItem">
                                            <Setter Property="HorizontalContentAlignment" Value="Left" />
                                            <Setter Property="VerticalContentAlignment" Value="Center" />
                                            <Setter Property="Margin" Value="0,0,0,0" />
                                            <Setter Property="Padding" Value="0,0,0,-6" />
                                            <Setter Property="Template">
                                                <Setter.Value>
                                                    <ControlTemplate TargetType="ListViewItem">
                                                        <ListViewItemPresenter          
                                  PointerOverBackground="{ThemeResource SystemControlHighlightListLowBrush}"       
                                  SelectedBackground="{ThemeResource SystemControlHighlightListMediumBrush}"      
                                  SelectedPointerOverBackground="{ThemeResource SystemControlHighlightListMediumBrush}"
                                 PressedBackground="{ThemeResource SystemControlHighlightListMediumBrush}"
                                 SelectedPressedBackground="{ThemeResource SystemControlHighlightListMediumBrush}" />
                                                    </ControlTemplate>
                                                </Setter.Value>
                                            </Setter>


                                        </Style>
                                    </ListView.ItemContainerStyle>

                                    <ListView.ItemTemplate>
                                        <DataTemplate >
                                            <StackPanel Grid.Row="1" Height="auto" HorizontalAlignment="Stretch" PointerEntered="btnFilter_PointerEntered" PointerExited="btnFilter_PointerExited" ToolTipService.ToolTip="{Binding tooltip_text}" ToolTipService.Placement="Bottom">
                                                <Grid Height="auto">
                                                    <Grid.ColumnDefinitions>
                                                        <ColumnDefinition Width="*"></ColumnDefinition>
                                                        <ColumnDefinition Width="auto"></ColumnDefinition>
                                                    </Grid.ColumnDefinitions>

                                                    <StackPanel Grid.Column="0" Grid.ColumnSpan="2"  Width="200" VerticalAlignment="Top" HorizontalAlignment="Left">
                                                        <TextBlock Name="common_label" Text="{Binding label}" Visibility="{Binding label_Visibility}" FontSize="11"  Foreground="#FF0D0C0C" Margin="10,0,0,0"  VerticalAlignment="Center"  Grid.ColumnSpan="2"  SelectionHighlightColor="#FFD44C21" />
                                                        <TextBox Name="textbox"  Visibility="{Binding Visibility}" FontSize="11"  Foreground="#FF0D0C0C"  TextWrapping="NoWrap"  VerticalAlignment="Center" Margin="10,0,0,0" Grid.ColumnSpan="2" BorderBrush="Black" Background="#FFF6F6F6" HorizontalAlignment="Stretch" SelectionHighlightColor="#FFD44C21"/>
                                                    </StackPanel>

                                                </Grid>
                                            </StackPanel>
                                        </DataTemplate>
                                    </ListView.ItemTemplate>
                                </ListView>

图片

推荐答案

ListViewItem 默认有 MinWidth 和 MinHeight.通过检查 ListViewItem 样式和模板，我们可以找到MinWidth 和 MinHeight 属性指定如下.

ListViewItem has a MinWidth and MinHeight by default. By checking ListViewItem styles and templates, we can find the MinWidth and MinHeight properties are specified as following.

<Setter Property="MinWidth" Value="{ThemeResource ListViewItemMinWidth}"/>
<Setter Property="MinHeight" Value="{ThemeResource ListViewItemMinHeight}"/>

<x:Double x:Key="ListViewItemMinWidth">88</x:Double>
<x:Double x:Key="ListViewItemMinHeight">44</x:Double>

为了减少差距，您可以将 MinHeight 设置为您想要的值:

To reduce the gap, you can set the MinHeight to the value you want like:

<ListView.ItemContainerStyle>
    <Style TargetType="ListViewItem">
        <Setter Property="HorizontalContentAlignment" Value="Left" />
        <Setter Property="VerticalContentAlignment" Value="Center" />
        <Setter Property="Margin" Value="0,0,0,0" />
        <Setter Property="Padding" Value="0,0,0,-6" />
        <Setter Property="MinHeight" Value="20" />
        ...
    </Style>
</ListView.ItemContainerStyle>

这篇关于减少Xaml中Listview的上下空间(UWP-通用windows平台)的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！