Search code examples
windows-phone-8scrollviewdatatemplate

Populate ScrollView at runtime in WIndows Phone 8


I have an app for windows phone 8 that displays data loaded from my website.

At the moment, I have setup 4 'holders' for the data, that contain a few TextBlocks and Images. When the app is loaded, these 4 holders display the data for the first 4 'records'. To display the next 4 'records', the user has to click a button, 'Next'.

I want to change this so that all 'records' are displayed in a ScrollView so the user simply has to scroll down to view records rather than click the 'Next' button.

I have also written the app for Android using Eclipse and Java. To do the above, I created a layout of the 'holder' in xml and then this is used as a template for the data. I only have to define the layout once and it is repeated at runtime, populated with the data from each record.

How do I achieve the same in Windows Phone, using vb.net and xaml?

I have googled and possibly DataTemplate is what I need however I'm not sure and have no idea how to implement it.

If you could point me in the right direction I'm sure I can figure it out!

Thanks in advance.

EDIT: Ok, I've tried the following but the ListBox is empty:

Basically I have a List populated at runtime from my website (I know this bit works):

Public WebData As New System.Collections.Generic.List(Of WebInfo)

WebInfo Class:

Public Class WebInfo
    Public ID As Integer
    Public H1 As String
    Public A1 As String
    Public C1 As String
    Public C2 As String
    Public K1 As Date
End Class

xaml:

<ListBox x:Name="MainList" HorizontalContentAlignment="Stretch"     VerticalContentAlignment="Stretch" Grid.Row="3"  Grid.RowSpan="6"  Grid.Column="0"    Grid.ColumnSpan="3">
        <ListBox.ItemTemplate>
            <DataTemplate>
                    <TextBlock x:Name="H1" Text="{Binding H1}"  FontSize="15" Margin="0" VerticalAlignment="Center" HorizontalAlignment="Right" TextAlignment="Right" FontWeight="Bold" Foreground="Black"/>
            </DataTemplate>
        </ListBox.ItemTemplate>
</ListBox>

I try to set the ItemsSource using:

MainList.ItemsSource = WebData

The ListBox does not populate.

Any Thoughts?


Solution

  • The problem was, I was using variables in my class rather than properties:

    Public Class WebInfo
        Public Property ID As Integer
        Public Property H1 As String
        Public Property A1 As String
        Public Property C1 As String
        Public Property C2 As String
        Public Property K1 As Date
    End Class
    

    Thanks for your help.