litaoshen
litaoshen

Reputation: 1862

How to remove the placeholder for listview when try to hide selecteditem in UWP?

I'm trying to implement Undo function for my UWP app that has a listview that can be swiped to take action (like left swipe remove, right swipe archive). My xaml summary for the swipe listview is like this

<controls:SwipeListView.ItemTemplate>
    <DataTemplate>
        <Grid Visibility="{Binding HideForUndo, Converter={StaticResource BooleanNegationToVisibilityConverter}}">
            SomeContents here...
        </Grid>
    </DataTemplate>
</controls:SwipeListView.ItemTemplate>

And the container style is like this

<controls:SwipeListView.ItemContainerStyle>
    <Style TargetType="controls:SwipeListViewItem">
        <Setter Property="TabNavigation" Value="Local"/>
        <Setter Property="IsHoldingEnabled" Value="True"/>
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="VerticalContentAlignment" Value="Top"/>
        <Setter Property="Padding" Value="0,0,0,0"/>
        <Setter Property="MinHeight" Value="0"/>
    </Style>
</controls:SwipeListView.ItemContainerStyle>

The problem is that after I hide the selected item, there will be some space between the items above and below the selected item. Only when the Undo timer expired and removed the selected item can the space be gone. I can see that the selected item has collapsed and the item below it did move up, but there is just some space.

I found a question that is similar to mine: How do you hide a ListView Item placeholder when it's DataTemplate child is collapsed? However it seems doesn't work for me even if I set MinHeight and Padding to 0.


Edit: After testing, I found that this is not related to ListView but to the SwipeListView.
enter image description here

The SwipeListView added many other controls to it, only the highlighted part will be set to collapsed, other parts still visible.

Upvotes: 0

Views: 501

Answers (1)

Jay Zuo
Jay Zuo

Reputation: 15758

I don't know the details about how you implement the "HideForUndo" function. But if you can get the selected item, I think you can try with ItemsControl.ContainerFromItem method to get the item container which in SwipeListView is the SwipeListViewItem. After having the SwipeListViewItem, you can set SwipeListViewItem.Visibility to Visibility.Collapsed to hide the whole item.

From the source code of SwipeListView class, we can find it is derived from ListView class and ListView inherits from ItemsControl, so we can use ItemsControl.ContainerFromItem method with SwipeListView.

Here using the Demo in SwipeListView for example:

private void SwipeListView_ItemSwipe(object sender, ItemSwipeEventArgs e)
{
    var item = e.SwipedItem as EmailObject;
    if (item != null)
    {
        if (e.Direction == SwipeListDirection.Left)
        {
            item.Unread = !item.Unread;
        }
        else
        {
            //(Resources["Emails"] as EmailCollection).Remove(item);
            var swipeListView = sender as SwipeListView;
            var itemContainer = swipeListView?.ContainerFromItem(item) as SwipeListViewItem;
            if (itemContainer != null)
            {
                itemContainer.Visibility = Visibility.Collapsed;
            }
        }
    }
}

In the demo, it originally remove the item form items source. I comment out its code and hide the SwipeListViewItem instead.

Upvotes: 1

Related Questions