Windows Store ListView ItemStackPanel horizontal scrollbar not visible

Question

Im having Listview which shows 185 columns and 15 rows. For showing 185 columns with 15 rows, windows store app takes some time or UI gets freezes. below is the code Im using for showing data

    <ListView x:Name="outerlstView"   
                  Height="650" 
                  Margin="2,24,10,10" Grid.Row="1"
                         Grid.Column="1" BorderThickness="1"    HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
ItemsSource="{Binding Data,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
ScrollViewer.HorizontalScrollBarVisibility="Visible"
ScrollViewer.HorizontalScrollMode="Enabled"  ScrollViewer.VerticalScrollBarVisibility="Auto"                      
SelectionMode="None"  ShowsScrollingPlaceholders="True" IsZoomedInView="False" 
IsSwipeEnabled="False" IsItemClickEnabled="False"
ItemContainerStyle="{StaticResource LvItemStyle}"
   <ListView.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel  
                                Orientation="Vertical" VirtualizingStackPanel.VirtualizationMode="Standard"/>
                </ItemsPanelTemplate>
            </ListView.ItemsPanel>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <ListView  SelectionMode="None" IsZoomedInView="False" IsHoldingEnabled="False"
                        IsSwipeEnabled="False"  x:Name="ListRow"                     ItemsSource="{Binding data, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" HorizontalAlignment="Stretch" Width="Auto" Height="Auto" 
VerticalAlignment="Center" ItemContainerStyle="{StaticResource LvItemStyle}" AllowDrop="True"                
                        ShowsScrollingPlaceholders="True">
                        <interactivity:Interaction.Behaviors>
                            <awbehaviors:DragBehaviour/>
                        </interactivity:Interaction.Behaviors>
                        <ListView.ItemTemplate>
                            <DataTemplate>
                                <Grid  Height="35" Width="120" HorizontalAlignment="Center" >
  <Rectangle StrokeDashArray="1 1 0.3 1" Height="30" VerticalAlignment="Top" IsHitTestVisible="False"   Opacity="0.5" Stroke="White" StrokeThickness="1" Margin="0" StrokeEndLineCap="Square" StrokeDashOffset="1.5"
Fill="{Binding ElementName=ListRow,Path=Tag,Converter={StaticResource RowNotoBackgroundConverter}}"/>
 <TextBlock Text="{Binding FeedCellData,Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}" HorizontalAlignment="Left"
                              tyle="{StaticResource GridItemTextStyle}"  Width="120" AllowDrop="True"  Padding="1" TextWrapping="NoWrap" 
                                               VerticalAlignment="Top" Tag="{Binding ElementName=ListRow,Path=Tag}"  ToolTipService.ToolTip="{Binding FeedCellData}"                               
                                               Height="{Binding Path=Tag, RelativeSource={RelativeSource Mode=Self},Converter={StaticResource RowtoHeightConverter }}" >
                                         </TextBlock>
                                </Grid>
                            </DataTemplate>
                        </ListView.ItemTemplate>
                        <ListView.ItemsPanel>
                            <ItemsPanelTemplate>
                                <ItemsStackPanel Margin="0,0,0,0" Width="Auto" Orientation="Horizontal" Height="35" VirtualizingStackPanel.VirtualizationMode="Standard"/>
                            </ItemsPanelTemplate>
                        </ListView.ItemsPanel>
                    </ListView>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>

the above code has listview inside it another listview. when i try to load list<list> to listview it takes too much of time. Some time app crashes when i load 100 rows with 185 columns.

I tried to replace Itemtemplate stye control to Itemstackpanel performance is good. data is loaded and shown on screen faster but i dont see Horizontal scroll

Previous Code

      <ListView.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel  
                                Orientation="Vertical" VirtualizingStackPanel.VirtualizationMode="Standard"/>
                </ItemsPanelTemplate>
            </ListView.ItemsPanel>
            <ListView.ItemTemplate>


when i modify to `<ListView.ItemsPanel>
                            <ItemsPanelTemplate>
                                <ItemsStackPanel Margin="0,0,0,0" Width="Auto" Orientation="Horizontal" Height="35" VirtualizingStackPanel.VirtualizationMode="Standard"/>
                            </ItemsPanelTemplate>
                        </ListView.ItemsPanel>`

i dont see horizontal scrollbar enabled. Can any1 suggest me how to enable Horizontal scroll bar enabled by default to Itemstackpanel in windows store apps.Looks like it is bug with this control or there work arounds to ItemsStackpanel with Horizontal Scrollbar.

It appears to be a bug. Head on over to this topic and add a comment if it's still a problem for you: http://social.msdn.microsoft.com/Forums/windowsapps/en-US/ef1fd228-5889-4ac7-8f6f-847dac4d2217/horizontal-scrolling-doesnt-work-with-itemsstackpanel-in-listviewgridview?forum=winappswithnativecode — Quark Soup, May 20 '14 at 12:31

score 1 · Answer 1 · answered Feb 24 '14 at 18:46

If your ItensSource is a list of objects with a attribute Name and a attribute Price for example:

<ListView ItemsSource="{Binding Here_your_DataSource}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" ScrollViewer.HorizontalScrollBarVisibility="Visible" ScrollViewer.VerticalScrollBarVisibility="Visible"  >

        <ListView.ItemsPanel>
            <ItemsPanelTemplate> 
                <WrapGrid Orientation="Horizontal" MaximumRowsOrColumns="15"/>
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>

        <ListView.ItemTemplate>
            <DataTemplate>

                <!--Here u design your item template-->
                <StackPanel Background="Blue" Width="100" Height="100">
                    <TextBlock Text="{Binding Name}"></TextBlock>
                    <TextBlock Text="{Binding Price}"></TextBlock>
                </StackPanel>

            </DataTemplate>
        </ListView.ItemTemplate>

</ListView>

but when i use WrapGrid it is having performance problem, when i try to ItemsStackPanel it loads pretty fast — user145610, Feb 26 '14 at 19:32
Sorry, but I don't know a better way to do it in a listview. I think you should rethink the structure of your program to use fewer items at a time or use another type of container. — Vinick Goldenberg, Feb 27 '14 at 00:08

Windows Store ListView ItemStackPanel horizontal scrollbar not visible

1 Answers1