¿Cómo implementar un botón de navegación en recursos de aplicaciones compartidas?

Actualmente estoy tratando de crear una aplicación simple que extraiga datos de una API que hice y los muestre en una lista. Se supone que debe poder hacer clic en los elementos de la lista para navegar a una página de vista detallada con un visor de imágenes, etc. Para que esto funcione, debo navegar a una página llamada PlanViewer.xaml (actualmente solo está disponible para la aplicación Windows Phone parte, servirá para ambos)

Para que mi lista funcione, construí la siguiente plantilla de datos en mi App.xaml compartida:

       

Lo aplico en mi MainPage.xaml como se muestra aquí:

        

No puedo vincular ningún evento al botón de la App.xaml , así que creo que necesito usar una interfaz ICommand . También podría tener un error mucho más fundamental en cómo construí esto hasta ahora.

TL; DR para mi objective: quiero ajustar la plantilla de datos para que cada botón se vincule a una página PlanViewer.xaml con un argumento que describa qué plan se supone que debe mostrarse (por ejemplo, ID o ruta del archivo).

Esta es una solución de aplicación universal. Se puede ver como básicamente un tutorial sobre Model, View y ViewModel.

No sé qué elemento UI quieres usar, pero para esto voy a elegir uno compatible con Windows 8.1 y WP 8.1. ListView, por lo tanto, en MainPage.xaml de ambos proyectos, defina eso.


            

Como puede ver, he enlazado el Botón con un Comando y un Parámetro de Comandos . El comando es la función en ViewModel que quiero ejecutar cuando el usuario hace clic en el botón. CommandParameter es un objeto que desea pasar a su función de comando. En tu caso, tu TAG.


Espacios de nombres

 using System.Collections.ObjectModel; // ObservableCollection using System.Windows.Input; // ICommand 

Ahora permitamos definir un Comando (debe ser parte del Proyecto Compartido)

 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; } 

Ahora permite configurar un modelo simple (debe ser parte del proyecto compartido)

 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 } 

Ahora permitamos configurar un ViewModel para nuestro ListView (s) para usar. (Debe ser parte del proyecto compartido)

 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 CreateData() { ObservableCollection my_list = new ObservableCollection(); 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 DataSource{ get; set; } } 

Y finalmente, permitamos vincular el ListView a nuestro ViewModel, que debe vincular al “Artista, Canción y Botón (Command & CommandParamters)”. Normalmente hago esto en la función de carga de cada página.

 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 } 

Ahí lo tienes, cada vez que el usuario hace clic en el botón, sin importar en qué plataforma realizará la función Comando.

Captura de pantalla de muestra enter image description here