CODEWITHSUNDEEP
c#xamllistviewnavigationuwp
Ravi
Ravi

Reputation: 189

Navigation in between pages using ListView in UWP

I am trying to navigate in between pages using listitems but its not working. My home page is MainPage.xaml and I want to navigate to "xyz" when I click on the Aba image in listview

Here is my code:

namespace abc
{

public sealed partial class MainPage : Page
{
    ObservableCollection<Class1> list1 = new ObservableCollection<Class1>();
    public MainPage()
    {
        this.InitializeComponent();
        Filldata();
    }

    void Filldata()
    {
        list1.Add(new Class1 { name = "Aba", image = "ms-appx:///images/aba.png" });
        list1.Add(new Class1 { name = "Al", image = "ms-appx:///images/al.png" });
    }

    private void itemclicked(object sender, ItemClickEventArgs e)
    {
        var nme = (Class1)e.ClickedItem;

        switch (nme.name)
        {
            case "Aba":
                Frame.Navigate(typeof(xyz),null);
                break;
        }
    }
}
}

MainPage.xaml

<ListView x:Name="list" ItemClick="itemclicked">
        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <Image Height="100" Width="100" Source="{Binding image}"></Image>
                    <TextBlock Text="{Binding name}" HorizontalAlignment="Center"></TextBlock>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>

Class1.cs

class Class1
{
    public String name { get; set; }
    public String image { get; set; }
}

Upvotes: 0

Views: 1275

Answers (1)

Almir Vuk
Almir Vuk

Reputation: 3173

You have an issue with your ListView control and the main reason is that you don't have this property in your ListView in XAML:

IsItemClickEnabled="True"

So in order to solve your problem add this property IsItemClickEnabled="True" at ListView in XAML page like this:

 <ListView x:Name="list"
           ItemClick="itemclicked"
           IsItemClickEnabled="True">
        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <Image Height="100"
                           Width="100"
                           Source="{Binding image}"></Image>
                    <TextBlock Text="{Binding name}"
                               HorizontalAlignment="Center"></TextBlock>
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
   </ListView>

Your code is fine at navigation methods and other things but you need to "enable" items to be clicked, so add that property in order to can use them with click events.

Upvotes: 3

Related Questions