Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ListView item height in Windows Store app

I have a simple ListView

<ListView ItemsSource="{Binding SelectedSearch.Offers}"
    IsItemClickEnabled="True"
    ItemClick="lv_ItemClick_1"
    Margin="0,0,0,10"
    Name="lv"                          
    SelectionMode="None"
    IsSwipeEnabled="false"
    ItemTemplateSelector="{StaticResource OffersGridTemplateSelector}"/>

And I custom ItemTemplate selector used to choose between two different DataTemplates. The problem is, that each items seems to have something like a minimum height.

If I use a DataTemplate with just a TextBlock

    <DataTemplate x:Key="SpecialTextTemplate">
        <TextBlock Text="{Binding Text}" />
    </DataTemplate>

the item takes too much space verticaly. It seems to take the same minimum space as the other template composed of 3 textblocks in a stackpanel

How do I make it shrink to the height of the content? Is there a minimum height?

like image 728
Igor Kulman Avatar asked Nov 30 '25 20:11

Igor Kulman


2 Answers

recently I also faced the same issue in UWP application. Yes there is default min height defined for the list view item. overriding the same will solve the issue. for me this solution works:

<Style x:Key="NoSpacesListViewItemStyle" TargetType="ListViewItem">
   <Setter Property="MinHeight" Value="YOUR_MIN_HEIGHT" />
</Style>
like image 130
Kiran Paul Avatar answered Dec 02 '25 21:12

Kiran Paul


I have already found rather clear solution for this problem!

<Style x:Key="NoSpacesListViewItemStyle" TargetType="ListViewItem">
    <Setter Property="Margin" Value="0"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ListViewItem">
                <ListViewItemPresenter ContentMargin="0" SelectionCheckMarkVisualEnabled="False" />
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<ListView     IsSwipeEnabled="False"
              ItemContainerStyle="{StaticResource NoSpacesListViewItemStyle}"
              ItemTemplate="{StaticResource SomeTemplate}"
              ItemsSource="{Binding SomeData}"
              SelectionMode="None"/>

Also I can admit that Selection borders will not work in this case. So this method is not appropriate for ListViews with selection.

There is full default ListViewItemStyle with same changes:

<Style x:Key="NoSpacesListViewItemStyle" TargetType="ListViewItem">
    <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
    <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
    <Setter Property="Background" Value="Transparent" />
    <Setter Property="TabNavigation" Value="Local" />
    <Setter Property="IsHoldingEnabled" Value="True" />
    <Setter Property="Margin" Value="0" />
    <Setter Property="HorizontalContentAlignment" Value="Left" />
    <Setter Property="VerticalContentAlignment" Value="Top" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ListViewItem">
                <ListViewItemPresenter HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                       VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                                       CheckBrush="{ThemeResource ListViewItemCheckThemeBrush}"
                                       CheckHintBrush="{ThemeResource ListViewItemCheckHintThemeBrush}"
                                       CheckSelectingBrush="{ThemeResource ListViewItemCheckSelectingThemeBrush}"
                                       ContentMargin="0"
                                       ContentTransitions="{TemplateBinding ContentTransitions}"
                                       DisabledOpacity="{ThemeResource ListViewItemDisabledThemeOpacity}"
                                       DragBackground="{ThemeResource ListViewItemDragBackgroundThemeBrush}"
                                       DragForeground="{ThemeResource ListViewItemDragForegroundThemeBrush}"
                                       DragOpacity="{ThemeResource ListViewItemDragThemeOpacity}"
                                       FocusBorderBrush="{ThemeResource ListViewItemFocusBorderThemeBrush}"
                                       Padding="{TemplateBinding Padding}"
                                       PlaceholderBackground="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}"
                                       PointerOverBackground="{ThemeResource ListViewItemPointerOverBackgroundThemeBrush}"
                                       PointerOverBackgroundMargin="1"
                                       ReorderHintOffset="{ThemeResource ListViewItemReorderHintThemeOffset}"
                                       SelectedBackground="{ThemeResource ListViewItemSelectedBackgroundThemeBrush}"
                                       SelectedBorderThickness="{ThemeResource ListViewItemCompactSelectedBorderThemeThickness}"
                                       SelectedForeground="{ThemeResource ListViewItemSelectedForegroundThemeBrush}"
                                       SelectedPointerOverBackground="{ThemeResource ListViewItemSelectedPointerOverBackgroundThemeBrush}"
                                       SelectedPointerOverBorderBrush="{ThemeResource ListViewItemSelectedPointerOverBorderThemeBrush}"
                                       SelectionCheckMarkVisualEnabled="False" />
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>
like image 32
CatCap Avatar answered Dec 02 '25 19:12

CatCap



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!