如何在Xamarin Forms中选择listview项目时打开另一个页面？

Question

你好，我正在开发一款移动应用程序，该应用程序使用Xamarin Forms构建，主页面是一个带有类别列表的列表视图。我需要实现的功能是，当用户点击列表视图中的项目时，它会在应用程序中打开新页面。以下是XAML代码：

<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="SchoolTools.HomePage">
     <ListView HasUnevenRows="true">
               <ListView.ItemTemplate>
      <DataTemplate>
        <ViewCell>
          <Frame Padding="0,0,0,8" BackgroundColor="#d2d5d7">
            <Frame.Content>
              <Frame Padding="15,15,15,15"   OutlineColor="Gray" BackgroundColor="White">
                <Frame.Content>
                  <StackLayout Padding="20,0,0,0"  Orientation="Horizontal" HorizontalOptions="CenterAndExpand">
                    <Label x:Name="Internet" Text="Internet" HorizontalOptions="Center">
                        </Label>
                        <Label x:Name ="Math" Text="Math" HorizontalOptions="Center">
                        </Label>
                        <Label x:Name="Science" Text="Science" HorizontalOptions="Center">
                        </Label>
                        <Label x:Name ="Handwriting" Text="Handwriting" HorizontalOptions="Center">
                        </Label>
                          <Label x:Name ="FlashCards" Text="FlashCards" HorizontalOptions="Center">
                        </Label>
                        <Label x:Name="Books"  Text="Books" HorizontalOptions="Center">
                        </Label>   
                  </StackLayout>
                </Frame.Content>
              </Frame>
            </Frame.Content>
          </Frame>
        </ViewCell>
      </DataTemplate>
    </ListView.ItemTemplate>
  </ListView>
</ContentPage>

所以我的问题是，使数学字段带您进入MathToolsHome类的代码是什么？等等等等？

任何帮助都将是惊人的！

提前谢谢你！ :)

- Phoneswapshop

---

你的列表中每一行都有6个标签吗？还是你只想要一个有6行且每行只有一个标签的列表？ - Jason

Answer 1

为您的Listview定义ItemSelected：

 <ListView HasUnevenRows="true"
           ItemSelected="OnItemSelected">

然后编写处理程序：

    private void OnItemSelected(object sender, SelectedItemChangedEventArgs e)
    {
        var item = e.SelectedItem;
        // Your code here
    }

- Christine

Answer 2

您可能正在寻找TapGestureRecognizer，您可以在SchoolTools.HomePage构造函数中调用InitializeComponent()后进行设置：

var mathTapRecognizer = new TapGestureRecognizer();
mathTapRecognizer.Tapped += async delegate {
    // Whatever you need to do here, like
    await Navigation.PushAsync(new MathToolsHome());
};
Math.GestureRecognizers.Add(mathTapRecognizer);

假设MathToolsHome是某种类型的页面。 编辑 添加XAML解决方案...

根据您的XAML方式，我所概述的方法不太适用，因为您无法以这种方式更改DataTemplates成员的设置（这就是为什么编译器将Math绑定到System.Math而不是您布局中的Label）。

最简单的方法是在您的XAML中添加TapGestureRecognizer，并调用您的代码后台。

XAML:

<Label x:Name ="Math" Text="Math" HorizontalOptions="Center">
  <Label.GestureRecognizers>
    <TapGestureRecognizer Tapped="Math_Clicked"/>
  </Label.GestureRecognizers>
</Label>

在你的代码后台中：

public async void Math_Clicked(object sender, EventArgs e)
{
    await Navigation.PushAsync(new MathToolsHome());
}

我曾使用纯C#编写过更多的DataTemplate实现而不是XAML，但这种方法应该也可以适用。

- DavidS

---

谢谢您的回复。当我尝试运行您的代码时，出现了以下错误：/Users/JailBrak0e/Projects/SchoolTools/SchoolTools/HomePage.xaml.cs(9,9): Error CS0117: System.Math' does not contain a definition for GestureRecognizers' (CS0117) (SchoolTools) - Phoneswapshop

请查看更新后的答案，它应该更适用于使用XAML定义的DataTemplate。 - DavidS

我觉得没有必要把事情搞得那么复杂，Christine的答案应该完全可以解决问题。 - Tharkius