CODEWITHSUNDEEP
c#windows-phone-8.1windows-phone
samuel
samuel

Reputation: 31

How to add columns to listview in windows phone 8.1,c#?

Hi I am struggling to add columns to listview in windows phone 8.1. I want 2 columns: Column 1 = Item Column 2 = Quantity

I have managed to add an item to a listview but the second item goes to the next row. I want both of the items to be displayed on the same row, so the second item should be displayed in a second column.

Here is my code

   protected override void OnNavigatedTo(NavigationEventArgs e)
    {
        var listViewItem = (new ListViewItem { Content ="Vanilla"});
        var listViewItem2 = (new ListViewItem {Content ="1"});

        listView.Items.Add(listViewItem);
        listView.Items.Add(listViewItem2);



    }

Upvotes: 1

Views: 157

Answers (2)

GrzegorzJanik
GrzegorzJanik

Reputation: 1

In my opinion you should create an object that contains two properties:

public class ListViewItem 
{
    public int Index { get; set; }

    public string Name { get; set; }
}

Then assign a object(s) you want to your ListView:

protected override void OnNavigatedTo(NavigationEventArgs e)
{
    var listViewItem = new ListViewItem { Name= "Vanilla", Index = 1 };

    listView.Items.Add(listViewItem);
}

Then you can simply create a ItemTemplate for your ListView:

<ListView.ItemTemplate>
    <DataTemplate>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
                <TextBlock Grid.Column="0" Text="{Binding Index}"/>
                <TextBlock Grid.Column="1" Text="{Binding Name}"/>
        </Grid>
    </DataTemplate>
</ListView.ItemTemplate>

I wrote this on the fly, so there might be some syntax errors :P

Upvotes: 0

sly_Chandan
sly_Chandan

Reputation: 3515

<ListView x:Name="itemListView"
          Margin="120,0,0,60"
          ItemsSource="{Binding Source={StaticResource itemsViewSource}}"
          SelectionChanged="ItemListView_SelectionChanged">
    <ListView.ItemTemplate>
        <DataTemplate>
            <Grid Height="110" Margin="6">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto"/>
                    <ColumnDefinition Width="*"/>
                </Grid.ColumnDefinitions>
                <Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}" Width="110" Height="110">
                    <Image Source="{Binding Image}" Stretch="UniformToFill"/>
                </Border>
                <StackPanel Grid.Column="1" VerticalAlignment="Top" Margin="10,0,0,0">
                    <TextBlock Text="{Binding Title}" Style="{StaticResource TitleTextStyle}" TextWrapping="NoWrap"/>
                    <TextBlock Text="{Binding Subtitle}" Style="{StaticResource CaptionTextStyle}" TextWrapping="NoWrap"/>
                    <TextBlock Text="{Binding Description}" Style="{StaticResource BodyTextStyle}" MaxHeight="60"/>
                </StackPanel>
            </Grid>
        </DataTemplate>
    </ListView.ItemTemplate>          
</ListView>

Upvotes: 1

Related Questions