我有自定义ViewCell
。当我点击ViewCell
时,我想知道是否可以向其添加命令,该命令将导航到另一个页面。
以下是我到目前为止:
public class MainMenuItem : ViewCell
{
public MainMenuItem(string text, string icon)
{
View = new StackLayout()
{
Spacing = 10,
Padding = 10,
Orientation = StackOrientation.Horizontal,
VerticalOptions = LayoutOptions.Center,
Children = {
new Image() {
Source = ImageSource.FromFile(icon),
HorizontalOptions = LayoutOptions.Start,
HeightRequest = 30,
WidthRequest = 30,
},
new Label() {
Text = text,
HorizontalOptions = LayoutOptions.Start,
FontSize = 18,
},
new Image() {
Source = ImageSource.FromFile("listitem_next.png"),
HeightRequest = 12,
HorizontalOptions = LayoutOptions.EndAndExpand
}
}
};
View = View;
}
}
以上是我的观察细胞。现在我在TableView
的表格部分中呈现这些内容。以下是代码:
TableView tvProfile = new TableView
{
HasUnevenRows = true,
Intent = TableIntent.Form,
Root = new TableRoot {,
new TableSection ("Emergency Contacts")
{
new MainMenuItem("Contacts", "icon_phone.png")
},
new TableSection ("Check in Timers")
{
new MainMenuItem("Timers", "icon_clock.png")
},
new TableSection ("Medical Information")
{
new MainMenuItem("Medcial Info", "icon_medicalkit.png")
}
}
};
我想要的是,当用户选择一个项目(ViewCell
)时,我想将用户导航到相应的页面。
如何使用命令执行此操作?如果它甚至可能。我是新手使用命令,所以无论我在网上得到什么都已经过了我的脑袋。
对此的任何帮助都会非常感激。
答案 0 :(得分:3)
这是一个快速的“肮脏”实现。将command
和commandParameter
添加到constructor
,然后添加GestureRecognizer
来调用此command
。
public class MainMenuItem : ViewCell
{
public MainMenuItem(string text, string icon, ICommand command, Func<Page> commandParameterFunc)
{
View = new StackLayout()
{
...
};
View.GestureRecognizers.Add(new TapGestureRecognizer { Command = command, CommandParameter = commandParameterFunc });
}
}
然后执行以下更改 - 创建命令并向每个单元格添加2个参数。在这里,您可以定义命令,单击时会发生什么以及命令的参数,即Page (但您不应在此处创建并检查错误)。
更新:我更改为传递函数而不是对象,因此在单击时创建页面。还是有点脏;)
public class MyPage : ContentPage
{
private readonly ICommand _navigateCommand;
public MyPage()
{
_navigateCommand = new Command(commandParamter => Navigation.PushModalAsync((commandParamter as Func<Page>)())));
TableView tvProfile = new TableView
{
HasUnevenRows = true,
Intent = TableIntent.Form,
Root = new TableRoot
{
new TableSection ("Emergency Contacts")
{
new MainMenuItem("Contacts", "icon_phone.png", _navigateCommand, () => new ContactsPage())
},
new TableSection ("Check in Timers")
{
new MainMenuItem("Timers", "icon_clock.png", _navigateCommand, () => new TimersPage())
},
new TableSection ("Medical Information")
{
new MainMenuItem("Medcial Info", "icon_medicalkit.png", _navigateCommand, () => new MedicalInfoPage())
}
}
};
Content = tvProfile;
}
}