Search code examples
c#wpfxamluwpwindows-10-mobile

ExpanderView is expanded after page navigation

I'm using a port of the WPF ExpanderView (ExpanderRT) in my UWP app to show expandable headers with items. This works fine when the app is launched for the first time and MainPage is initialized. However if I navigate to a new page and then go back to MainPage the ExpanderView looks like expanded, but not it's not showing the items. It should look the same as it was when MainPage was first initialized. I captured a GIF to show the behaviour.

This is the XAML of the UserControl on the MainPage;

<ListView x:Name="CategoriesListView" ScrollViewer.VerticalScrollBarVisibility="Hidden">
<ListView.ItemContainerStyle>
    <Style TargetType="ListViewItem">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ListViewItem">
                    <ListViewItemPresenter ContentMargin="0" />
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</ListView.ItemContainerStyle>
<ListView.ItemsPanel>
    <ItemsPanelTemplate>
        <StackPanel/>
    </ItemsPanelTemplate>
</ListView.ItemsPanel>
<ListView.ItemTemplate>
    <DataTemplate x:DataType="models:Category">
        <expander:ExpanderControl
            x:Name="expander_Main"
            ItemsSource="{x:Bind childItems}"
            Expanded="Expanded" />
    </DataTemplate>
</ListView.ItemTemplate>

This is the EventHandler which I use for navigation;

    private void OnSettingsButtonChecked(object sender, RoutedEventArgs e)
    {
        ShellSplitView.IsPaneOpen = false;
        ViewModel.NavigationService.Navigate(typeof(SettingsPage));
    }

If anyone of you knows why the ExpanderView has such a weird behavior, please give me a hint - I can provide more of my code if you need.

Capture

[UPDATE]

I noticed that this behavior only occurs, when I run the app on a mobile device (Smartphone or Mobile Windows 10 Emulator). If I execute the app on the local machine the ExpanderView works fine. When I use the back button for navigating back to MainPage it works as expected - I don't have a clue how to fix this, it's really weird.

Capture on Desktop

Solution

  • After debugging the whole code of the ExpanderRT control I was able to solve the problem! It's caused by a bug of the original Expander control which was ported over to WinRT

    I found out, that the height of _itemsCanvas in the class ExpanderControl.cs is set via this method:

    private void OnPresenterSizeChanged(object sender, SizeChangedEventArgs e)
{
    if (null != _itemsCanvas && null != _presenter && IsExpanded)
    {
        _itemsCanvas.Height = _presenter.DesiredSize.Height;
    }
}

    This causes that the size of the item container is only applied when the ExpanderView is currently expanded. I simply added the following condition to set the height of the item container to 0 when the ExpanderView is currently not expanded.

    else if (null != _itemsCanvas && null != _presenter && !IsExpanded)
{
   _itemsCanvas.Height = 0;
}

    I added various improvements to the control to take advantage of new UWP capabilities, so if anyone is interested in a UWP compatible version feel free to contact me.

    UPDATE

    I created a GitHub Repo for the updated ExpanderControl for UWP