If you're building an app where your
user's privacy is important, and let's be honest, it always is, and
you're building a .NET MAUI app, then this video is for you. The other day when I was browsing the
internet, I found this amazing plugin for .NET MAUI, which allows you to enable
to kind of like secure your screen of your app. I'll show you
in a minute what that means. But basically, when you're building an
app where your user's privacy is important, then this could be really
helpful. You might know of apps that don't allow you to
take screenshots that don't really allow you to take. Whenever you
go into the multitask view on, like, iOS, you get all the apps next
to each other and you can see the last screen that was shown in that
app. You might not always want that. If you are
creating a banking app and you have your bank account balance on there, you
don't want your phone lying around and someone just, boop,
open that multitask view and seeing your balance, right?
That's something that you might not want to do or someone looking over your
shoulder. Is that happening now? Okay, so you don't want that to
happen. And there is ways to kind of obscure
that for both iOS and Android. And this plugin makes it really,
really easy to do that. So let's see how to implement that. So here in Visual
Studio, as always, I just created a File, New .NET MAUI project. This is
basically the vanilla project. I only already installed the
plugin. So if you go over to your project, you do right click and
you do Manage NuGet packages. Here we are. And then you're going to
search for Plugin.Maui.ScreenSecurity, right? So you're
going to find that one. And as of right now, this is
version 1.0.0. So it's a stable version, if that
means anything. And it only has 51 downloads. So
you'll be among the first people to know about this
plugin and to use it inside of your app. How cool is that? Also be sure to
go over to the repository, star this project. If that is
something that you like and you want to support the author, maybe you can sponsor
them. Always important stuff to look into here. Now if you've
installed that, just install it on your project. It should go automatically. As
mentioned, it only works right now for Android and iOS. So if we look into
the csproj, just to give you a little pro tip
right here how that works. It's going to be included only for
Android. So only whenever the target framework is Android, it's going to
install this and for iOS all the same, just so that it doesn't make
for any errors whenever you're using Windows
or Tizen or any of the other platforms. So with that in
place, we have all this and we don't need to
do any initialization in the MauiProgram. That's how it typically goes
with plugins. You have to go into the MauiProgram and add a little
initialization line, but none of that. And for this screen, I'm not
going to touch the UI that much actually for this screen is just the waving net
bot, as you know and love it. But let's pretend that this is a very
secret screen, right? So now how to use the plugin. So
there's a couple of ways to do that. You can actually go into the
MauiProgram and this is probably the way that you want to do
it. You can go and here say builder.Services, you can register it
as a dependency service and you can do add,
I think you can use a add singleton for this case and we can
say, hey, we want to do the I think we can just
do this. I screen security. Isn't that one? I
screen security. There we go. Well, you can
figure it out. It's also in the documentation. You can definitely use
it like this. If you really want to be sure that
this works. You can do screen security. So you can actually add the right
instance in here. You can do screen security default.
This is also how we recommend doing it now for what was formerly
known as Xamarin.Essentials, now .NET MAUI Essentials,
you can register it the same way. And now you can just do dependency injection
on this thing, right? But you can also use the static
instance of this that I'm just registering here. So let's just do
that for this example. Actually, let me just keep this in
here. So you know how to do this for the sample code
right here. If you use DI, use this. There we go. So you can use
this. I'm just going to use a static instance. So I'm
just going to do ScreenSecurity.Default. So I'm just going to copy this one and
I'm going to go into the code behind my main page. And you can
do this in a couple of different ways, right? You
can do it whenever you push a button, whenever you go to a certain screen.
So that's totally up to you, whatever you want to hide in your application. Now
at this point it's probably also good to note that while this is a
handy feature, it's not airtight, it's not all
waterproof. Is that all sayings in English? I
don't know. But it's not going to be completely safe for anything,
right? Nothing is completely safe. So this is definitely helpers,
that can help you make your privacy for your user a little bit more
secure. But definitely this is not the silver bullet that you're
looking for to make your app really secure for everyone in every scenario. So
it's up to you where you want to use this. You could do like hey
override OnAppearing. So whenever this screen
appears or any other screen. You can do it right there or you can just do it here
in the constructor if you want. So let's just do that.
ScreenSecurity.Default. It automatically adds the right using
right here with Visual Studio, using Plugin.Maui.ScreenSecurity. And you have a
couple of APIs. And you can also see there's a lot of
exclamation marks here. I'll get to that in a little bit. But the most important
ones are here. EnableScreenSecurity Protection and DisableScreenSecurityProtection.
Right? So we got a couple of variations of that. And
let's just do that actually. EnableScreenSecurityProtection
right here. There we have that one. And then whenever we press the button,
let's just do it like that. Or you could use the override
OnDisappearing. Here we are. So
whenever you leave the screen, you can then kind of like disable the
screen protection if that's what you want, right? But right now, just for
demonstration purposes, I'm just going to do it on the button press so we can actually
have a little action that disables this behavior. So let's just say
disable screen protection here. And you can already see this is not
available for anything but Android basically. So you
can see that here mentioned it's a big tooltip, but it's supported for
Android only. Again, we'll get to that in a little bit. So disable
screen security protection. Okay. And if I run this now on
Android, then we'll just see the waving net bot. And whenever we go into the
multitask screen, it should be obscured in any way that
the Android version of your device is doing that. And we
should not be able to take screenshots. And I think even the screen recording
is disabled as well. It might even be. I've seen a demonstration, which is
really cool, where they mirrored the screen through a tool named Vysor. So they
have a physical device, they're mirroring that to the computer and even there
that screen doesn't show up. So you can really not share and do
anything with that just to prevent your user from doing anything stupid.
So if I go to the multitask view here, whoops I can see oh, here we are. So it's blanked
out, right? It's gone. And if I try to take a screenshot, then it says
disabled by your admin all the way down here at the bottom.
So you can do anything here, which is really cool. And if I now go
back in here and I do click me. This disabled the screen
protection. And if I go back into this movie thing here right now, you can
see, hey, there is the screenshot of my last used screen. And I can take the
screenshot, right? This is just allowed. So this is really cool. This
is really helpful functionality to do that privacy
stuff. Now you already noted, I already
mentioned it a couple of times, so it would be hard to get
around it is that this is only working for Android. So what we want
to do is do if Android right here and then here we can do end if,
right? So same for the other one down here, just so
we're sure that this only works for Android. Now, if the
author of this plugin gets to watch this video, this is something that I would
love to improve in this plugin, because now you will
get a lot of if Android, if iOS. And I get why that is. But it
would be cooler if there is if I don't care about all
the customization options or if I can have the customization
options in just one method call. Because now I have to do all these if
devs. I don't really like them personally. So it would be cool if we
could just have one API that is supported for Android and iOS and
he will take care of all the multi targeting there. But anyway,
that's all aside. So if we want to do something for iOS,
let's do else if that's how this works. iOS, I can now do screen whoops I have to switch over here from
Android to iOS. So I get the IntelliSense and that kind of stuff.
But you already know it worked like that, screen security default and now I can see what is there for iOS.
And iOS has a couple of options. You can use a color
overlay basically, so you will get a certain color that is overlaid
on the whole screen. You can do a full image if that's what you
want. You can do a fancy blur if that's what you want. So that's why
this is split out between Android and iOS. And I think like I said, for
Android it's also enable screen security protection, like block screenshot,
Android screen recording and all those kinds of things. For iOS you have to
specifically also enable the screen recording protection, right? So that's
also something that you need to do separate so you have like the
multitasking going in there and the screen recording protection. So
that's two separate things that we got going on here. So let's
just do the blur screen protection and you can do a theme style. So you can
also make a difference between light and dark. You could look at the
setting that the user has set for their operating system with the
.NET MAUI APIs. But you can just choose one of these. So let's do the light
theme here and again, if we then do that here, down here, we can
disable it again. So else if iOS, I'm going to do ScreenSecurity.Default.Disable... and you also have to do the
DisableBlurScreenProtection, right? So there is that again, this could be one single
API that just says disable screen protection. I set it too often and it
will just disable all the things regardless of how I set it right that
would be even cooler. Now, if I switch over here to my iOS
target here at the top, I connected my Mac machine to this Windows machine. And now I can just
select my iOS Simulators right here, and I can start connecting to
that. And with the Remote Simulator, it will show up here on my machine so
that I can kind of like screen mirror my iOS simulator that's
actually running on the Mac on my Windows machine. And I can just
click through it as I'm debugging any iOS application on Windows. How crazy cool
is that? So let's just wait for that to come
up. Here we go. The iOS simulator is coming up, installing this
application. And here, so, this is a iPhone 14. So I should
be able to swipe up, but for some reason, I can't
really do that with a cursor. And here at the top, this is kind of like your
home button icon. So if you tap the home button twice well, if you
could, if there was a physical home button still on iOS, then you could
actually tap it twice and it will bring up that
multitasking screen. So if I do that now, you can see it blurs out the
application, right? So you have this privacy thing going on, and you can do the
same thing with a color overlay with the other APIs or put an image on top
of it. You can do all these options. And if I go back, the
blur goes away. We can actually see the app. And if I click it, it will
disable this production. And if I go to my multitask screen now, you can
just see the content right there. So this could be used
whenever you go to a different screen where privacy isn't as important. You can
implement this any way you want. This is really one of those simple
API, simple plugins with well, it packs a lot of power, right? It has
some simple functionality that you feel is really simple, but it
takes some code to implement it each time
for iOS, for Android. And it can be really powerful, really
helpful. If this is important inside of your application now, you don't need
to do that anymore with the screen security plugin that is available for .NET
MAUI. Thank you so much for watching one of my videos.
Please click the like button if this was helpful to you, and that will let me
know that this is a video that you would like to see more often in
the future. Don't forget to subscribe to my channel and I'll be seeing you for
the next video on the other side. See you for the next one.
