Créer une Page

Une nouvelle page a besoin de plusieurs éléments :

• un ViewModel
• une View par OS cible (Android, Windows, iOS)

Créer le ViewModel

Dans la partie Common.IndiaRose.Business, dans le dossier ViewModels, il faut créer une nouvelle classe qui hérite de AbstractViewModel ou l'un de ses descendants

Il faut ensuite l'enregistrer dans la classe ViewModelsLocaltor.cs (se trouvant dans le même dossier).

Dans la méthode Initialize, il faut ajouter le ligne :

container.RegisterFactory(x => new MonViewModel());

Ensuite il faut créer une propriété qui retournera l'instance créée précédemment.

La propriété a ce modèle :

public ClasseMonViewModel NomViewModel
{
  get { return _container.Resolve<ClasseMonViewModel>(); }
}

Il faut ensuite créer une constante qui désignera la Vue. Pour cela il faut ajouter dans Views.cs une ligne de cette forme :

public const string CONST_VIEW ="Chaine_Unique_Désignant_La_Vue";

Créer la Vue Android

Tout d'abord il faut créer une page Xml dans Android.Application.Android.Views.

Ensuite il faut faire l'activité correspondante dans Android.Application.Android.Activities qui doit hériter de ActivityBase (ou l'un de ses descendants).

Dans la plupart des cas on modifie le OnCreate de l'Activité pour lui donner cette forme là :

protected override void OnCreate(Bundle savedInstanceState)
		{
			base.OnCreate(savedInstanceState);
			SetContentView(Resource.Layout.NomView);
			SetViewModel(new ClasseViewModel());
		}

Il faut ensuite ajouter la Vue dans le ActivityDescription.json. Il faut pour cela ajouter une entrée dans le fileDescriptions.

L'entrée a cette forme :

{ // Description de ce qu'on ajoute
            "activity": {
                "className": "ClasseActivité",
                "namespaceName": "NamespaceActivité"
            },
            "view": {
                "inputFile": "DossiersDeLaVue*/Vue.xml",
                "outputFile": "NomView.axml"
            }
        }
}

Attention le NomView doit correspondre avec celui qu'on a rentré dans l'Activité et il faut mettre toutes l'arborescence des dossiers dans DossiersDeLaVue

Enfin, il faut modifier le fichier IndiaRoseApplication.cs pour y ajouter une ligne dans le Dictionnaire views. La ligne a la forme suivante :

{Views.CONST_VIEW, typeof(ClasseActivité)}

CONST_VIEW est la constante défini dans la partie ViewModel.

Créer la Vue Windows (WinRT)

Tout d'abord il faut créer une page Xaml dans Windows8.Application.Tablet.Views. Cela vous créera la page Xaml et la classe associé.

L'élément root de la page Xaml doit être changé en mvvm:MvvmPage.

Pour rajouter le lien vers le ViewModel il faut ajouter à l'élément MvvmPage la ligne :

DataContext="{Binding Source{StaticResource Locator}, Path=MonViewModel}"

Enfin il faut ajouter la page au dictionnaire des views. Pour cela il faut modifier le fichier Windows8.Application.Tablet.CompositionRoot.Boostrap.cs.

Dans le dictionnaire views il faut ajouter :

{ViewKey.CONST_VIEW, typeof(ClasseView)}

CONST_VIEW est la constante défini dans la partie ViewModel.

Naviguer entre les Pages

Voir How to use NavigationService de Storm par Julien Mialon