![](/img/trans.png)
[英]How to open another xamarin forms page from clicking a item in a data template list view?
[英]how to push to another page by clicking on a item in a data model in xamarin forms?
您好,我正在使用xamarin表单应用程序,该应用程序在cardview中显示数据收集。 我要做的是,当用户点击卡片时,它将带您进入另一页
这是我的卡数据视图模型代码:
using appname.Model;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Text;
using Xamarin.Forms;
namespace appname.ViewModel
{
public class CardDataViewModel
{
public IList<CardDataModel> CardDataCollection { get; set; }
public object SelectedItem { get; set; }
public CardDataViewModel()
{
CardDataCollection = new List<CardDataModel>();
GenerateCardModel();
}
private void GenerateCardModel()
{
// for (var i = 0; i < 10; i++)
{
CardDataCollection = new ObservableCollection<CardDataModel>
{
new CardDataModel(typeof(FindArtistsPage))
{
HeadLines ="Find Artists Near You" ,
ProfileImage = "Person_7.jpg",
HeadLinesDesc = "Find Pefromers Near your location",
// Code to go another page should go here
},
};
}
}
}
}
这是我的卡代码:
using System;
using System.Collections.Generic;
using System.Text;
namespace appname.ViewModel
{
public class Cards
{
public Cards (string name, string image)
{
this.Name = name;
this.Image = image;
}
public string Name { private set; get; }
public string Image { private set; get; }
}
}
最后是我的卡数据模型代码:
using System;
using System.Collections.Generic;
using System.Text;
using Xamarin.Forms;
namespace appname.Model
{
public class CardDataModel
{
public CardDataModel(Type type)
{
}
public string HeadTitle { get; set; }
public string HeadLines { get; set; }
public string HeadLinesDesc { get; set; }
public string ProfileImage { get; set; }
}
}
编辑我忘了把卡Ui的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"
xmlns:local="clr-namespace:appname"
xmlns:view="clr-namespace:appname.View;assembly=appname"
xmlns:viewModel="clr-namespace:appname.ViewModel;assembly=appname"
x:Class="appname.HomePage">
<ContentPage.BindingContext>
<viewModel:CardDataViewModel/>
</ContentPage.BindingContext>
<StackLayout Orientation="Vertical" BackgroundColor="White">
<ListView x:Name="listView" SelectedItem="{Binding SelcetedItem,Mode=TwoWay}"
RowHeight="150"
ItemsSource="{Binding CardDataCollection}" HasUnevenRows="True" >
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<view:CardViewTemplate/>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage>
和CardViewTemplate代码:
<?xml version="1.0" encoding="utf-8" ?>
<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="appname.View.CardViewTemplate"
xmlns:controls="clr-namespace:ImageCircle.Forms.Plugin.Abstractions;assembly=ImageCircle.Forms.Plugin.Abstractions"
xmlns:local="clr-namespace:appname">
<Frame IsClippedToBounds="True"
HasShadow="True"
BackgroundColor="#443b3e" >
<Frame.OutlineColor>
<OnPlatform x:TypeArguments="Color"
Android="Gray"
iOS="Gray"/>
</Frame.OutlineColor>
<Frame.Margin>
<OnPlatform x:TypeArguments="Thickness"
Android="7" iOS="7"/>
</Frame.Margin>
<Frame.Padding>
<OnPlatform x:TypeArguments="Thickness"
Android="5" iOS="5"/>
</Frame.Padding>
<StackLayout Orientation="Horizontal">
<Grid VerticalOptions="CenterAndExpand"
Padding="0"
HorizontalOptions="FillAndExpand"
BackgroundColor="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<StackLayout Orientation="Horizontal" VerticalOptions="Start" >
<controls:CircleImage Source="{Binding ProfileImage}" VerticalOptions="Start" HeightRequest="30" WidthRequest="30"></controls:CircleImage>
<Label FontAttributes="None"
Grid.Row="0"
HorizontalTextAlignment="Start"
VerticalTextAlignment="Center"
FontSize="12"
Text="{Binding HeadTitle , Mode = TwoWay}" TextColor="White" >
</Label>
</StackLayout>
<Grid Grid.Row="1">
<StackLayout Orientation="Horizontal">
<Label FontAttributes="None"
Grid.Row="1"
HorizontalTextAlignment="Start"
VerticalTextAlignment="Start"
FontSize="30"
Text="{Binding HeadLines, Mode = TwoWay}" TextColor="White" HorizontalOptions="Center">
</Label>
<Image Source="{Binding ProfileImage}" Grid.Row="2" WidthRequest="40" HeightRequest="40" HorizontalOptions="End" />
</StackLayout>
</Grid>
<Grid Grid.Row="2"
BackgroundColor="Transparent"
Padding="4">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Label Grid.Row="0"
Grid.Column="0"
/>
<Label Grid.Row="0"
Grid.Column="0"
Text="{Binding HeadLinesDesc}" HorizontalOptions="Start" TextColor="White" VerticalOptions="CenterAndExpand"/>
</Grid>
</Grid>
</StackLayout>
</Frame>
</ContentView>
在发布此信息之前,我已经尝试了所有可能的搜索,因此任何帮助都将是惊人的!
提前致谢! :)
假设您要导航至“卡片特定页面”,我将为您提供有关操作方法的指导。
首先,您在这里出现错误<ListView x:Name="listView" SelectedItem="{Binding SelcetedItem,Mode=TwoWay}"
..使它成为{Binding SelectedItem}
其次,绑定没有做任何事情。 如果要运行某些内容,请使其成为Command
,然后将其绑定。
public IList<CardDataModel> CardDataCollection { get; set; }
public ICommand SelectedItem;
public CardDataViewModel()
{
CardDataCollection = new List<CardDataModel>();
GenerateCardModel();
SelectedItem = new Command<CardDataModel>(NavigateToCardPage)
}
private async void NavigateToCardPage(CardDataModel c)
{
await Application.Current.MainPage.Navigation.PushAsync(new CardPage(c));
}
private void GenerateCardModel()
{
// for (var i = 0; i < 10; i++)
{
CardDataCollection = new ObservableCollection<CardDataModel>
{
new CardDataModel(typeof(FindArtistsPage))
{
HeadLines ="Find Artists Near You" ,
ProfileImage = "Person_7.jpg",
HeadLinesDesc = "Find Pefromers Near your location",
// Code to go another page should go here
},
};
}
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.