{"id":2998,"date":"2016-04-22T13:49:34","date_gmt":"2016-04-22T16:49:34","guid":{"rendered":"https:\/\/www.mxcursos.com\/blog\/?p=2998"},"modified":"2019-03-16T02:56:42","modified_gmt":"2019-03-16T05:56:42","slug":"navigation-e-messaging-com-xamarin-forms-pagecontext","status":"publish","type":"post","link":"https:\/\/www.mxcursos.com\/blog\/navigation-e-messaging-com-xamarin-forms-pagecontext\/","title":{"rendered":"Navigation e Messaging com Xamarin.Forms PageContext"},"content":{"rendered":"

Oi pessoal do MX Cursos, hoje vamos falar de PageContext, algu\u00e9m j\u00e1 ouviu falar ? N\u00e3o? Ent\u00e3o, este foi um termo que utilizei j\u00e1 que estaremos tratando no pr\u00f3prio contexto das Pages no Xamarin.Forms e o nome parece ser bem fiel\u2026<\/p>\n

Em um r\u00e1pido preview apresentaremos um diagrama simples para esbo\u00e7ar um projeto cujo sua camada de apresenta\u00e7\u00e3o esteja sob o pattern MVVM ( Model-View-Viewmodel \u2013 intr\u00ednseco ao Xamarin ).<\/p>\n

\"mvvm-300x156\"<\/a><\/p>\n

http:\/\/rehansaeed.com\/tag\/windows-phone\/<\/a><\/p>\n

View<\/strong> \u2013 Respons\u00e1vel por definir a estrutura, layout e apar\u00eancia do que os usu\u00e1rios veem na tela. As defini\u00e7\u00f5es das views podem ser feitas tanto em XAML ou Code API, com um code-behind sem l\u00f3gicas de neg\u00f3cio e defini\u00e7\u00f5es de eventos para os objetos visuais (utilizando XAML, ter\u00edamos somente a chamada do m\u00e9todo InitializeComponent e no Code API, a instancia\u00e7\u00e3o e inicializa\u00e7\u00e3o dos objetos visuais, e \u00e0 conex\u00e3o entre a View e a ViewModel atrav\u00e9s da propriedade de BindingContext, \u2026.)<\/p>\n

\u00a0Viewmodel<\/strong> \u2013\u00a0 Atua como um interm\u00e9dio entre a view e a model, e \u00e9 respons\u00e1vel por manipular a l\u00f3gica de neg\u00f3cio. A viewmodel recupera e disponibiliza dados da model de forma que a view possa facilmente manipul\u00e1-los, esta por sua vez fornece Commands<\/strong> que um usu\u00e1rio da aplica\u00e7\u00e3o inicia na view.<\/p>\n

\u00a0Model<\/strong> \u2013 A model no MVVM \u00e9 uma implementa\u00e7\u00e3o do dom\u00ednio da aplica\u00e7\u00e3o que incluem modelo de dados juntos com o neg\u00f3cio e l\u00f3gica de valida\u00e7\u00e3o. Exemplos de modelo de objetos incluem repositories, objetos de neg\u00f3cio, DTO (Data Transfer Objects ), POCOs (\u00a0 Plain Old CLR Objects ), entidades e objetos proxy.<\/p>\n

Agora com as defini\u00e7\u00f5es compreendidas, vamos fluir na constru\u00e7\u00e3o da nossa Sample Application ( Estamos utilizando o Visual Studio Community 2015 \u2013 ( Sensacional ) ).<\/p>\n

Crie um novo projeto em Cross-Platform selecionando o ItemTemplate Blank App ( \u00e0 escolha da abordagem Shared ou Portable fica por sua conta\u2026. ).<\/p>\n

\"project-2-300x193\"<\/p>\n

Com o projeto gerado a nossa Solution ficar\u00e1 da seguinte forma.<\/p>\n

\"solution-300x178\"<\/p>\n

Fazendo um r\u00e1pido entendimento sobre o que ser\u00e1 o \u00a0helper PageContext, \u00a0sabemos que o modelo de naveg\u00e3o utilizado no Xamarin.Forms se basea na interface INavigation membro da classe VisualElement e as mensagens pop-ups ( o Xamarin.Forms as implementa nativamente em cada plataforma ) atrav\u00e9s dos m\u00e9todos DisplayAlert() e DisplayActionSheet presentes na classe Page. De certa forma poder\u00edamos utilizar estes elementos atrav\u00e9s do Code-Behind das nossas classes que representam as Pages da nossa aplica\u00e7\u00e3o, j\u00e1 que os mesmos est\u00e3o presentes nas classes ancestrais; mas, como a inten\u00e7\u00e3o \u00e9 utilizar o modelo MVVM e como dito anteriormente que as Views se conectam \u00e0s ViewModels atrav\u00e9s da propriedade BindingContext ( membro da classe BindableObject ), n\u00e3o faremos chamadas aos m\u00e9todos de navega\u00e7\u00e3o ou mensagens, pois os objetos visuais utilizar\u00e3o o mecanismo de DataBinding com Commands para designar tais a\u00e7\u00f5es. Os commands s\u00e3o membros da ViewModel, e esta por sua vez n\u00e3o possui ou n\u00e3o deve ter refer\u00eancias \u00e0s Pages ( como por exemplo manipular seus objetos visuais), assim mantemos as responsabilidades das ViewModels bem definidas. Tudo soa bastante interessante, mas vai uma pergunta, como n\u00e3o utilizaremos Code-Behind e as ViewModels por n\u00e3o conhecerem as Pages, como utilizaremos a Navega\u00e7\u00e3o ou Mensagens em nossa aplica\u00e7\u00e3o ? Neste ponto entra o PageContext, que garantir\u00e1 a independ\u00eancia entre as Views e ViewModels, utilizando Inje\u00e7\u00e3o de Depend\u00eancia para executar a navega\u00e7\u00e3o e mensagens. Como resultado final nossa aplica\u00e7\u00e3o ficar\u00e1 da seguinte forma:<\/p>\n

Windows Phone:<\/p>\n

\"windows-phone.fw_-180x300\"<\/p>\n

Android:<\/p>\n

\"android.fw_-213x300\"<\/p>\n

iOS:<\/p>\n

\"ios.fw_-169x300\"<\/p>\n

Vamos utilizar em nosso exemplo o cont\u00e2iner de IoC conhecido com Autofac (http:\/\/autofac.org\/<\/a>\u00a0 ), para isto, utilize a op\u00e7\u00e3o Manage Nuget Packages, ou atrav\u00e9s do menu Tools <\/strong>-> Nuget Package Manager<\/strong> -> Package Manager Console<\/strong>.<\/em><\/p>\n

\"package-300x270\"<\/p>\n

\"package-2-300x200\"<\/p>\n

Ap\u00f3s a adi\u00e7\u00e3o do package, vamos iniciar com a cria\u00e7\u00e3o de nossas Pages, a abordagem utilizada ser\u00e1 XAML. Por uma escolha\u00a0pessoal gosto sempre de separar as classes em folders para que fiquem mais leg\u00edveis \u00e0 solution.<\/p>\n

\"final-solution-300x235\"<\/p>\n

Expandindo a folder Pages,\u00a0<\/strong>obtemos os seguintes arquivos:<\/p>\n

\"pages-files-300x101\"<\/p>\n

A folder Context<\/strong>, examinaremos com mais detalhes um pouco mais adiante, j\u00e1 a folder\u00a0Interfaces\u00a0<\/strong>cont\u00eam as interfaces que nossas Pages implementar\u00e3o\u00a0e que ser\u00e3o registradas em nosso container.<\/p>\n

\"pages-interfaces-300x162\"<\/p>\n

public interface IPage\r\n{\r\n        \/\/\/ <summary>\r\n        \/\/\/ Objeto que cont\u00eam propriedades que estar\u00e3o no contexto do Binding.\r\n        \/\/\/ <\/summary>\r\n        object BindingContext { get; set; }\r\n \r\n        \/\/\/ <summary>\r\n        \/\/\/ Exibe uma lista de a\u00e7\u00f5es que permitindo ao usu\u00e1rio sua escolha ( Apresenta\u00e7\u00e3o de forma nativa ).\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <param name=\"title\">T\u00edtulo<\/param>\r\n        \/\/\/ <param name=\"cancel\">Texto apresentado na op\u00e7\u00e3o de cancelar<\/param>\r\n        \/\/\/ <param name=\"destruction\"><\/param>\r\n        \/\/\/ <param name=\"buttons\">Op\u00e7\u00f5es<\/param>\r\n        \/\/\/ <returns><\/returns>\r\n        Task<string> DisplayActionSheet(string title, string cancel, string destruction, params string[] buttons);\r\n \r\n        \/\/\/ <summary>\r\n        \/\/\/ Apresenta uma caixa de di\u00e1logo com um \u00fanica op\u00e7\u00e3o de cancelar.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <param name=\"title\">T\u00edtulo<\/param>\r\n        \/\/\/ <param name=\"message\">Mensagem<\/param>\r\n        \/\/\/ <param name=\"cancel\">Texto exibido no bot\u00e3o de cancelar.<\/param>\r\n        \/\/\/ <returns><\/returns>\r\n        Task DisplayAlert(string title, string message, string cancel);\r\n \r\n        \/\/\/ <summary>\r\n        \/\/\/ Apresenta uma caixa de di\u00e1logo com um \u00fanica op\u00e7\u00e3o de cancelar.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <param name=\"title\">T\u00edtulo<\/param>\r\n        \/\/\/ <param name=\"message\">Mensagem<\/param>\r\n        \/\/\/ <param name=\"accept\">Texto exibido no bot\u00e3o de confirma\u00e7\u00e3o<\/param>\r\n        \/\/\/ <param name=\"cancel\">Texto exibido no bot\u00e3o de cancelar.<\/param>\r\n        \/\/\/ <returns><\/returns>\r\n        Task<bool> DisplayAlert(string title, string message, string accept, string cancel);\r\n        \r\n}<\/pre>\n
A interface IPage<\/strong> apresenta alguns membros como propriedade e m\u00e9todos que as pr\u00f3prias Pages<\/strong> do Xamarin j\u00e1 implementam, estes por sua vez s\u00e3o os membros necess\u00e1rios que precisamos para as chamadas em nosso PageContext.<\/p>\n
public interface IFirstPage : IPage\r\n{\r\n}\r\n\r\npublic interface ISecondPage : IPage\r\n{\r\n}\r\n\r\npublic interface IThirdPage : IPage\r\n{\r\n}<\/pre>\n
Estas s\u00e3o as demais interfaces da folder Pages\/Interfaces que ser\u00e3o\u00a0utilizadas em nosso container. Na estrutura das XAML Pages, temos:<\/p>\n
\n
FirstPage.xaml\r\n\r\n<?xml version=\"1.0\" encoding=\"utf-8\" ?>\r\n<ContentPage xmlns=\"http:\/\/xamarin.com\/schemas\/2014\/forms\"\r\n             xmlns:x=\"http:\/\/schemas.microsoft.com\/winfx\/2009\/xaml\"\r\n             x:Class=\"XamarinSample.Pages.FirstPage\">\r\n  <StackLayout \r\n        VerticalOptions=\"CenterAndExpand\" \r\n        HorizontalOptions=\"CenterAndExpand\"\r\n        BackgroundColor=\"Black\">\r\n    <Image Source=\"microsoftHubRocks.png\" \/>\r\n    \r\n    <StackLayout Padding=\"10\">\r\n     <Label Text=\"First Page \u00bb\" \/>\r\n     <Button Text=\"Go to Second Page\" \r\n            BackgroundColor=\"Green\" Command=\"{Binding GoToSecondPageCommand}\" \/>\r\n    <\/StackLayout>\r\n  <\/StackLayout>\r\n<\/ContentPage>\r\n\r\n\r\nFirstPage.xaml.cs\r\n\r\nnamespace XamarinSample.Pages\r\n{\r\n    public partial class FirstPage : ContentPage, IFirstPage\r\n    {\r\n        #region Constructor\r\n\r\n        public FirstPage()\r\n        {\r\n            InitializeComponent();\r\n        }\r\n\r\n        #endregion\r\n    }\r\n}<\/pre>\n
Conectamos o behavior de Click do nosso Button\u00a0<\/strong>atrav\u00e9s da propriedade Command.<\/strong><\/p>\n<\/div>\n
SecondPage.xaml\r\n\r\n<?xml version=\"1.0\" encoding=\"utf-8\" ?>\r\n<ContentPage xmlns=\"http:\/\/xamarin.com\/schemas\/2014\/forms\"\r\n             xmlns:x=\"http:\/\/schemas.microsoft.com\/winfx\/2009\/xaml\"\r\n             x:Class=\"XamarinSample.Pages.SecondPage\">\r\n  <StackLayout\r\n       VerticalOptions=\"CenterAndExpand\"\r\n       HorizontalOptions=\"CenterAndExpand\"\r\n       BackgroundColor=\"Black\">\r\n    <Image Source=\"microsoftHubRocks.png\" \/>\r\n\r\n    <StackLayout Padding=\"10\">\r\n      <Label Text=\"Second Page \u00bb\" \/>\r\n      <Button Text=\"Go to Third Page\"\r\n             BackgroundColor=\"Green\" Command=\"{Binding GoToThirdPageCommand}\" \/>\r\n    <\/StackLayout>\r\n  <\/StackLayout>\r\n<\/ContentPage>\r\n\r\nSecondPage.xaml.cs\r\n\r\nnamespace XamarinSample.Pages\r\n{\r\n    public partial class SecondPage : ContentPage, ISecondPage\r\n    {\r\n        #region Constructor\r\n\r\n        public SecondPage()\r\n        {\r\n            InitializeComponent();\r\n        } \r\n\r\n        #endregion\r\n    }\r\n}<\/pre>\n
ThirdPage.xaml\r\n\r\n<?xml version=\"1.0\" encoding=\"utf-8\" ?>\r\n<ContentPage xmlns=\"http:\/\/xamarin.com\/schemas\/2014\/forms\"\r\n             xmlns:x=\"http:\/\/schemas.microsoft.com\/winfx\/2009\/xaml\"\r\n             x:Class=\"XamarinSample.Pages.ThirdPage\">\r\n\r\n  <StackLayout\r\n       VerticalOptions=\"CenterAndExpand\"\r\n       HorizontalOptions=\"CenterAndExpand\"\r\n       BackgroundColor=\"Black\">\r\n    <Image Source=\"microsoftHubRocks.png\" \/>\r\n\r\n    <StackLayout Padding=\"10\">\r\n      <Label Text=\"Third Page \u00bb\" \/>\r\n      <Button Text=\"Show Message\"\r\n             BackgroundColor=\"Green\" Command=\"{Binding ShowCustomMessageCommand}\"\/>\r\n    <\/StackLayout>\r\n  <\/StackLayout>\r\n\r\n<\/ContentPage>\r\n\r\n\r\nThirdPage.xaml.cs\r\n\r\nusing Xamarin.Forms;\r\nusing XamarinSample.Pages.Interfaces;\r\n\r\nnamespace XamarinSample.Pages\r\n{\r\n    public partial class ThirdPage : ContentPage, IThirdPage\r\n    {\r\n        #region Constructor\r\n\r\n        public ThirdPage()\r\n        {\r\n            InitializeComponent();\r\n        } \r\n        \r\n        #endregion\r\n    }\r\n}<\/pre>\n
Agora que nossas Pages est\u00e3o constru\u00eddas, vamos visualizar as viewmodels que se encontram na seguinte estrutura:<\/p>\n
\"viewmodel-files\"<\/p>\n
Lembrando que para que haja uma viewmodel a mesma deve implementar a interface\u00a0INotifyPropertyChanged ,\u00a0<\/strong>para que a mesma possa responder \u00e0s notifica\u00e7\u00f5es; para evitar o retrabalho a ViewModelBase se encarrega desta implementa\u00e7\u00e3o.<\/p>\n
  public abstract class ViewModelBase : IViewModel\r\n    {\r\n        #region Properties\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Contexto de navega\u00e7\u00e3o e mensagens pop-up.\r\n        \/\/\/ <\/summary>\r\n        public IPageContext Context { get; private set; }\r\n\r\n        #endregion\r\n\r\n        #region Constructor\r\n\r\n        public ViewModelBase(IPageContext context)\r\n        {\r\n            Context = context;\r\n        }\r\n\r\n        #endregion\r\n\r\n        #region INotifyPropertyChanged members\r\n\r\n        \/\/\/ <summary>\r\n        \/\/ Ocorre quando h\u00e1 mudan\u00e7as em propriedades.\r\n        \/\/\/ <\/summary>\r\n        public event PropertyChangedEventHandler PropertyChanged;\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Notifica \u00e0s modifica\u00e7\u00f5es.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <typeparam name=\"T\">Tipo da Propriedade.<\/typeparam>\r\n        \/\/\/ <param name=\"expression\">Propriedade<\/param>\r\n        protected void RaisedPropertyChanged<T>(Expression<Func<T>> expression)\r\n        {\r\n            var memberExpression = expression.Body as MemberExpression;\r\n            if (memberExpression == null) return;\r\n\r\n            var propertyInfo = memberExpression.Member as PropertyInfo;\r\n            if (propertyInfo == null) return;\r\n\r\n            RaisedPropertyChanged(propertyInfo.Name);\r\n        }\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Notifica \u00e0s modifica\u00e7\u00f5es.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <param name=\"propertyName\">Nome da Propriedade<\/param>\r\n        protected void RaisedPropertyChanged([CallerMemberName] string propertyName = null)\r\n        {\r\n            if (PropertyChanged != null)\r\n                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));\r\n        }\r\n\r\n        #endregion\r\n\r\n    }<\/pre>\n
Seguindo com as demais:<\/p>\n
    public class FirstViewModel : ViewModelBase, IFirstViewModel\r\n    {\r\n        #region Fields\r\n\r\n        private Command _goToSecondPageCommand;\r\n\r\n        #endregion\r\n\r\n        #region Constructor\r\n\r\n        public FirstViewModel(IPageContext context)\r\n            : base(context)\r\n        { }\r\n\r\n        #endregion\r\n\r\n        #region IFistViewModel members\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Commando respons\u00e1vel por navegar para a segunda p\u00e1gina.\r\n        \/\/\/ <\/summary>\r\n        public ICommand GoToSecondPageCommand\r\n        {\r\n            get\r\n            {\r\n                return _goToSecondPageCommand ??\r\n                      (_goToSecondPageCommand = new Command(async() => \r\n                        await Context.NavigateTo<ISecondPage, ISecondViewModel>()));\r\n            }\r\n        } \r\n\r\n        #endregion\r\n    }\r\n\r\n\r\n\r\n public interface IFirstViewModel\r\n    {\r\n        \/\/\/ <summary>\r\n        \/\/\/ Commando respons\u00e1vel por navegar para a segunda p\u00e1gina.\r\n        \/\/\/ <\/summary>\r\n        ICommand GoToSecondPageCommand { get; }\r\n    }<\/pre>\n
 public class SecondViewModel : ViewModelBase, ISecondViewModel\r\n    {\r\n        #region Fields\r\n\r\n        private Command _goToThirdPageCommand;\r\n\r\n        #endregion\r\n\r\n        #region Constructor\r\n\r\n        public SecondViewModel(IPageContext context)\r\n            : base(context)\r\n        { }\r\n\r\n        #endregion\r\n\r\n        #region ISecondViewModel members\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Commando respons\u00e1vel por navegar para a terceira p\u00e1gina.\r\n        \/\/\/ <\/summary>\r\n        public ICommand GoToThirdPageCommand\r\n        {\r\n            get\r\n            {\r\n                return _goToThirdPageCommand ??\r\n                      (_goToThirdPageCommand = new Command(async() =>\r\n                        await Context.NavigateTo<IThirdPage, IThirdViewModel>()));\r\n            }\r\n        }\r\n\r\n        #endregion\r\n    }\r\n\r\n\r\n  public interface ISecondViewModel\r\n    {\r\n        \/\/\/ <summary>\r\n        \/\/\/ Commando respons\u00e1vel por navegar para a terceira p\u00e1gina.\r\n        \/\/\/ <\/summary>\r\n        ICommand GoToThirdPageCommand { get; }\r\n    }<\/pre>\n
public class ThirdViewModel : ViewModelBase, IThirdViewModel\r\n{\r\n        #region Fields\r\n\r\n        private Command _showCustomMessageCommand;\r\n\r\n        #endregion\r\n\r\n        #region Constructor\r\n\r\n        public ThirdViewModel(IPageContext context)\r\n            : base(context)\r\n        { }\r\n\r\n        #endregion\r\n\r\n        #region IThirdViewModel members\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Commando respons\u00e1vel por exibir mensagem.\r\n        \/\/\/ <\/summary>\r\n        public ICommand ShowCustomMessageCommand\r\n        {\r\n            get\r\n            {\r\n                return _showCustomMessageCommand ??\r\n                      (_showCustomMessageCommand = new Command(async() =>\r\n                      {\r\n                          await Context.ShowMessage(\"Mensagem\", \"PageContext com mensagem.\", \"Ok\");\r\n                      }));\r\n            }\r\n        }\r\n\r\n        #endregion\r\n    }\r\n\r\n\r\n\r\n public interface IThirdViewModel\r\n    {\r\n        \/\/\/ <summary>\r\n        \/\/\/ Commando respons\u00e1vel por exibir mensagem.\r\n        \/\/\/ <\/summary>\r\n        ICommand ShowCustomMessageCommand { get; }\r\n    }<\/pre>\n
Podemos observar que as viewmodels n\u00e3o possuem instancias das Pages, temos somente uma propriedade chamada PageContext que \u00e9 setada por inje\u00e7\u00e3o do container. Desta forma temos o PageContext apresentado na seguinte estrutura:<\/p>\n
\"pagecontext-files-300x89\"<\/p>\n
A interface IPageContext exp\u00f5e os\u00a0membros para Navigation e Messaging:<\/p>\n
 public interface IPageContext\r\n    {\r\n        \/\/ <summary>\r\n        \/\/ Obt\u00e9m a IPage atual.\r\n        \/\/ <\/summary>\r\n        IPage CurrentPage { get; }\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Navega para uma TPage conectada a uma TViewModel.\r\n        \/\/\/ Modelo de navega\u00e7\u00e3o baseado na NavigationStack.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <typeparam name=\"TPage\">Nova p\u00e1gina<\/typeparam>\r\n        \/\/\/ <typeparam name=\"TViewModel\">Viewmodel<\/typeparam>\r\n        \/\/\/ <returns><\/returns>\r\n        Task NavigateTo<TPage, TViewModel>()\r\n           where TPage : class, IPage\r\n           where TViewModel : class;\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Navega para uma TPage conectada a uma TViewModel, fazendo uma inje\u00e7\u00e3o do valor para uma propriedade\r\n        \/\/\/ desta viewmodel.\r\n        \/\/\/ Modelo de navega\u00e7\u00e3o baseado na NavigationStack.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <typeparam name=\"TPage\">Nova p\u00e1gina<\/typeparam>\r\n        \/\/\/ <typeparam name=\"TViewModel\">Viewmodel<\/typeparam>\r\n        \/\/\/ <param name=\"property\">Proprieda<\/param>\r\n        \/\/\/ <param name=\"value\">Valor<\/param>\r\n        \/\/\/ <returns><\/returns>\r\n        Task NavigateTo<TPage, TViewModel>(Expression<Func<object>> property, object value)\r\n            where TPage : class, IPage\r\n            where TViewModel : class;\r\n        \r\n        \/\/\/ <summary>\r\n        \/\/\/ Navega para uma TPage conectada a uma TViewModel.\r\n        \/\/\/ Modelo de navega\u00e7\u00e3o baseado na ModalStack.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <typeparam name=\"TPage\">Nova p\u00e1gina<\/typeparam>\r\n        \/\/\/ <typeparam name=\"TViewModel\">Viewmodel<\/typeparam>\r\n        \/\/\/ <returns><\/returns>\r\n        Task ModalNavigateTo<TPage, TViewModel>()\r\n           where TPage : class, IPage\r\n           where TViewModel : class;\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Exibe uma lista de a\u00e7\u00f5es que permitindo ao usu\u00e1rio sua escolha ( Apresenta\u00e7\u00e3o de forma nativa ).\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <param name=\"title\">T\u00edtulo<\/param>\r\n        \/\/\/ <param name=\"cancel\">Texto apresentado na op\u00e7\u00e3o de cancelar<\/param>\r\n        \/\/\/ <param name=\"destruction\"><\/param>\r\n        \/\/\/ <param name=\"buttons\">Op\u00e7\u00f5es<\/param>\r\n        \/\/\/ <returns><\/returns>\r\n        Task<string> ShowConfirmationMessage(string title, string cancel, string destruction, params string[] buttons);\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Apresenta uma caixa de di\u00e1logo com um \u00fanica op\u00e7\u00e3o de cancelar.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <param name=\"title\">T\u00edtulo<\/param>\r\n        \/\/\/ <param name=\"message\">Mensagem<\/param>\r\n        \/\/\/ <param name=\"cancel\">Texto exibido no bot\u00e3o de cancelar.<\/param>\r\n        \/\/\/ <returns><\/returns>\r\n        Task ShowMessage(string title, string message, string cancel);\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Apresenta uma caixa de di\u00e1logo com um \u00fanica op\u00e7\u00e3o de cancelar.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <param name=\"title\">T\u00edtulo<\/param>\r\n        \/\/\/ <param name=\"message\">Mensagem<\/param>\r\n        \/\/\/ <param name=\"accept\">Texto exibido no bot\u00e3o de confirma\u00e7\u00e3o<\/param>\r\n        \/\/\/ <param name=\"cancel\">Texto exibido no bot\u00e3o de cancelar.<\/param>\r\n        \/\/\/ <returns><\/returns>\r\n        Task<bool> ShowMessage(string title, string message, string accept, string cancel);\r\n\r\n    }<\/pre>\n
E sua implementa\u00e7\u00e3o:<\/p>\n
  public class PageContext : IPageContext\r\n    {\r\n\r\n        #region Fields\r\n\r\n        private IComponentContext _componentContext;\r\n        private IPage _page;\r\n\r\n        #endregion\r\n\r\n        #region Properties\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Obt\u00e9m a IPage atual.\r\n        \/\/\/ <\/summary>\r\n        public IPage CurrentPage\r\n        {\r\n            get\r\n            {\r\n                var xamarinPage = _page as Page;\r\n                if (xamarinPage == null) return null;\r\n\r\n                var stack = xamarinPage.Navigation.NavigationStack;\r\n\r\n                return stack.Any() ? stack.Last() as IPage : _page;\r\n            }\r\n        }\r\n\r\n        #endregion\r\n\r\n        #region Constructor\r\n\r\n        public PageContext(IComponentContext componentContext, IPage page)\r\n        {\r\n            _componentContext = componentContext;\r\n            _page = page;\r\n        }\r\n        #endregion\r\n\r\n        #region Methods\r\n\r\n        #region Navigation\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Navega para uma TPage conectada a uma TViewModel.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <typeparam name=\"TPage\">Nova p\u00e1gina<\/typeparam>\r\n        \/\/\/ <typeparam name=\"TViewModel\">Viewmodel<\/typeparam>\r\n        \/\/\/ <returns><\/returns>\r\n        public async Task NavigateTo<TPage, TViewModel>()\r\n            where TPage : class, IPage\r\n            where TViewModel : class\r\n        {\r\n            \/\/Resolvendo depend\u00eancias.\r\n            var newPage = _componentContext.Resolve<TPage>();\r\n            var viewmodel = _componentContext.Resolve<TViewModel>();\r\n\r\n            if (newPage != null && viewmodel != null)\r\n            {\r\n                \/\/Conectando a Nova View com a Viewmodel.\r\n                newPage.BindingContext = viewmodel;\r\n                \/\/Empilhando a p\u00e1gina atual.\r\n                await ((Page)CurrentPage).Navigation.PushAsync(newPage as Page);\r\n            }\r\n        }\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Navega para uma TPage conectada a uma TViewModel, fazendo uma inje\u00e7\u00e3o do valor para uma propriedade\r\n        \/\/\/ desta viewmodel.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <typeparam name=\"TPage\">Nova p\u00e1gina<\/typeparam>\r\n        \/\/\/ <typeparam name=\"TViewModel\">Viewmodel<\/typeparam>\r\n        \/\/\/ <param name=\"property\">Proprieda<\/param>\r\n        \/\/\/ <param name=\"value\">Valor<\/param>\r\n        \/\/\/ <returns><\/returns>\r\n        public async Task NavigateTo<TPage, TViewModel>(Expression<Func<object>> property, object value)\r\n            where TPage : class, IPage\r\n            where TViewModel : class\r\n        {\r\n            \/\/Resolvendo depend\u00eancias.\r\n            var newPage = _componentContext.Resolve<TPage>();\r\n            var viewmodel = _componentContext.Resolve<TViewModel>();\r\n\r\n            if (newPage != null && viewmodel != null)\r\n            {\r\n                \/\/Conectando a Nova View com a Viewmodel.\r\n                newPage.BindingContext = viewmodel;\r\n                \/\/Definindo valor para uma propriedade da Viewmodel.\r\n                SetPropertyValue<TViewModel>(property.Body, viewmodel, value);\r\n                \/\/Empilhando a p\u00e1gina atual.\r\n                await ((Page)CurrentPage).Navigation.PushAsync(newPage as Page);\r\n            }\r\n        }\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Navega para uma TPage conectada a uma TViewModel.\r\n        \/\/\/ Modelo de navega\u00e7\u00e3o baseado na ModalStack.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <typeparam name=\"TPage\">Nova p\u00e1gina<\/typeparam>\r\n        \/\/\/ <typeparam name=\"TViewModel\">Viewmodel<\/typeparam>\r\n        \/\/\/ <returns><\/returns>\r\n        public async Task ModalNavigateTo<TPage, TViewModel>()\r\n            where TPage : class, IPage\r\n            where TViewModel : class\r\n        {\r\n            \/\/Resolvendo depend\u00eancias.\r\n            var newPage = _componentContext.Resolve<TPage>();\r\n            var viewmodel = _componentContext.Resolve<TViewModel>();\r\n\r\n            if (newPage != null && viewmodel != null)\r\n            {\r\n                \/\/Conectando a Nova View com a Viewmodel.\r\n                newPage.BindingContext = viewmodel;\r\n                \/\/Empilhando a p\u00e1gina atual.\r\n                await ((Page)CurrentPage).Navigation.PushModalAsync(newPage as Page);\r\n            }\r\n        }\r\n\r\n        private void SetPropertyValue<T>(Expression property, object root, object value)\r\n        {\r\n            var member = property as MemberExpression;\r\n            if (member == null) return;\r\n\r\n            var propertyInfo = member.Member as PropertyInfo;\r\n            if (propertyInfo == null) return;\r\n\r\n            var propertySetter = root.GetType()\r\n                                .GetTypeInfo()\r\n                                .DeclaredProperties\r\n                                .First(c => c.Name.Equals(propertyInfo.Name, StringComparison.OrdinalIgnoreCase));\r\n\r\n            if (propertySetter != null)\r\n                propertySetter.SetValue(root, value);\r\n        }\r\n\r\n        #endregion\r\n\r\n        #region Messaging\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Exibe uma lista de a\u00e7\u00f5es que permitindo ao usu\u00e1rio sua escolha ( Apresenta\u00e7\u00e3o de forma nativa ).\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <param name=\"title\">T\u00edtulo<\/param>\r\n        \/\/\/ <param name=\"cancel\">Texto apresentado na op\u00e7\u00e3o de cancelar<\/param>\r\n        \/\/\/ <param name=\"destruction\"><\/param>\r\n        \/\/\/ <param name=\"buttons\">Op\u00e7\u00f5es<\/param>\r\n        \/\/\/ <returns><\/returns>\r\n        public async Task<string> ShowConfirmationMessage(string title, string cancel, string destruction, params string[] buttons)\r\n        {\r\n            var result = await CurrentPage.DisplayActionSheet(title, cancel, destruction, buttons);\r\n            return result;\r\n        }\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Apresenta uma caixa de di\u00e1logo com um \u00fanica op\u00e7\u00e3o de cancelar.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <param name=\"title\">T\u00edtulo<\/param>\r\n        \/\/\/ <param name=\"message\">Mensagem<\/param>\r\n        \/\/\/ <param name=\"cancel\">Texto exibido no bot\u00e3o de cancelar.<\/param>\r\n        \/\/\/ <returns><\/returns>\r\n        public async Task ShowMessage(string title, string message, string cancel)\r\n        {\r\n            await CurrentPage.DisplayAlert(title, message, cancel);\r\n        }\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Apresenta uma caixa de di\u00e1logo com um \u00fanica op\u00e7\u00e3o de cancelar.\r\n        \/\/\/ <\/summary>\r\n        \/\/\/ <param name=\"title\">T\u00edtulo<\/param>\r\n        \/\/\/ <param name=\"message\">Mensagem<\/param>\r\n        \/\/\/ <param name=\"accept\">Texto exibido no bot\u00e3o de confirma\u00e7\u00e3o<\/param>\r\n        \/\/\/ <param name=\"cancel\">Texto exibido no bot\u00e3o de cancelar.<\/param>\r\n        \/\/\/ <returns><\/returns>\r\n        public async Task<bool> ShowMessage(string title, string message, string accept, string cancel)\r\n        {\r\n            var result = await CurrentPage.DisplayAlert(title, message, accept, cancel);\r\n            return result;\r\n        }\r\n\r\n        #endregion\r\n\r\n        #endregion\r\n    }<\/pre>\n
Vamos detalhar nossa PageContext:<\/p>\n
    \n
  • A propriedade de CurrentPage retorna a IPage atual;<\/li>\n
  • O construtor da classe PageContext, recebe IComponentContext, que \u00e9 o pr\u00f3pria inst\u00e2ncia do container, para que possamos recuperar as implementa\u00e7\u00f5es tardiamente, e recebemos tamb\u00e9m uma IPage que \u00e9 inserida como a primeira p\u00e1gina da Stack de navega\u00e7\u00e3o.<\/li>\n
  • Nos m\u00e9todos de navega\u00e7\u00e3o recebemos nos placeholders uma page (TPage) e uma viewmodel (TViewmodel), ambas s\u00e3o\u00a0refer\u00eancias para as inst\u00e2ncias recuperadas no container, as conectamos pelo BindingContext da Page e em seguida utilizamos o sistema de Navega\u00e7\u00e3o do Xamarin.Forms;<\/li>\n
  • O m\u00e9todo SetPropertyValue\u00a0<\/strong>\u00e9 utilizado para setarmos uma propriedade da viewmodel.<\/li>\n
  • Por final temos os m\u00e9todos de Messaging que s\u00e3o um wrapper para os m\u00e9todos utilizados no Xamarin.Forms que est\u00e3o presentes dentro de Page<\/strong>.<\/li>\n<\/ul>\n
    Desta forma em nossas\u00a0implementa\u00e7\u00f5es nas viewmodels temos o Context chamando o m\u00e9todo de NavigateTo passando a interface da Page e Viewmodel, que ser\u00e3o resolvidas pelo container e o m\u00e9todo ShowMessage para apresenta\u00e7\u00e3o das mensagens.<\/p>\n
    public ICommand GoToThirdPageCommand\r\n{\r\n   get\r\n   {\r\n       return _goToThirdPageCommand ??\r\n             (_goToThirdPageCommand = new Command(async() =>\r\n             await Context.NavigateTo<IThirdPage, IThirdViewModel>()));\r\n   }\r\n}<\/pre>\n
      \/\/\/ <summary>\r\n  \/\/\/ Commando respons\u00e1vel por exibir mensagem.\r\n  \/\/\/ <\/summary>\r\n  public ICommand ShowCustomMessageCommand\r\n  {\r\n      get\r\n      {\r\n           return _showCustomMessageCommand ??\r\n                  (_showCustomMessageCommand = new Command(async() =>\r\n                  {\r\n                      await Context.ShowMessage(\"Mensagem\", \"PageContext com mensagem.\", \"Ok\");\r\n                   }));\r\n      }\r\n  }<\/pre>\n
    Antes de finalizarmos vamos \u00e0 configura\u00e7\u00e3o do nosso container.<\/p>\n
     public class AutofacConfig\r\n    {\r\n\r\n        #region Fields\r\n\r\n        private static IContainer _container;\r\n\r\n        #endregion\r\n\r\n        #region Properties\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Recupera uma page do cont\u00e2iner.\r\n        \/\/\/ <\/summary>\r\n        public static TPage GetPage<TService, TPage>()\r\n            where TService : IPage\r\n            where TPage : class\r\n        {\r\n            if (_container == null || !_container.IsRegistered<TService>())\r\n                return default(TPage);\r\n\r\n            var pageContext = _container.Resolve<IPageContext>();\r\n            return (TPage)pageContext.CurrentPage;\r\n        }\r\n\r\n        #endregion\r\n\r\n        #region Methods\r\n\r\n        \/\/\/ <summary>\r\n        \/\/\/ Respons\u00e1vel por registras em depend\u00eancias ( Autofac ).\r\n        \/\/\/ <\/summary>\r\n        public static void ConfigureContainer()\r\n        {\r\n            var builder = new ContainerBuilder();\r\n\r\n            \/\/Pages\r\n            builder.Register(c => new FirstPage()).As<IFirstPage>()\r\n                .OnActivated(e => e.Instance.BindingContext = e.Context.Resolve<IFirstViewModel>());\r\n            builder.RegisterType<SecondPage>().As<ISecondPage>();\r\n            builder.RegisterType<ThirdPage>().As<IThirdPage>();\r\n\r\n            \/\/Viewmodels\r\n            builder.RegisterType<FirstViewModel>().As<IFirstViewModel>();\r\n            builder.RegisterType<SecondViewModel>().As<ISecondViewModel>();\r\n            builder.RegisterType<ThirdViewModel>().As<IThirdViewModel>();\r\n\r\n            \/\/PageContext\r\n            builder.Register((c, p) => new PageContext(c.Resolve<IComponentContext>(), c.Resolve<IFirstPage>()))\r\n                .As<IPageContext>()\r\n                .SingleInstance();\r\n\r\n            _container = builder.Build();\r\n        }\r\n\r\n        #endregion\r\n    }<\/pre>\n
    O m\u00e9todo GetPage nos auxilia na inicializa\u00e7\u00e3o do PageContext e definir \u00e0 Page de inicializa\u00e7\u00e3o na classe Application.<\/p>\n
    Lembre-se de inicializar a configura\u00e7\u00e3o do container.<\/p>\n
    Este helper\u00a0n\u00e3o contempla todas as poss\u00edveis chamadas e navega\u00e7\u00e3o do Xamarin.Forms, mas para isso basta implement\u00e1-los de acordo com \u00e0 necessidade. A utiliza\u00e7\u00e3o do PageContext \u00e9 interessante pois inibe a utiliza\u00e7\u00e3o da Page e seus membros, o que poderia deixar as viewmodels completamente amarradas. Espero que curtam PageContext,\u00a0<\/strong>sauda\u00e7\u00f5es MXCursos<\/strong>\u00a0!<\/p>\n","protected":false},"excerpt":{"rendered":"
    Oi pessoal do MX Cursos, hoje vamos falar de PageContext, algu\u00e9m j\u00e1 ouviu falar ? N\u00e3o? Ent\u00e3o, este foi um termo que utilizei j\u00e1 que estaremos tratando no pr\u00f3prio contexto das Pages no Xamarin.Forms e o nome parece ser bem fiel\u2026 Em um r\u00e1pido preview apresentaremos um diagrama simples para esbo\u00e7ar um projeto cujo sua […]<\/p>\n","protected":false},"author":152,"featured_media":3014,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[678],"tags":[],"class_list":["post-2998","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-desenvolvimento"],"_links":{"self":[{"href":"https:\/\/www.mxcursos.com\/blog\/wp-json\/wp\/v2\/posts\/2998","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.mxcursos.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.mxcursos.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.mxcursos.com\/blog\/wp-json\/wp\/v2\/users\/152"}],"replies":[{"embeddable":true,"href":"https:\/\/www.mxcursos.com\/blog\/wp-json\/wp\/v2\/comments?post=2998"}],"version-history":[{"count":0,"href":"https:\/\/www.mxcursos.com\/blog\/wp-json\/wp\/v2\/posts\/2998\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.mxcursos.com\/blog\/wp-json\/wp\/v2\/media\/3014"}],"wp:attachment":[{"href":"https:\/\/www.mxcursos.com\/blog\/wp-json\/wp\/v2\/media?parent=2998"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.mxcursos.com\/blog\/wp-json\/wp\/v2\/categories?post=2998"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.mxcursos.com\/blog\/wp-json\/wp\/v2\/tags?post=2998"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}