The Xamarin Show | Episode 10: Prism for Xamarin.Forms with Brian Lagunas

welcome back everyone to the xamarin show I'm your host James Monson magno and with me friend of the show brian lagunas how's it going Brian it's going great man thanks for having me I always love coming out to Redmond and love being on anything you do well I'm super I'm super excited because I had you come to my user group not too long ago you spoke at evolved good friends I'm always excited of all the cool stuff that you're doing but first people may not know who you are which is a shame so I'll give you a few minutes and just kind of like let people know who you are who's Brian lagunas so Brian lagunas is some guy who lives in Boise Idaho so I work for a company called m4 districts and your company yeah we write some great UI controls that everyone should be using so definitely give those a shot I like to say I run the Boise office what that means as I work from home I do a lot of things that infra dist 6 I primarily manage all the you WP WPF iOS Android xamarin xamarin forms products and then I traveled the world speaking at min events like I speak at yours yeah and I also am known for running prism so prism so I've been a bit of developer for you know over a decade now and I've heard prism a lot in the past because I fell in love with mvvm when I started I guess Silverlight actually and then dub PF and then now obviously with with all the Windows Phone devices and uwp and I was Ameren forms like the the MVVM pattern that I fell in love with you know when I worked at cantering printer software you know extends now to mobile devices that kind of everywhere so what is prism in general don't the actual core of what prism where it started but it's actually kind of evolved as with other platform so prism initially started with the Microsoft patterns and practices team right so they wrote it for WPF that's a first generation I believe in 2008 and you know historically it already became a little baggage of being the mvvm framework but technically for WPF it was never an mvvm framework that didn't even ship with a view model base class it really didn't care yeah it was all about building modular applications using best practices and design patterns that developers should be using anyways mm-hmm you know in any app they build and it's just more along guidance like this is how you should be doing it here's all the problems you run into in a production app we help you solve those here so you don't reinvent the wheel ya know not long ago Microsoft said you know what we're gonna put the P and P team on Azure and that's when the P and P team said hey Bryan you've been with us for a long time you're passionate about it why don't you take it over so you took over a president took all yours and it's all open source all open all open source parties not net foundation I like that it's on github and we're moving it forward so we're working on a version for xamarin forms awesome so if people don't know what the dotnet foundation is and you can correct me if I'm wrong but essentially then we announce it maybe a year and a half ago two years ago or so it's a basically combination of tons of great open-source projects that not only Microsoft open-source xamarin open-source but also people in the community support so companies such as you know infra distich such as yourself that we've come together and said these are some amazing libraries that anyone in the dotnet ecosystem should be taking advantage of be contributing to and there's tons of stuff in there yeah it really gave me a bit of the dotnet foundation just google it you're gonna find all these amazing libraries such as prism and now you said specifically around you have you have prism for a bunch of different platforms yes and seeing that xamarin forms has an mb vm framework built in and prism is not an mvvm framework right it seems like that would be a good complement to the farm well actually so remember what I said how presumes kind of evolved huh yeah well now prism is more of an mvvm framework okay specifically in xamarin forms and apparently due to the nature of the platform so for example you know prism for xamarin forms relies on mvvm period to work yeah you know so unlike WPF you don't have to use mvvm chair in zaman forms you have to use mvvm and honestly you should be anyways I mean if you're not comfortable Akande your views sometimes it's okay to mix them around I'm okay sometimes yes in a library but sometimes it's just really nice to make sure you have that that in a way that's very important not only testability but you're more likely to be able to share your code and then there's a whole maintenance aspect and when you use a framework any framework not just prism but you essentially create a standard way of developing apps so it's easy to bring on new talent right you hire a new developer you train them the framework and how you use how you write your apps and they're up to speed much faster every app is the same you know context switching for developers sucks yeah you know but it's every app is similar and familiar you hit the ground running like your navigation paradigms how you're you're you're saying like this is my view model to my view these are my models to my that's how I do my data access and then it's kind of an important thing especially for onboarding before I join Zaman I was using a lot of mvvm cross which is a big mvvm framework for traditional xamarin ios and android kind of brings data binding into xamarin ios and android where examine forms already has data bindings so you don't even have to worry about data bind that's given to you right and there's commanding set up which can be improved for sure and there's some commands but there's always room for improvement especially as as a third-party library you can evolve your library whereas Ameren forms is the core package and you can build on top of it and add and spice it up for you keep saying we were trying over talking earlier it's just like all about productivity right yes I started creating template packs like years ago not only for remember our chromite cream a very first xamarin plugin and I was creating every project manually and I was modifying all the CS projects I'm like yeah we're going to can't I spent an entire day and I was like this is it I'm gonna put in all my transforms all this stuff I say file a new plugin and Wow and I was like you know what be even better if it just generate my new get packin my new spec for me you know I was like oh I can do that too done I was like if I want to create a plug-in I'm up and running in a minute like that'sthat's awesome so prison for Zam reforms all about productivity adding some best practices I assume exactly to it - and some stuff so what is in what is in prison for Zephyr that's our topic today prison for exam report okay so one thing you realize is that prism doesn't do anything that same word forms doesn't allow you to do okay essentially it abstracts away all these stuff that I don't believe you should be developing right for example I'll use a small example navigation sure right navigation is aim reforms to pins on a page instance yeah so if you want to navigate from a view model good luck yeah right but prism extracts that complexity away to where you can accomplish navigating from within view models without the tight coupling to views okay it allows you to share not only in xamarin forms that you could share that code to other platforms a native uwp or WPF and sure for those three people still doing Silverlight you know if you got to do it you got to do it you got to do it so this problem around navigation maybe I get asked this a lot from developers even I personally question myself sometimes is so should I like pass it a navigation instance - my my my view model should I just register a click button you know in my code behind of the zamel or should I use like messaging Center and then pub/sub stuff and and and and sometimes in my apps are all kind of a combination of things again which which as an someone coming into the code for the first time it can be a little bit challenging so navigation that's built in what else do we got so we got navigation we have mvvm so essentially when I say in the view it BVM is quite simple okay I can explain it like two seconds yeah finding context instance of a class connect them mvvm you're done yeah anything else is not related mvvm like navigation commanding sure all those things are problems you have to solve regardless of a platform you use if you use code behind you have to figure those out yeah right so mvvm is just a design pattern now the way that prism does is we use what's called a view model locator yeah but it's not like you normally would see a traditional view model okay so traditional view mall locators are static yeah I hate static you will you will not see static in my code because it's hard to test yeah and it's hard to be portal it's good for design yeah that for testing it it's it's productive you can get stuff done and do some you know write your app quickly but it you're the peach in some corners okay so we actually use an attached property and a convention based approach so you just add an attached property to your view and based on convention we will go find your view model create a floor you set the binding context and you're done like so you don't have a static class that you have to keep opening for modification oh yeah right add a new property go back into your view yeah you know static resource all that binding stuff you don't have to do that interesting very cool I like that alright well let's jump into the code I'm super excited to see what the advancements of prisons been doing we got you up on the big screen I always like to ask everyone like where do I get started like what do I do okay where am I going like help me we're gonna have it in the show notes obviously but what do I do here anything so it is open source yeah so you want to go to github.com slash prison library slash prison this is all the source code and if you were to go back to the prison library repo we have some samples and stuff we're working on but this is what you really care about we have Docs which is good like Docs but like most projects Doc's are always kind of the last thing we touched right yeah but we have you know integrated build servers so we use out there you can see the build status they can uh you know what if you want to help support prism because it is open-source and I do this in my free time you can go watch my Pluralsight courses and then it tells you all about the new get packages right now I just shipped a preview of 6.3 which has some some great updates in it and all the different new gates that we have and of course I want to talk about the prism template pack oh cool so template packs Alice then big fan of template packs so if you're getting started with prism if you're xamarin studio or Visual Studio install the prism template pack because it's gonna help you get started extremely quickly so it's a mer studio Oh video add in check that out yeah that's cool so now you don't get too many cool stuff in xamarin studio that you do in Visual Studio but hopefully not yet not yet hopefully as the IDE evolves more feature capabilities can be added to it very cool but yeah and then of course with parler net foundation so docks we are in the process of moving to read the docs so if we go to the source code here you'll see a documentation this is the old yeah we have a new docs folder we're moving everything into and now you just go to prison library Docs yeah right and that's where the docs are and then on the visual studio gallery prism template pack I'll do a quick demo of that but it just comes with snippets item templates project templates and one of the most my most favorite dating ball is a little project wizard for creating standard forms apps yeah because by default but it really annoys me is I don't want to create like seven projects yeah you know especially have been doing a demo for user group I don't know what the Android one just for demo sake right so just give me that one well you can select those yeah that's nice because the default ones they'll set up and they'll give you the it what the default one zero says hey what's installed on your machine I've every STK on my machine right but I don't necessarily I do android iOS and you WP or maybe there's Android and iOS based on whatever I'm developing for which is kind of nicer you say oh I want these and you know if you have to support older Windows 8 one devices they're there right like I can probably say with confidence that store 8.1 and Phone 8.1 will probably be removed from the prism template pack in the next major release there you go now with the you know we have connected next week some good announcements coming out you can expect prism to evolve with Visual Studio now it's kind of nice and it's all open source so as an xamarin forms is open source so you can see what xamarin forms is doing in the wild you can see some some interesting mac OS and tos bridges and things like that right you know what is one of these one of these developers do I know let's get ready which is cool yep so you know I figured today we would talk about navigation specifically okay because you know there's a lot to prism yeah and I wish I had all day to spend with you but we got to focus on something mm-hmm so what I want to concentrate on today is just kind of going over the basics of navigation how it kind of works right yeah so navigation is prism is quite powerful and the way we the reason it is powerful is because we standardize on a URI based navigation schema kinda like a website if you will kind like a website right so you technically navigate to keys okay and it could be anything now here I'm in the app dot sam'l nazi s of my prism application and the way i created that is if i go i have the presume template pack install can we come in look at them like so if you never installed a template pack and got Visual Studio Gallery it's under what tools extensions yeah so if you just go tools exten and updates it's hidden because there's a thousand ways to get things yeah it's crazy go to online yep and then just search for prism template pack and then when it gets installed you'll see it right down here boom right there yeah so if you're if you're like you know what you know Brian I like I installed the new you sell the stuff that you're talking about you got to install these separately yes it'll restart visual studio and I'll install these templates I have some for plugins or some for xamarin Android big fan of template packs yeah and make sure this is automatically updated that way every time I push a new update you get it automatically that's nice that's a nice feature that they added in there they don't ya get notified all the time so that over these games though I will say the automatic update always breaks my snippets Wow every time I upgrade my snippets break so I gotta go fix him now but I'm working with the with Microsoft of the team to get that fixed so you guys you got code snippets item tumbles project templates and let's look at the project templates yes okay so now now I have this installed so you're gonna go file new under c-sharp I don't have VB now if the community wants VB they can create them I don't give a sharp support I don't have an F sharp template now yet so that's our community VB community yep I accept yours but you'll see I have a prism category okay WPF xamarin forms and you go create a new prism unity application and so you'll say oh what's unity well you need a DI container right you're not thinking is this is not gonna put a gaming framework it's not a gaming engine okay okay it's it's essentially a DI container and prism relies on di to function dependency injection injection so the idea there and you can correct me if I'm wrong it's different than the service locator and a service locator is like had I've registered this thing go find this class go find this interface dependency injection is more like I have a constructor that takes in these three parameters yes it will figure it out for you register things and it just kind of passes things yes and if any of those dependencies had dependencies it'll it would create those as well and pass them down the chain extremely testable now very maintainable extensible I mean you name it you know you usually don't see that in my code just because when I open source projects I don't like - I don't like magical things working but ya know di and depending is very popular so prism supports a number of di containers and for the ones we don't out-of-the-box you can add easily by yourself but I only have a template for unity for now that your favorite you won't put a favorite wouldn't it I've only I've been using it a long time so I'm comfortable is unity for in patterns and practices it is okay I've been using it since you know a while now back when I was doing a lot of WPF stuff so it just kind of stuck with me yeah you know but uh uni may not be the fastest for salmon forms sure I think there's some other containers are faster and I'll create templates for those okay gotcha but this is what I have now so you'll just double click on that and then you would pick your platform yep and then it would create those projects for you so you would just check uncheck that I like that a lot but we don't want to sit here and watch all those NuGet packages load right so I have an app that I just did file new and this is what I got cool so one thing to notice is that we haven't our application now implements prism application which I assume is a xamarin forms application yes loss it's a salmon forms application plus some some print spice right and all this application does is it creates initializes all the services that you'll be using for you automatically okay okay so and when you do this you're gonna get an uninitialized method and a register types okay now uninitialized basically replaces your seat or you you will never you see the seat or here yeah you won't ever really put code in there so in a normal exam reforms constructor in your app you say main page equals new vein peso uninitialized as hey my app is initializing for the first time right so as you could see this project has not done sam'l you know so we have to put our initialize component yep before we do any type of navigation permits okay so as you can see we have a navigation service property on this application yep and we're navigating to something called main page and the navigation service is the the prism navigation service yes which I assume under the hood is is going to spice up in a did the same reforms navigate exactly yeah so this is built on top of Zaman forms navigation framework yeah and it just makes it easier to use okay having eight to main page so the one of the important concepts to understand here is that you have to register pages for navigation now in the initial design I was thinking well I can just reflect through all the pages and do it for you sure but I decided against that for a number of reasons but so all you have to do and no matter what container you use the API is the same you just say register type for navigation and pass in the page okay now the convention says as the key I'm gonna use the name of the page okay but it doesn't have to be that way you can whoops you can add your own you know my special key here okay you just have to make sure that you're navigating to the correct key identified essentially it's a name off right yeah see by default kind of like when I do on property change and I do I just you know I'm property change it takes in my is busy yes the sound those names back and I can I can have it be whatever I want and notify the UI anything I want I'm notifying hey listen this key is associated with the key so your your little the parameter that you pass in so the register type for navigation you've this is the main page which by default will use the name of yes main page but you can say ah whatever it is exactly which is kind of nice because you know I was doing the Evolve application and I did app links right so when you went to the website that website you were all I had to parse out things I had to do a bunch of stuff where really it's just like a static URL exactly that could so could have used yeah I'll get a little head on myself but remember I said navigation is URI based yeah so even though I'm passing in the string behind the scenes in the code it converts it to a URI now by default we use relative URI navigation yeah relative means wherever I call navigate from navigate async I'm navigating relative to where uncalled it okay so a fun on a master-detail page and I say master needs detail page view model yeah in there I call navigate I'm navigating relative to the master detail okay so that means the detail will update the detail updates okay we also have the absolute navigation an absolute URI which anywhere in your app if you use an absolute URI it's essentially saying main page equals new whatever new it I reset your navigation stick with an absolute Oh interesting so your navigation stacks reset but by default its relative relative which is kind of like kind of reg the normal xamarin forms actually some pages across exactly okay so the reason I bring that up is your your mentioning app links since we're here talking about navigation what was that called on app link requester see you are right so for those thinking about you know how do i parse this you know if you get a uri from your your web page you have to open your app how do you manage that well because of prism we just say navigate async URI mm-hmm and you'd want to do anything else president do it for you and you'll see where this gets really powerful here in a little bit okay okay so let's take a quick look at the main page and this was all set up for me my main page I guess up in here a little bit of data binding I got my view models folder and with the main page view model now is the naming it as the naming required to be the same summer when I was using some other frameworks in the past you know it was very important that main page refer to main page view model and like everything was very much the same name is naming convention really important yes so naming convention it does usually use a default naming convention okay so let's let's talk about the Amana locator so we have our attached property here if you mana locator auto wire view model equals true yeah that says I'm gonna use a convention to go find my view model and marry everything up and everything happens magically right that's all you have to do now the convention says that my views are gonna be the views namespace okay my view models are gonna be at a view models namespace okay and the name of the view model will be page plus view model okay that's the convention that's the convention but as with most convention yeah you can change it okay okay if you don't like the convention you you can use whatever you want this is just what we standardize on also one other thing you can do is you know register type has a ton of register type for navigation as a number of overloads yeah now I want to noticeable one thing about using the convention based approach is we have to use reflection to find these objects yeah that's a performance hit yeah if you don't want to take that performance hit and you don't mind creating a small coupling you can create them you can say main page view model oh and you map it and now we're using types and no reflections necessarily that's nice that's easy yeah so you just gave me the type I don't need to reflect to find it easy and this is actually really important if your view models are in separate assemblies yeah this makes it a lot easier yeah because trying to change your convention to use reflection and generate types dynamically can be a pain and often you know if I'm inside the zamarons studio I even have it so appending folder names is off everyone's using you may be using in your by default Visual Studio say listen I created this main page it's in the view few things so it's gonna be like by default plus the folder plus of this and you can get down this really rabbit hole things so sometimes in xamarin studio him just turn it all off and like everything is hitting one namespace which is you know right maybe the not best practice but sometimes it's easier for me based on the app I'm creating him it's small so that's nice I can just say hey listen here it is cuz I know what it is yeah and it allows you to do it you can use a convention or you can override the convention maybe there's another thing you can do now that we're talking about it register type for navigation on idiom you can say depending on the idiom I'm gonna use a different page call or depending on the platform if I'm on a dis platform I mean this page yeah so if you have like a specific iOS you know default page that you want to use tabs on iOS master detail on on Android and Windows right you can register so now you can see where the power of using a key identifier really comes in yeah because I use on platform I can assign different pages to the same key yeah so nonetheless and any of my view models none of the navigation logic changes yeah it's all the same I like that but depending on the how you Navistar you'll get a different page depending on platform or idiom okay so kind of as your apps become more complex it's it's capable is capable of handling as more complex scenarios but but by default if it's okay I just wanted you file a new app right like this is looking pretty good right yeah this is simple easy okay so we have a very simple page we have a label and a button labels bound to a title buttons bound to navigate command that we have a view model let's go check that out okay right so here's our navigate command it's empty right now mm-hmm but we want to navigate somewhere right yep what we have here we have so this looks so bindable base that's imprison my assume yep so bindable base is a prism base class and all it is is inotify property change okay you don't have to use bindable base sure at all yeah because I have my own mvvm helper library that has base view model yeah use that okay use that it doesn't matter but by default that's not bad I mean that's nice because literally this is what mine looks like it it's literally set property rap title yeah that's what mine looks like what most people don't realize is that set property returns a boolean so you can check if it was set or not yeah right okay so why isn't property change being called well it's the same value so it's not gonna be called but you can have other logic based on the result of that gotcha and you got a delegate command in here which is is nearly so the xamarin form says its own command right delegate command what's the difference a delegate command is very similar to the command in zammurd form yeah the difference is is that we provide a couple of features that kind of sweeten it a little slow spices so one of the problems with commands is you have to re-raise the change notifications right like let's say I have a can navigate yeah right now I have like an is active property that's bound to a switch or something yep and without value updates I need to re-raise a raise that can execute of the command so my button can update its state you got some additional boilerplate code additional boilerplate code but let me get to some view so everyone see it here one of the things that prism provides you is something called observes property and observed can't execute so observes property says hey you know what anytime the title property changes I'm gonna automatically raise can execute before you can yeah okay right it's in your state will update so you'll have a whole bunch of boilerplate encoding your centers yeah to raise that notification change that's nice often I'll have something in all of my view models that's called these busy like that's just my that's that's my always like the last five years like is busy if I'm doing something and the background is busiest your so I'll put a little indicator right yeah and but that I want it to disabled and the nice thing in Zaman reforms it is it disables your button automatically or disable certain controls but I got to go in and literally in my sadder I go if it changed and I got a raise this thing exactly yeah you not to do that now this is using i observables this your own implementation no this this basically just used to lambda and i want to note this only happens for view model properties okay only yeah right it's not meant for if you have a person property of the type person yeah you don't go person dot first name or person down address street share we don't monitor those okay it's just for view model level properties another thing that this does is let's say york and execute is just a simple boolean property you can observe can't execute and not only we use that property as raising the change notifications but it will use it as the delegate itself oh cool so you don't even have to have a can execute just returning a property like that so it really cleans up your code yeah I hate those nasty I hate dirty setters I don't like dirty setters so I like my setter is nice and clean gadjo bow by default which is like hey a delegate command looks very similar to what I saw before with a normal Commandant passing in and navigate yeah oh than that it's the exact same and of course we have of T yeah right so if you wanted to have a you would just have Dell community and passing your string or whatever you wanted to do cool okay so we're in this view model I mean I can run the app we can take a look at a right-click it's pretty simple just uh-oh restoring nuga packages that's always uh a favorite part of project out JSON right yeah every time he built anything I got I got to make sure you didn't change anything exactly all that makes me nervous too all right so this should just be a very simple it's a one-page app there's our main page so we know our bindings working and we have a navigate button beautiful alright so we need something to navigate to first yeah right so let's just create a page right quick now I'm using the prism template pack because I like productivity yeah so I'm gonna go to prism and we'll do a Content page let's just call this like view a so what's gonna happen here is it created a view a for me it created my view model and it registered it for navigation for me automatically magic right I like that that's busy code we don't want to spend time doing it so taken care of for you alright so we have a page let's go to here and let's just copy and paste to save time and you also notice that the view model locator is always in there already in there for you why is enough for you yeah we're not going to have this well you know what let's just we can leave that in there why not and just copy this out here yes I know I'm gonna to update my constructor don't do this in production by the way there you go source of bugs you a perfect okay so we're all hooked up now the question becomes I have this view way I have a new view mm-hmm I'm in a view model how the heck do i navigate to that thing from a view model here without referencing a page class or registering of referencing any of the navigation yeah interfaces or properties from the page and often it's it's I want to navigate and I'm navigating to this other page and there's a way to flip it around that I used to be used to which is that I know the the data that I want to go to the view model that is not linked to my my view so I'm actually doing a kind of view model first navigation which which some people may be used to if they're using some different framework that we're going here or is it or not or we've registered some keys the beauty of it so there's always a camp yeah view model first view first yeah well if you really think about it and prism it's neither okay because you're not you're not navigating to a page you're not navigating to a view model you're navigating to a key a key all you know is the key yeah and it can be anything this is especially important in WPF because you can inject view models into contents and have templates and write sure examine forms its it is page first you're you have to create page instances yeah but you don't care yeah at all right so I'm in the view model all I need to do is ask for my eye navigation service and I get it you get it because you're using that built-in dependency injection exactly so we need to save this off and I don't have any sharper in stalks I know people watching this like oh yeah resharper just do it for you well I do a lot of presentations and you be surprised the number of people who don't have resharper I don't have any sharper when I when I do presentations to it's out of the box expecially this is all out of the box yep so we're gonna store that off so now all I have to do navigate service we're gonna say navigate async and our key is view a whoop and if and if these views are in the same exact assembly you can find you a name of and then yeah what I technically wouldn't do that just because you're referencing pages and your view model it kind of breaks the concept and that's why there's a string property and what but constants for sure you know and I always have a constants file known known pages or known keys or something like that yeah and I would use those but you know what you can totally do name of whatever you're comfortable with go for it now is this a navigate a sink it's a task and but I'm in a void yeah should this be a task should it be an async task should it be I should be a waiting on it you would want to wait it mhm you know preferable you wouldn't want to wait it especially there's a lot of things going on you know in there and we'll get to more of that okay but so let's go ahead and run it okay then recompile and re-add my nougats again and then yes got to add those nougats every time you compile perfect there we go you a you a one one line of code but one line of code and it creates it got that went out it says listen view a is registered and since the view model was linked that's how it just auto did it right it just Auto did it now very cool there's a caveat to this okay this is the only one and it drives me nuts but due to the limitation of containers dependency injection containers I had to do it this for I navigate service it has to be named navigation service okay it has to be you can't you can't call it nav service how interesting this is the only one that has that restriction no we're sure that's documented fully it is it is documented now the reason it's like that is because I'm doing parameter injection hmm because in xamarin forms navigation is based on page instances yep you have to have the page instance yeah so what happens behind the scenes is the view model locator when it creeks the page it creates the navigation service okay associates the service to the page instance yes then it does a parameter injection into your seat or yes and this is because essentially think examine forms different pages could have different navigations yes if you have tabs each tab could have its own navigation a universal global navigation could be but it may not be yes now people I've seen in some code where they're they're they're essentially stacking navigation pages and that's probably not right now I know I have a question though now I didn't see a navigation bar is there navigation pages that just popping up modal's or how do I go navigation bar in this thing why default yeah that's modal okay so what the prism does is it smart yeah it says where are you navigating to and what's in my navigation path okay okay yeah and it will dick it's smart enough to know if I'm inside a navigation page I'm gonna go async yeah if I'm not well obviously I'm going modal okay gotcha right so you're saying well how do I get inside a navigation page that's what I want to know is all everything I do is gonna be a route of a navigation well the easiest thing to do if you don't need anything custom just register and having navigation page that's better right nope I miss my G I'm not used to typing on this keyboard you know when you work from home yeah you have your own keyboard so just register xamarin forms navigation page right so I know how to create it you're in a navigation page so let's go ahead and run it and and I'm registering for this type which is just the default navigation the default navigation panel which you know to be honest I've really never really customized a navigation page too much and boom now we're in there no I don't have a title set yeah on the page but we're gonna neither we're inside a navigation page nice I love it a lot of it very simple very cool now imagine this inside a master-detail if you're talking about tab pages imagine master detail with tabs each and side navigation pages the it gets complicated that's why navigation examined for me you have to know that service has to know about the page there is no global navigation service yeah you just can't do it and have it work reliably very cool right so so yeah so what else oh great we're on we got the view eh yeah we got to view a right now we're in a navigation page yes we got the view eh uh but another common scenario is like okay I'm in the main page when I navigate to another page I need the best I was about to ask you that yeah how do I get stuff there yeah if we're all just we're all just via these things I have objects or I need to pass an ID often I'm going from I have this list of data and I have an ID and I want to pass some data across to the next the next the next across so this is where we start talking about navigation parameters okay and it's really crazy whoops what happened my there we go right so I'm gonna create some navigation parameters and with an this is a prism navigates the prism navigation parameters so I'll say it's just a dictionary okay right so I can say ID and give it a value of object it could be anything oh cool so in this case we'll make it a string okay now I'll just say hello right yeah no biggie and then we just pass it in very cool okay so we could create the parameters yep but how do we consume them so normally what I would do is I have some sort of I would if I was doing this in normal same reforms I would create the page I would set the binding context all right create an overload on the actual page itself right I would pass that into the page create the view model from the code behind of the page now I'm actually putting a lot of logic right yeah and then what I'm doing is I'm then gonna go and maybe parse that stuff on appearing right you know start loading some data yeah well we know we make it so much easier for you I want to mention this demo is using the latest preview six point three preview that's how new good so if you're gonna add it a nougat package just make sure you show the previous show the pre-releases now and the reason is because I just added a new member to this interface but I navigation aware essentially that this view model I'm assuming is aware of navigation yes it's in the name yep so this comes with three methods on it oh cool I've seen these methods before they are very familiar so the new one so this is a breaking change okay from 6.2 okay but it's totally worth it because they're really a 7.0 is well we'll see prisms never been on semantic versioning ah interesting you do whatever you want I do whatever I want now I'm thinking about getting on semantic versioning big bang with this break yeah you know it's like it's a break just go ahead and go to seven yeah version seven right other numbers don't really matter to be honest they're all it's all just no well when you have like uwp and WPF and they're all different it's hard to manage for versioning is a pain just so you know anyway so we have on navigating - yeah so this executes before the page is pushed onto the stack sure hang on navigated to this is after the age has been pushed on the stack and is now visible visible and I have uh navigated from I have navigated away from this view somewhere else okay to or from yeah well no like from from but I could be going back or now yes you're going back on if you're leaving this page on navigated from got it hit it so we can say on navigated on navigating to or non navigated you can say okay well Brian which one do I care about yeah that's a good question it depends if you're passing state that you want visible on the view and it doesn't have to like load like a task or anything like that in the background but you need it there immediately on navigate team to okay otherwise if you do it on navigated to the page will show the valuable set bindings will update yeah so you'll have a delay in value displaying yes of you if you're passing some data across to the next page and you want it to be seen immediately yes you like let's say the title here that we have no so we could take the parameters that are passed in update the title to it immediately by parsing out that key yep so I'm gonna say hey if the parameters contains key what I call it ID I think I call it I think an ID yeah and then I can set the title equal I know it was a string so I'm just gonna hard cast it their parameters index of ID cool boom right so let's go ahead and and run that is very cool it gets cooler just wait like you be bring zhuzhing out of those Canada's of all the viewers so we're gonna go ahead and navigate and there we go hello very cool very nice right okay so but parameters are a little more powerful than just a dictionary okay because we have to interrupt with web a lot yeah we're coming from webpages so what would be really cool is if I could say something like you know hmm so if people don't know what's going on here essentially this is a very standardized when you're we go to web pages normally there is actually a key value store that yes in and this is actually a very familiar when I used to do like Windows Phone development or even W like a severally it's like very URL based so you would actually pass this URL and like a Windows Phone 7 application yes and and that's how you actually pass parameters was being exactly the type of URL ID so is to we take that you're the URI being passed in does have parameters and we parcels down automatically a call or you can create them yourself yeah so another thing you can do is let's say you don't want to use the parameters object at all we are a URI you can just do that very cool right yeah doesn't matter so if you're and that's really nice if you're just like this is very simple properties it's not I don't need this I don't need to create extra objects exactly like that I just go in and boom this works exactly very cool ok so some other cool things about navigation is we have an interface called I confirm navigation and I confirm navigation they sync right this essentially says am I even allowed to navigate right so for example I have prism ships with a i paged dialog service we'll just add service things like dialog pop-up boxes yeah yeah we'll call it page serve whatever so we'll store this off for quick so we need that and essentially what this is this is your display action sheet okay yeah yeah and your your dialogues yeah it's like that that are built-in because normally again you need access to the page so you may say application current dot yeah exactly yeah we don't want we don't want any of that so we can say display alert async mm-hmm right and then we have our title what else we have in here we have our message well I can't spell today of course we have your accept and you have a cancel cool and then when this pops up if you had accept it's gonna return true cancel false for it can navigate and this gets called I assume prior to our navigation but yeah it checks first it's one of the first checks that's going to happen so this is gonna be the alert BAM cancel we didn't go anywhere except and then of course our parameter we change the parameter so just tune it to yeah all right so now you can very awesome am i dirty is this forum dirty doesn't you save whatever has to happen that will get called for that will get called first Brian has been awesome so that's and that's just navigation essentially and there's probably a lot more you have a you have full Pluralsight courses on this I do there's one more thing I got to show you okay him you got one more minute let's head one more minute on this this is worth it this is totally worthy so there's a concept called deep linking have you heard of it yep so let's say I have a view a of you B of you C to a master detail page it has a navigation page that goes to a main page that maybe goes to a view a maybe a view B again maybe a my tabs page where they view B tab selected maybe something like that right yeah when the page starts up by the way yeah I mean that's pretty crazy I don't know anyone that would ever really do oh I have a typo type out stop stop stop there you go view B so essentially you have all these pages and this is a good example of maybe this is something got deep LinkedIn passed on from a URL navigate exactly alright so so simply what's gonna happen is no matter how complicated it is in kind of like I said the the navigation service in prism is pretty intelligent yeah okay so it's gonna build up this entire navigation stack I started pretty fast so here's view B that's selected so let me move this over so we can see our so there's view B we're on my tab page so my so if you be selected yeah so the next page when I hit back is view B view a next one is main page inside of master detail so I can navigate through in here very cool okay now we're modal cuz you can scroll over here we have you see view B view a yeah you see you B you a and now we exit the app when we close again that's pretty magical that's amazing that's amazing not only that I'll start debug man Oh even in deep links you can pass in parameters because now that it's a tall builds on top of itself right so as we're going through we can pass in all these variables we can do anything that we want and each page can get its own set of unique variables that's very cool so there's a lot more to this yeah from cleaning itself up you know when you pop pages off the stack sure you know it clears all the behaviors for you automatically it sets the binding context to know I does a lot of things for you there's an eye destructible interface to allow you to clean up your view models there's a lot involved in this and this is nice it's now testable because our pages are decoupled from our view models and we're just kind of good to get exactly because in my test these can be mocked yeah even as there is an interface it just interfaces I'm completely 100% testable very cool Brian this is awesome we're gonna have so many amazing show notes some really awesome documentation and point everyone to and where to get started brian has been awesome yeah I mean this is just one of the features I we hinted oh and some of the other stuff just a little a lot of stuff and it seemed what's nice about it is that it seems like a very nice even lightweight complement very very lightweight so in the past prism has always had a bad reputation for being heavy and sullen cuz you know the developers really didn't understand yeah but you can obviously see how lightweight this it is it starts up boom just like that awesome Brian thank you so much for being here appreciate it awesome thanks everyone for tuning in until next time I'm James Monson Magno and this is the xamarin show you

Channel: Microsoft Developer

Views: 8,403

Keywords: channel9, xamarin, ios, android, xamarin.forms, visual studio, uwp

Id: mb3_vhYw1mA

Length: 46min 49sec (2809 seconds)

Published: Thu Jan 04 2018