Dependency Injection with .NET MAUI Explained! Full Beginner's Guide

as your application grows you're going to have more dependencies more classes more services more view models more interfaces and what you need to do is easily resolve those dependencies and built into.net and maui is dependency injection which gives you the architecture pattern of inversion of control and specifically constructor injection so what i'm going to do today is break down everything that you need to know about all those fancy words that i just said so you can be more productive when building your don and maui applications so tune in [Music] hey everyone i'm james and i'm back and today i'm going to be talking about a really near and dear topic to my heart because it's one that i've fought forever which is dependency injection and specifically constructor injection and inversion of control and all these things uh that are all fancy words just to say well i have this thing and i want to resolve it or get an instance of it later you know new it up do these things now i had a video specifically around xamarin forms and dependency injection and many of you were like james that's not dependency injection that's a dependency service yeah yeah yeah i get it but think of it like this right as our application grows we have pages we have view models we have services we have interfaces we have a whole bunch of different things and we need to resolve those dependencies and you think of it like this is like a dependency is when one object depends on another object now if you're coming from the asp.net core world you're gonna be like james dependency injection it's built in i know everything yes and it now is with don m maui which is really really cool now there's really two parts there's the dependency injection and there's that you know um constructor injection so i think of like this is dependency injection di and ioc and version of control they're very much the same thing but it's a way of resolving thing but again a dependency is an object that depends on another object so let's look at an example so you have a page and what does a page have it has a view model that is the dependency now in your practical terms you could just new up a new view model now that's fine and dandy not a big deal but what if you want to you know have a dependency of that view model for example maybe that view model takes in an i database service all right well i'll new up a new database service and you're like well what if that database service needs an isql service and what if you also need an eye connectivity service you're like oh like what is going on here like i have this huge dependency graph basically and i think in most terms when we're building apps uh with don and maui or even you know windows applications or or web applications you usually have a ui some code that's in the code behind and that thing uses services so i always see it as like three layers deep right page view model services and the services could be anything it could be a database it could be you know one of the essential apis like getting access to a file picker or connectivity so that is what we need to do now in don maui there is a dependency service that's built in that's different than the old one that is still there but actually it's a built-in service provider that is the same one that's used in asp.net core so if you're used to dependent you know newing up and registering dependencies this is going to feel very familiar now there are specifically two types of dependencies that you can have a singleton and a singleton um is something that is sort of like you think of it as a global almost it's it's a one instance it's a single instance of it and a singleton essentially says hey if you've created it once and you want to get it again later then go ahead and retrieve that same instance and then you have a transient and a transient is the opposite of a singleton a transient is a single instance every single time so every single time you knew up a new one so based on what your application and where you're using these services you're either going to want a singleton or a transient that's in there now you can actually use this built-in service provider with or without the app shell but when you use it with app shell which is part of the default template i have tons of videos on my youtube all about which you should totally use because it's amazing and it's in the default template because you do uri navigation and all this other stuff but it also includes constructor injection and automatic dependency resolution and this is the thing that developers have really really wanted when it came to client development and this is what this brings and yes there's been frameworks that have done this for a while but now it's built in to the box and now i'm all in and yes everybody should use it and it's absolutely amazing so let's go ahead and take a look at some code alright so let's go ahead and take a look at this application it's very simple it's very similar to the file new project but it has a button that i can click and it increments by 10. that's pretty nice and also a navigate over here and i can check the internet and it says yes i have internet because i currently totally have internet now if we look at this application this is file new project but i've added some mvvm goodness to it if you don't know about mvvm model view view model sort of a way of abstracting your code separating concerns and i have a video that i'll put up over there too now this is just a shell which i highly recommend you shall it's the file new project it adds a lot of nice things and you'll see why in this video but there's just news up the main page and if we look at the main page we can see that it has some labels that has um this this label here that's binding to count with a string format it has a button that says click me to increase the count and another one to navigate if we look at that code behind it's quite straightforward there's not a lot it just news up a new main view model and that main view model over here is very very simple it's using the community toolkit for net and mvvm so if you don't know about that it adds these awesome attributes to source generation of all that mvvm stuff which is rad i have a video which i'll put up there and down there too uh but i have a simple count increment the count and then this i command to navigate and that goes to the detail page now i've also registered this detail page with my routing system inside of the app shell so this says for the string detail page create a new detail page so that is why here i can say name of detail page and i'll know to navigate to that page now that detail page is also straightforward it has a button it has a view model and that view model over here is a little bit more complex it still fits on one screen which is nice it has an eye connectivity service which is coming in from microsoft maui networking and it just gets the current instance of it then down here what this is doing is it says has internet and then it just displays if it has internet or not which we saw so let's talk about the dependencies here we have the view models and we also can see that we have this connectivity thing as well so this this also is a dependency because if i was doing unit testing i would want to mock out this eye connectivity so let's go into our maui program and this builder is very similar to the asp.net core kind of host builder model so here on the builder itself i can say builder dot services and this gives me an iservice collection to register my dependencies with the maui application so i can add a singleton or a transient so when you think about this the main page the main view model there's only one of them which means that's a good indicator that i can register anything as a singleton so i'm going to say all right let's do our main view model here perfect and we've registered that as the singleton now the detail page that one is a little bit different right we're only actually navigating and creating a new page and it might be different maybe it's different data so probably want to create a new one every time so i'll do builder.services.add transient like i talked about and we'll do detail view model all right now this is kind of cool because you can register your dependency chain here now if you want to get them well it's a little bit tricky because we want to actually access and get rid of this new creation over and over again so surprisingly when you build it up that's when it's going to do the registration it's going to do stuff so if i was to say var app equals builder.app and just returned the app here we can look at that app and we can see it also has a services service provider and here i can actually say get service there's get service get services and things like that so i can get those back automatically so for example if i say get service main view model it's going to access and get that singleton back if i did detail view model it would create a new one every single time i called that now this is a little bit of bummer because you know i have my maui app dot services over here you know it's not actually a maui app dot services it's not a static so if i needed to expose this i'd have to create it as a static save this iservice provider around that just seems like not the greatest of practices so there's a nifty way of getting access to these and i have this service provider and i'll give all the credit to david ort now because i stole this from his weather21 app so if we take a look here this is my service helper and the service helper gives me access to the service providers okay this is actually really neat so this is something like i said like i stole from david ort now but what happens here is that each lower level platform has access to the iservice provider so we can see here we have windows android and ios as well so if we toggle this to android we can see that that lights up there and it created this very simple static method to get the service off of the current services that is there which is really really cool so if we toggle that back and forth we see that light up now now what we want to do is use this and call get service and i know what you're saying james you're like james oh my goodness this looks exactly like the dependency service that you did a video on no no it's different trust me trust me on this you got to trust me there's already singletons and transients that's different so so bear with me let's go into the main here and let's call into that service helper not server but service service helper dot okay now when we do that we're gonna bring in that nice little helper there we go and i'm gonna call get service of main view model perfect perfect there all right now what i can do is i can also come into the detail page let me put a break point here detail view model there we go awesome and let's just go ahead and add a break point here add that using statement and let's debug it again now oh there we go make sure i actually write the correct code so when we do this and make this call right what's going to happen is that the main view model will only have one instance and that detail view model will have a new one every time so now when i come over here and i say click click click click click that's good navigate check this out we're requesting our detailed view model skip down and sure enough here is my check internet command and all this goodness that i have all registered 100 percent so that is good now in this approach though you still aren't doing any construction injection you're not doing anything special but it does come with a really cool caveat which is that you are actually able to register dependencies of dependencies through constructor injection now what that means is if i go into this detail view model instead of accessing connectivity.current i could pass in an eye connectivity of connectivity and instead of grabbing that singleton we can just set it here so this is really really fascinating because so far we've just looked at registering simple services and then getting them but now what we're going to do is resolve dependencies of dependencies so let's check this out so if we go back into our maui program we're going to have to register that so i'm going to say builder dot and you know the connectivity service you got to decide like is it a singleton or a transient well it's already static so you know let's just register it a as a single 10 add singleton i'm going to say i connectivity and here you can actually pass in connectivity dot current in there and that's going to register connectivity.current as icon activity so you actually have this way of when you're doing interfaces of passing in you know the contract and then the implementation of what would be there which is quite nice so now if we run this again when we create that detail view model we'll not only get the detailed view model but if i go and add a breakpoint here the connectivity service will also be passed in which is like really cool right so here i'll just navigate around boom and sure enough there is my connectivity implementation passed in 100 automatic all right so that is really really neat already okay so i love that i just simply love everything about that and if you want to take it a step further you could for example actually register your pages with the service to right so now we're kind of coming in here and we're calling the service model but it sure would be great if we didn't have to now this is where things get tricky okay because if you are not using shell how are you supposed to tell the app when you create a new page to go register that stuff it's quite tricky to be honest with you you can create a new constructor and then you could pass in the objects and then get the services from all of them but it's really not the best approach that is why i love shell for doing this okay because it handles all of the complexity automatically for you so here's what we want to do we actually want to pass in the view model all right and here i'm going to get rid of this call vm beautiful i'm now going to go into the detail page and do the same exact thing so vm perfect i'm going to type in vm here awesome all right so now we're passing in our dependency of the view model into this now we need to do is you guessed it i'm going to come in and say builder dot services dot add singleton i'm going to add the main page all right and i'm going to do builder.services.ad transient of detail page okay so now we have not only our pages but our view models and our connectivity service all registered and everything is being passed in via constructor right here now in fact what i love about this model is that if you look at the app over here the app actually news up a new app shell inside of here so this is super good and this handles everything for you automatically if you weren't you using shell you could actually dependency inject the main page in here too like if you wanted to you could say you know main page page and then you know replace this as page for example but since we're using shell we don't really need to do that which is good that's really cool so now let's check this out because when i run this i'm going to note that here on my detail on my detail view model when i navigate to that page if i open this up we're going to see that all of our break points line up okay so we have our click counter which that view model is coming in i'm going to navigate here our detail view model gets created passing in the connectivity because it's been automatically resolved i'm going to hit continue and note here that our detail view model has automatically been created it's going to be assigned to our binding context all by navigating 100 so when you call in your code app shell current go to async that is going to notify don maui that hey it is go time it is time to go see what is registered and if my page is registered i can automatically start going and finding the dependencies of those pages all right now i ran down a lot i hope that you re-watch this video about 58 000 times but i hope that i helped explain why dependency injection constructor injection inversion and control all those things are so amazing in don and maui especially when using shell and this is really cool because the more dependencies line up it automatically handles all those things for you a great example is the podcast application i've talked about a lot here but the dot-net podcast application i'll put a link down below this will actually use native services that have been registered too on ios and android to do audio playback and it does all the pages all the view models additionally if you're looking to get started building and learning don and maui i have an entire workshop that's over on the.net presentations there's a bunch of workshops there it's a six-part course you can file new up to building and deploying whole app you're gonna learn about navigation passing parameters with shell and of course doing dependency injection and doing all these really cool services so i hope that you you know get a full grasp of what's going on here why it's so unbelievably flipping cool and that why you should totally be using shell and dependency injection all the way down from top to bottom i'll put all the links in the show notes below and links to other things like mvvm community toolkit and so much more i really hope you enjoyed this video if you made it this far give it a thumbs up i'm serious that super duper helps the channel honestly i want to reach more people share the donna maui goodness with everybody and there's a share button you can share it on anywhere you put on linkedin you put it on twitter you put it anywhere about all the places just share with people youtube algorithm loves that stuff and finally don't forget to hit and smash that subscribe button like every single youtuber has told you forever and ring that notification bell so you get new videos when i put them out here on my channel super appreciate it leave comments below i'll totally get to them i hope to check you out soon [Music] you

Channel: James Montemagno

Views: 59,476

Keywords: .net maui, android, c#, c# dependency injection, c# dependency injection example, c# dependency injection tutorial, constructor injection, dependency injection, dependency injection tutorial, dependency resolution, dependency service, di, dotnet maui, game programming, inversion of control, ioc, ios, james montemagno, macos, maui, maui tutorial, net maui, netmaui, resolution, services, shell, windows, winui, xamarin, xaml

Id: xx1mve2AQr4

Length: 19min 17sec (1157 seconds)

Published: Thu May 05 2022