我目前正在尝试创建一个简单的应用,该应用将从我制作的API中提取数据并将其显示在列表中。然后,您应该能够单击列表项,以使用图像查看器等导航到详细视图页面。为此,我需要导航到名为PlanViewer.xaml
(当前仅适用于Windows Phone应用程序部分,虽然两者都做)。
为了使我的列表正常工作,我在共享中构建了以下数据模板App.xaml
:
<DataTemplate x:Key="PlanDataTemplate">
<StackPanel Orientation="Horizontal">
<Button Name="NavigatePlan" Tag="{Binding FilePath}">
<StackPanel>
<TextBlock Style="{StaticResource SubheaderTextBlockStyle}" Text="{Binding Name}" />
<TextBlock Style="{StaticResource TitleTextBlockStyle}" Text="{Binding LastUpdate}" />
</StackPanel>
</Button>
</StackPanel>
</DataTemplate>
我将其应用于我的位置MainPage.xaml
,如下所示:
<ItemsControl x:Name="PlanList" ItemTemplate="{StaticResource PlanDataTemplate}" ItemsSource="{Binding PlanItems}" >
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<VirtualizingStackPanel />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
我无法将任何事件绑定到中的按钮App.xaml
,所以我认为我需要使用一个ICommand
接口。到目前为止,我可能还是有一个更根本的错误。
TL; DR实现我的目标:我想调整数据模板,以便每个按钮都链接到页面,PlanViewer.xaml
并带有一个参数,该参数描述应该显示的计划(例如ID或文件路径)。
这是通用应用程序解决方案。它基本上可以作为有关Model,View和ViewModel的教程进行查看。
我不知道要使用什么UI元素,但是为此,我将选择Windows 8.1和WP 8.1都支持的UI元素。ListView,因此在Project的MainPage.xaml中都可以定义它。
<ListView x:Name="myListView">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Artist}"></TextBlock>
<TextBlock Text="{Binding Song}"></TextBlock>
<Button Command="{Binding ElementName=myListView, Path=DataContext.SimpleCommand}"
CommandParameter="{Binding Extra}"
x:Name="mybutton" Width="200" Height="50" FontFamily="Global User Interface" Content="Click Me"/>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
如您所见,我将Button与Command和CommandParameter绑定在一起。该命令是ViewModel中用户单击按钮时要执行的函数。CommandParameter是您要传递给Command函数的对象。您的情况就是您的TAG。
命名空间
using System.Collections.ObjectModel; // ObservableCollection
using System.Windows.Input; // ICommand
现在让我们定义一个命令(应该是共享项目的一部分)
public class MySimpleCommand : ICommand
{
public void Execute(object parameter)
{
// do stuff based off your tags
string tag = parameter as string;
if(tag == "WHATEVER_YOU_WANT")
{
}
// void of the trigger libraries, lets make this simple
// navigate to your page
Frame rootFrame = Window.Current.Content as Frame;
rootFrame.Navigate(typeof(YOUR_PAGE));
}
public bool CanExecute(object parameter)
{
return true;
}
public event EventHandler CanExecuteChanged;
}
现在让我们建立一个简单的模型(应该是共享项目的一部分)
public class sample_model
{
public sample_model(string artist, string song, string extra = "")
{
this.Artist = artist;
this.Song = song;
this.Extra = extra;
}
public string Artist { get; set; }
public string Song { get; set; }
public string Extra { get; set; } // this is your tag
}
现在让我们设置一个ViewModel供我们的ListView使用。(应该是共享项目的一部分)
public class sample_viewmodel
{
public sample_viewmodel()
{
this.DataSource = CreateData();
this.SimpleCommand = new MySimpleCommand(); // create the command
}
// create a static list for our demo
private ObservableCollection<sample_model> CreateData()
{
ObservableCollection<sample_model> my_list = new ObservableCollection<sample_model>();
my_list.Add(new sample_model("Faith + 1", "Body of Christ", "A Track"));
my_list.Add(new sample_model("Faith + 1", "Christ Again", "A Track"));
my_list.Add(new sample_model("Faith + 1", "A Night With the Lord", "A Track"));
my_list.Add(new sample_model("Faith + 1", "Touch Me Jesus", "A Track"));
my_list.Add(new sample_model("Faith + 1", "I Found Jesus (With Someone Else)", "A Track"));
my_list.Add(new sample_model("Faith + 1", "Savior Self", "A Track"));
my_list.Add(new sample_model("Faith + 1", "Christ What a Day", "A Track"));
my_list.Add(new sample_model("Faith + 1", "Three Times My Savior", "A Track"));
my_list.Add(new sample_model("Faith + 1", "Jesus Touched Me", "A Track"));
my_list.Add(new sample_model("Faith + 1", "Lord is my Savior", "A Track"));
my_list.Add(new sample_model("Faith + 1", "I Wasn't Born Again Yesterday", "A Track"));
my_list.Add(new sample_model("Faith + 1", "Pleasing Jesus", "A Track"));
my_list.Add(new sample_model("Faith + 1", "Jesus (Looks Kinda Hot)", "A Track"));
my_list.Add(new sample_model("Butters", "What What", "B Track"));
return my_list;
}
public ICommand SimpleCommand { get; set; }
public ObservableCollection<sample_model> DataSource{ get; set; }
}
最后,让ListView链接到我们的ViewModel,该ViewModel应该绑定“ Artist,Song和Button(Command&CommandParamters)”。我通常在每个页面的Load函数中执行此操作。
private void Page_Loaded(object sender, RoutedEventArgs e)
{
sample_viewmodel viewmodel = new sample_viewmodel(); // create the view model
myListView.DataContext = viewmodel; // set the datacontext (this will link the commands)
myListView.ItemsSource = viewmodel.DataSource; // set the ItemsSource, this will link the Artist,Songs
}
无论用户在哪个平台上执行命令功能,每次用户单击按钮时,都可以使用它。
样本截图
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句