This project is read-only.
1
Vote

Something seems to be messing width up sometimes on AlphaJumpList

description

I'm having a lot of trouble pinning this one down mainly because if I try to run my app in debug mode, the problem goes away!
I'm using the following XAML to turn a ListView into a jump list:
            <q:AlphaJumpList>
                <ListView x:Name="groupListView"
                    ItemsSource="{Binding Source={StaticResource groupedItemsViewSource}}"
                    ItemTemplateSelector="{StaticResource ListViewSelector}"
                    ItemContainerStyle="{StaticResource ListViewStretchStyle}"
                    IsItemClickEnabled="True"
                    ItemClick="itemGridView_ItemClick"
                />
            </q:AlphaJumpList>
Under certain circumstances, if I scroll the list down to the bottom, all of the items virtually disappear with just the thinnest of slivers visible as can be seen in this screenshot: http://1drv.ms/1xN3bID

If I exit the page and go back in, the problem goes away. This is what it should look like: http://1drv.ms/1xN3oeD

I'm using the latest source but I'm really struggling to figure out what needs to be fixed here.

comments

sakya wrote Jan 30, 2015 at 11:36 AM

Try to set a fixed with to the items:
<ListView.ItemTemplate>
  <DataTemplate>
    <Grid Width="350">
      ...
    </Grid>
  </DataTemplate>
</ListView.ItemTemplate>

pcolmer wrote Mar 25, 2015 at 11:46 AM

I do this already, unfortunately. I think it is getting overridden somehow with the way that AlphaJumpList consumes the ListView.

The ItemTemplateSelector will pick something like "Individual80ItemTemplate", which has this as the definition:
    <DataTemplate x:Key="Individual80ItemTemplate">
        <Grid Margin="6,0,0,10.5" HorizontalAlignment="Left" Width="{Binding Path=ScreenWidth.TrimmedWidth}">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            ...
        </Grid>
    </DataTemplate>
ScreenWidth.TrimmedWidth is a static property that returns "Window.Current.Bounds.Width - 44". This is something another developer wrote to stop lists "wobbling" as XAML fails to cope with variable width controls in a list when you scroll up and down.

pcolmer wrote Apr 22, 2016 at 2:54 PM

Just to share the solution I ultimately came up with ... I adding a Width declaration to the ListView itself:
            <q:AlphaJumpList>
                <ListView x:Name="groupListView"
                    Width="{Binding Path=ScreenWidth.TrimmedWidth}"
                    ...
                />
            </q:AlphaJumpList>