locked
Access listview within a flipview using grid app template in Metro App C# RRS feed

  • Question

  • Hi,

    How can I bind the item source of a listview from code-behind, which resides in a flipview?

    I know that it is not possible to access a named control in a data template and in order to access it, I have to navigate through the visual tree of the individual item. 

    Thus, is there a simpler way of accessing the listview from code-behind and set its item source to a method retrieved from wcf service?

    Any help is appreciated.

    Thanks. 



    • Edited by Dewi Abdullah Tuesday, August 13, 2013 3:32 AM Edited
    Tuesday, August 6, 2013 4:31 AM

All replies

  • This article shows how to configure the databinding for Listview inside Listview. On same lines you can configure ListView within a FlipView data binding. 

    Thanks,
    Sachin
    My Samples

    Tuesday, August 6, 2013 1:37 PM
  • Hi Sachin,

    I'm using the grid app template. The following are the codes for the ItemDetailPage.xaml:

    <FlipView
                x:Name="flipView"
                AutomationProperties.AutomationId="ItemsFlipView"
                AutomationProperties.Name="Item Details"
                TabIndex="1"
                Grid.RowSpan="2"
                ItemsSource="{Binding Source={StaticResource itemsViewSource}}">
    
                <FlipView.ItemContainerStyle>
                    <Style TargetType="FlipViewItem">
                        <Setter Property="Margin" Value="0,137,0,0"/>
                    </Style>
                </FlipView.ItemContainerStyle>
    
                <FlipView.ItemTemplate>
                    <DataTemplate>
                        
                     .
                     .
                     .
    
                    <Grid>
    
                     .
                     .
                     .
    
    		     <StackPanel Orientation="Vertical" Grid.Column="4">
                               <TextBlock FontSize="26.667" FontWeight="Light" Foreground="White" Text="Snapshot" Margin="0,0,0,16"/>
                                        
                               <ListView x:Name="lbSnapshot" Margin="0,30,0,0" ItemsSource="{Binding}">
                                    <ListView.ItemTemplate>
                                          <DataTemplate>
                                               <StackPanel>
                                                   <TextBlock> 
                                                   <Bold>Snapshot Name: </Bold>
                                                   <Run Text="{Binding VmSnapshotName}" />
                                                   </TextBlock>
                                                    <TextBlock> 
                                                    <Bold>Snapshot Creation Time: </Bold>
                                                    <Run Text="{Binding VmSnapshotTime}" />
                                                    </TextBlock>
                                               </StackPanel>
                                          </DataTemplate>
                                    </ListView.ItemTemplate>
                               </ListView>
                         </StackPanel>
                    </Grid>
                    </DataTemplate>
                </FlipView.ItemTemplate>               
    </Flipview>

    Here's the code-behind snippet:

        var collection = await objService.GetVMSnapshotAsync();
        var filterCollection = collection.Where(i => i.VmName == selectedVm).ToList();

    In the data source, I've created a getter and setter for the VmSnapshotName and VmSnapshotTime. Thus, the value of the snapshot name and time binds to the XAML through the data source. 

    However, when I implement a listview which consists of textblock in it to display the mentioned values that I want, the output is blank. Meaning when I run the app, the listview as well as the textblock are not displayed in the flipview. 

    The binding of the listview items source also doesn't work because I was trying to bind it to 'filterCollection' which I retrieved from the code-behind. This can't be done most probably because the grid app template binds through the data source not from code-behind. 

    Can you point where I went wrong with the codings?

    Thanks.





    • Edited by Dewi Abdullah Thursday, August 29, 2013 12:36 PM Edit
    Wednesday, August 7, 2013 3:52 AM
  • Hi,Dewi

    I do not know what data contained in the item in your project. There may be exist some problem that you set listview ItemsSource="{Binding collection}">.

    Can you explain what you want to do and what data Contained  in Item?what data Contained in item.Group.Items.And what a relationship between Item and Collection.

    Best Wishes!

    Wednesday, August 7, 2013 12:24 PM
  • Hi Anne,

    I've done some editing to the codes above. 

    What I want to do is to bind the itemsource of the listview to the filterCollection. The filterCollection filters the collection by name. Meaning it will only display the info of a particular item that I clicked. 

    The Item refers to the data item that we clicked and it contains the items that consist in a group. The item.Group.Items returns the count of items in a group. 

    I'm unsure how exactly to bind the listview to the filterCollection through the data source instead of through the code-behind. This is due to the filterCollection which requires the value 'selectedVm' to do the filtering.

    Thanks. 




    Monday, August 12, 2013 2:11 AM
  • Hi,

    Can anyone help me out on this matter?

    I've been trying without any success to display the listview as well as its contents which resides in the flipview of ItemDetailPage. Whenever I run the app, the listview doesn't display.

    Thanks.

    Tuesday, August 20, 2013 5:19 AM
  • Sorry, somehow I missed this one. Is it possible to upload a small project where issue is reproducible, I will be happy to have a look?

    Thanks, Sachin

    Tuesday, August 20, 2013 2:05 PM