WinUI is the latest native UI framework for Windows, offering a modern and flexible way to create beautiful, responsive .NET apps that take advantage of today's hardware. The Windows App SDK is a set of libraries and tools that enable developers to access the latest Windows features and APIs from today's native Windows UI frameworks.
In this session, you will learn how to use WinUI, .NET, and the Windows App SDK to build rich, powerful native Windows apps. You will learn how to:
- Get started with WinUI and the Windows App SDK
- Use APIs from .NET, Windows App SDK, and WinRT in the Windows SDK
- Apply the MVVM pattern to structure your app logic and data, leveraging Microsoft's MVVM Toolkit
- Integrate Windows App SDK features such as notifications, app resources, and power management
- Briefly compare WinUI with other native Windows UI frameworks
- Discuss deployment options for your WinUI app (including the Microsoft Store and WinGet)
Conference Website: https://dotnetconference.com
📺 CSharp TV - Dev Streaming Destination http://csharp.tv
🌎 C# Corner - Community of Software and Data Developers https://www.c-sharpcorner.com
#CSharpTV #CSharpCorner #LiveShow #dotNet #DotNetConf2025
Show More Show Less View Video Transcript
0:00
um so this is getting started with WinUI and the Windows app SDK and also with uh .NET because this is all using uh .NET
0:07
if you're doing C# projects So a little bit about me I've been in the industry for uh almost 30
0:14
years now I have a blog The Morning Dew It's at alvinshcraft.com A lot of you
0:19
may be familiar with that I post uh links to uhnet resources for developers every day I've also written uh three
0:27
books for pack publishing uh two of them are two editions of learnui3 and then I
0:32
have another one that's on parallel programming and concurrency withnet and like I said I've been at
0:39
Microsoft since 2022 just over three years now content developer working on the Windows developer docs on Microsoft
0:46
learn and I'm an organizer too of a de developer conference the tech bash
0:51
conference happens every fall in the Poconos's in the Pocono mountains in
0:56
Pennsylvania so That's TechBash We're in November this year If you're in the area you should join us We're going to have a
1:04
lot of great speakers We'll be announcing some keynotes very soon And the agenda So I've got a couple
1:11
of things struck through here I normally do about a 60 to 75 minute version of
1:16
this talk So I've cut out a few things for this uh version of the talk but all of the slides for everything and all of
1:24
the code samples are all up in my GitHub repo It's just Alvin Ashcraftspeaking So you can go up to
1:30
GitHub and uh get the resources for all of these
1:36
demos So let's start with a quick overview of WinUI and then we'll get in some code quickly here Uh so WinUI is
1:44
part of the Windows app SDK Um the first release was in March of 2021 That was
1:50
1.0 Uh 1 UI3 they call it WinUI3 but it's not really a version number uh it's
1:55
kind of the successor to WinUI 2 which was an add-on to UWP to add some
2:01
additional controls and libraries And when UI3 is completely its own thing with the Windows app SDK it's very
2:08
similar to UWP If you've done a UWP apps on Windows 10 uh what they did was they
2:13
took those controls and libraries and extracted them from the Windows SDK so
2:19
that they could version these components independent of Windows they used to be stuck with waiting for a new Windows
2:25
release before you could get new UWP features and now it's all uh separated out Uh the main difference between UWP
2:34
and Win UI as far as looking at the code is uh the name spaces are changed So everything starts with Microsoft dot
2:40
instead of Windows dot in the name spaces Um it's built on the latest .NET
2:46
runtime Right now you can build WinUI apps with .NET 9 or .NET 8 Both are still supported
2:52
um you create apps with ZAML and either C or C++ and if you use C you're also
2:59
using uh .NET and you have access to the full uh at libraries runtimes everything
3:05
And the latest release of Windows app SDK is 1.7 that just came out about 3
3:10
weeks ago And it's open source on GitHub not full open source You can't uh contribute
3:17
code yourself but they do publish readonly um versions of the code so that it helps with debugging You can get
3:23
access to all the source And let's see we're going to dive
3:29
into the first demo here Uh so there's going to be uh two parts to this demo So I'm going to create a new WinUI project
3:35
from scratch and then show you how you can add a couple of things to make it look a little bit nicer And then I will
3:41
open up another project that's got uh an MVVM implementation model view view model And it's also got some controls
3:49
and some styles added So you can see uh the difference between the the basic out of the box and what you can do pretty
3:55
easily just adding a few uh styles and controls to your app But let's start with a new project dialogue We'll create
4:02
a new project in Visual
4:09
Studio And we're going to pick a blank app packaged Win UI3 And this is
4:18
C And we'll just leave the name app 3 for now And hit create
4:33
So this loads up a couple of files here in your your project
4:40
See if we zoom in a little bit there you can see this better Um so we've got an
4:46
app manifest We've got an app.zaml which is the part of the program that launches
4:52
your app So it goes into the app class first and then launches the main window from there And the main window is
4:59
exactly at the main window Let's take a look in the app.zaml just for a second to see how that's
5:07
created So in the on launch method it just creates a new instance of the main
5:12
window and activates it And then in the main
5:18
window new project just gives you a blank window with single stack panel
5:24
Stack panel just uh does exactly that Anything you put inside there it'll just stack the controls either horizontally
5:30
or vertically depending how you set that up So this one is horizontal So it would
5:36
stack things um left right And then in the code
5:42
behind each ZAML file has a C# code behind file where you can put code Um so
5:49
here there's just a buttonclick event handler So when you click the button that's in this UI file it'll call that
5:56
event handler Let's just run this I'm going to change this to ARM 64 I have an ARM laptop
6:02
here Run it with no changes and see how it looks
6:11
It's building and deploying And it's pretty basic It's a
6:18
big empty window except for the one click me button there And you can see it's got a title bar with a no icon yet
6:26
I click that it just changes it to clicked And now I want to show you a couple of
6:33
quick things you can do to make your window look a little bit nicer I have this other app
6:40
here And this is exactly the same code except I've added a few extra things So
6:45
the first thing I've added is this Micah backdrop And what that does is it gives it a little bit more of that Windows 11
6:53
look and feel I'm going to take that and just paste it in our new project and run
6:59
this again So you can see the difference that one little uh attribute makes
7:05
there You can see it kind of has that pinkish hue now So it's almost like a
7:10
it's picking up the color of your wallpaper in the background So I've got a a purplish hazy background and it's
7:17
pulling that into the window here Let's stop this and go grab the
7:22
other piece that I have here So the rest of this so instead of just the stack
7:28
panel I have a grid wrapping it and I have two rows in the grid The first one has a custom title bar And this is a new
7:36
thing in Windows App SDK 1.7 It's a title bar that looks a little bit more like what you see in other Windows apps
7:42
Uh you can add more things into the the title bar like you'll see in this WinUI3
7:50
gallery app You know it looks like a little bit bigger It's got a nice icon here It's
7:56
got a back button in here And you'll see some apps like the store they each they
8:01
even have like a search box up in your title bar You can do all that with this new title bar control Let's go back to
8:08
this app Copy this and put it in
8:15
here So we've added this new title bar I'll call this sample app that we'll
8:22
put that in the title bar I'm hiding the back button and I'm not making it a tab stop because we
8:29
don't have any controls up there that we want the user to be able to tab into And I have to get one other piece
8:36
to make that work in the code behind There's a set title bar method
8:43
that we're going to copy and call that from the constructor
8:50
So let's paste that in
8:56
here and call it And so here you'll see I'm setting
9:02
the icon I'm telling it to make it the taller
9:08
height and setting the display name here as well Let's run this again
9:18
And if we did everything right we should have this nice fall title bar But we don't have the icon yet because I forgot
9:25
that step Let's get our icon in here Add it to the assets
9:30
folder We're going to add an existing item
9:35
gonna browse out to this other place where I have an
9:42
icon and it's a winui icon Now we've got
9:49
that I got to do one more thing We'll stop that
9:56
We have to go and set the properties on this so that we set it as
10:03
content Instead of build action none we're going to say build action content so that we can reference it in the
10:14
code Now we should have an icon when this launches There it is We've got the
10:19
larger title bar Looks a little bit nicer And we got the icon set there
10:27
and it still works just like expected When you hit the button it says
10:33
clicked So that's a basic app I'm going to pull up something with a little bit more to it
10:41
Now these are all the samples that are out of my GitHub repo We're going to start with this controls and MVBM
10:47
solution
10:55
And in here you can see I've got a lot more going on So we have still have a main window and an app.zaml but we also
11:02
have some other views and view models So in the main window
11:09
now you'll see there's nothing in there It's just a window with the micica backdrop
11:16
So in here instead of having the uh everything in the main window we're loading each of these other views as a
11:23
page inside the window All of my markup for what we're
11:31
going to be launching is here in the main page And this main page will get loaded I believe in the app.zaml Let's
11:38
take a look here
11:44
So on launched we're creating main window and we're adding a frame to the
11:49
window and then we're adding we're telling it to navigate to the main page within that
11:56
frame So let's before we dive into any more code let's just launch this and show you what we're dealing
12:07
with So this is a media collection app So you can enter in your CDs you know
12:13
books Blu-rays DVDs You can enter all that media here and create your
12:19
collection It's got a drop-own box to filter by type So if you only want to see books it'll show that or I can go
12:25
back and show all I can select items and I can edit it
12:31
or I can delete it If I don't have anything selected I can add items Let's hit edit
12:38
And one of the other cool controls here is this teaching tip So what you can do with a teaching tip uh by default it'll
12:44
show every time but you can add a user preference um to save whether the user has already
12:50
seen this tip So once they've seen it one time you don't show it to them again It's just telling them how this drop
12:56
down button works So they can save and create new or save and return once they've made a change here So let's say
13:02
this is no longer in my collection I've loaned it to somebody So now I can hit this So I can
13:07
either save and create a new item or I can save and return to the
13:13
list Let's create
13:18
new And we'll add an alien movie to our list A
13:24
video Let's say it's a Blu-ray And it's in our collection Now I can save and
13:30
return And we've got all four items here
13:36
But let's take a look at some of the code for this and see how this works So in the
13:43
main page we've got separate grid for the
13:49
stuff at the top So in the top we've got the header We've got a stack panel that
13:54
stacks horizontally for the uh the label for the drop-own box that filters by
14:01
type and then the combo box itself And this is using uh data binding So we can
14:06
bind to things in our view model to show them in the UI So I'm binding the list
14:12
of items to this list of mediums in the view model And then I set the selected
14:17
item based on that property And then for the bottom part I'm using a list view control And inside
14:25
the list view I have both a template for the header and a template for each item in the list
14:34
And you can see for the styling uh we're using theme resources This will make
14:39
sure it'll pick up the light and dark mode or any other color changes that the user makes in their system If you wanted
14:45
to instead brand it your own company colors or something you could hardcode or create your own theme based on your
14:52
your company uh logos and things
14:58
And at the bottom we have another stack panel that's got the buttons And these are both
15:06
regular standard buttons And these are binding a command to the view model So
15:13
the um the command is what's going to be executed when the user clicks on there So it'll go into this addedit
15:21
functionality or the delete Let's take a look at the uh the view model that corresponds to
15:28
this So if you've done any uh ZAML development and used model view model you may may have uh done your own
15:35
implementation of uh an observable class or a bindable class Uh I'm using the
15:43
MVVM toolkit which is part of the net community toolkit It's uh open source
15:48
available up on GitHub You can get references into your project through um
15:54
Nougat So if I look at our Nougat packages
15:59
here let's see I've got the MVVM toolkit and these are all other standard
16:07
Win UI packages that you'll have here So by using the MVVM toolkit it
16:14
reduces a lot of code that you normally have in your your view model All I need to do is make my view model a partial
16:22
class and inherit from observable object By doing that it's going to create it's
16:29
use the source generators to create another partial class with the imple implementation of all the public members
16:35
So for a property I only need to create the private member the selected medium in this case and when it builds and runs
16:44
it's going to create a public property called selected medium with a capital
16:49
S So anything that's decorated with observable property will create a
16:55
corresponding public property for you for data binding And I can also if I go down to
17:03
uh my commands here So I've got here's the addedit You see this is private and
17:08
it's just called addedit but I've got this relay command decorating it So that creates the addedit command that's
17:15
public that'll be bound in the uh main page here So this
17:22
addedit command is created by the source
17:27
generator and then within that command it calls this private method So when I hit the button all of this
17:34
executes and if I hit delete this is the code that gets executed and I've got some code to
17:41
validate whether the delete button should be enabled Anytime that this
17:48
um can delete item is called it's going to check if there are any selected items So I can only hit delete if there's an
17:55
item selected in my list Let's take a quick look at the item
18:03
details view and view model We'll look at the view first Uh we'll go down to that teaching tip So here's the teaching
18:10
tip and the split button So the split button has the drop down with the two buttons inside of it And to show those
18:17
it uses a flyyou with a stack panel and the two buttons inside
18:23
there And the teaching tip here
18:29
We just data bind that to the save button and that will
18:35
attach it to
18:41
that And in the back here we have some uh little bit of navigation logic so
18:47
that uh when we open up here we're setting the uh the teaching tip This is where it's if you had some local
18:56
settings you can check whether the view the user has already viewed that teaching tip and you can set whether
19:01
it's visible or not I just have it hardcoded to false so that we'll see it every time that I do this
19:08
demo And the other bit that's important in the code behind here is whenever we navigate to this page um we're just
19:15
populating the initial data if there's already a an item selected So if there's an item ID then we're
19:22
going to be editing If there's no item ID then we know we're adding a new item and we should have an empty
19:30
form So that's the basics of some controls Let's jump back to the slides
19:36
and get to another demo here So the next one will be the uh
19:42
using the Windows community toolkit So there's the there are different uh community toolkits available from
19:47
Microsoft that are open source There's the .NET community toolkit I mentioned with the MVVM stuff in it The Windows
19:53
community toolkit Um there's some Windows specific stuff Uh you can use the things in there for UWP uh when UUI3
20:01
and also Uno platform So there are animations triggers uh behaviors controls and other
20:08
helper classes in the toolkit It's open source on GitHub here Um there's
20:13
documentation on Microsoft Learn about the controls and things in the toolkit And there's a gallery app on the
20:19
Microsoft Store We'll take a look at that quick I've got that open here So
20:25
within the gallery you can explore everything in the toolkit and see things working in the UI to see how they look
20:32
If I go to go to items view So it shows you what the items view
20:39
looks like It's running live here in the app
20:45
So if I expand the source code it shows me the code that was used to create that So you can copy and paste from here to
20:51
get started quickly Shows you the ZAML code for that and also the C for any
20:58
stuff in the code behind And with some of the samples in the toolkit app you can change some
21:05
properties to see how it will look in uh different layouts So it's got three different layouts that you can pick from
21:11
here You can change the number of amount of space between them and
21:17
space these out a little
21:25
farther And we can change the selection mode for this item So right now it's multiple I can select multiple items You
21:34
can change that to single So checkboxes are gone You just select one at a time
21:44
So let's take a look at um a sample app that's got this in
21:53
it So I've got a community toolkit solution here And you'll notice for some
21:58
of these solutions I have both an a solution and a solution x slmx Some
22:04
people are calling these slinks files Uh it's a new solution format that's currently in preview Uh it works with
22:11
the Visual Studio 2022 uh preview version And these are a lot nicer to
22:16
look at if you ever open the solution file and you've seen all the goods in there The solution X
22:22
files have no goods and they're they're much simpler to look at but we won't demo that here but you should go check
22:28
it out So here I have a hardware supplies
22:33
app Let's run it first to see what this looks like Call it hardware supplies but it's
22:40
uh got a list of hardware items and then another color picker control here So
22:46
you'll see I've got a data grid with some hardware items in it And
22:52
this control I can resize the columns nicely like a basic data grid functionality And you'll see I've also
22:59
got a little shadow around here And I've got some text here with a shadow on it
23:06
And my color picker control I'm using data binding to bind to this shadow color So if I
23:12
change the color that I've picked here it changes my shadows in real
23:21
time Anything I change there changes You can change the uh type of selection
23:33
And that's uh one of the controls in the community toolkit Let's take a look at um the code for
23:41
this So in our main
23:49
window there we go So I've got the Micah backdrop on here as well
23:56
And for the drop shadow using an attached drop shadow from the toolkit I named it common
24:04
shadow And I'm binding that to the uh the color
24:11
picker and setting the path to color So that's telling it to pick up the color
24:17
property from the color picker and use that for the shadow color
24:23
And then down here this header content control that's the uh that was the header at the
24:30
top And I've got a drop shadow panel which is also binding to the color
24:37
picker to pick up that shadow color And this is my data grid All I'm
24:45
doing here is binding the item source to a list of hardware items that are hardcoded in the the back
24:52
go behind here It's got some code to add a bunch
24:58
of items to that list And then finally got a grid at the
25:06
bottom that contains the uh text block for the uh
25:12
the final shadow says I love hardware and all related supplies And I set the uh effects.shadow
25:19
shadow property to the common shadow that's up in the resource at the
25:26
top And finally the color picker It's got a lot of different properties you can set So I'm setting the spectrum
25:34
shape to a ring You can enable and disable some
25:39
different things about whether you want to have the different sliders and other picking elements available
25:45
And then I'm setting the default color when it launches to be my system accent color So whatever the user's uh system
25:52
accent color is in Windows that'll be the the color of the shadows when you first
26:00
launch And in the code behind like I said there's just the hardware items and then we've got the code to set the uh
26:07
title bar up
26:13
All right let's move on to another demo here We should have time to get to a
26:18
couple more
26:23
notifications So the uh notifications API in the Windows app SDK lets you use
26:29
uh toast notifications in Windows And there's a couple different types that we can create here Let's uh pop open that
26:37
demo project
26:42
And most of these demos are adapted from samples in my book I've got that chapter on notifications that I pulled this demo
26:53
from So we've got the media collection app again but it's been enhanced a little
26:59
bit Let's launch this We've got a couple of extra buttons
27:05
at the bottom when this opens up
27:12
So we don't have the uh special title bar here It's got the standard title bar that you get out of
27:18
the box but we do have some new buttons down here for notifications So we can
27:24
send a notification or we can send a notification that will also have a text box for a reply So let's try the initial
27:32
regular notification You can see pops up a toast And if your
27:38
app is behind something I can click open app and it brings it to the front and I get a popup saying we
27:46
received this notification to open the app We'll hit okay there I'm also using
27:53
a status bar to show the uh current status Last thing that happened was the notification was
27:59
received The next notification we'll send will have that text box
28:04
Here's our toast And now I can enter a
28:18
reply So I've received that If your app was in the back it would have brought it to the front again but our app was at
28:24
the front Here's the uh reply It says input received was hello C# TV
28:33
we click okay there So let's take a quick look at how that code is implemented But um there's
28:41
a link in my uh list of links in GitHub that points you to the Microsoft learn
28:46
article that could walk you through all of this step by step So we have a few extra classes here
28:53
Let's go to the helpers We've got toast with text and toast with avatar These
28:59
are two different uh they're like templates for creating your
29:05
toast So here when I send the toast I'm adding arguments
29:12
for the different scenarios I have Um I'm telling
29:17
it to use this icon cropping the image to a circle when
29:24
it appears on the toast Here's the text that will appear on the
29:29
toast And this is the uh text box We're adding a text box to it And this is the
29:38
pre-populated text that will show in the text box for the user And there's a button So the button
29:44
on the toast says reply and the action is reply And that's what we got back in
29:50
the message that appeared on the screen If we look at the other one the one
29:56
without the text box it looks pretty similar but we don't have we just go from text to button We
30:02
don't have the text box in this
30:08
one And then we've got a notification
30:13
manager This is where we register to receive notifications
30:22
So in the initialize here we're setting up an event handler
30:28
to find out when notifications are invoked and calling this register on the
30:34
the handler When messages are received we're going to process them
30:40
here Send the notification out to Windows And then this is this
30:47
notification shared These are all the updates that we
30:53
received in that status bar So the status bar in the app gets updated based on which one of these we've called from
30:58
the manager class And
31:04
finally notification received If there's any issues we just pop up a
31:12
message saying there was some uh unrecognized message that was
31:20
received And like I said this is all out on learn Uh this is my speaking repo but
31:27
this is the page within this conferences stuff So I've got all the links for all
31:32
this And if you go to the notifications here Windows App SDK app
31:43
notifications So this overview gives you a little info but then there's a a quick start that walks you through all of this
31:50
on how to set up the uh notifications for your own
32:00
apps All right Next we don't probably have time to go through all the interop
32:06
uh demos but there are a couple different ways that you can do interop So there's ZAML Islands So this
32:14
was added in Windows App SDK 1.4 four And uh right now they're still working
32:20
on enhancing this but you can only use the ZAML islands to uh
32:26
show uh Windows app SDK Win UI stuff within a C++ app So you can't use this
32:32
in other uh Windforms or WPF apps yet Um but there there's a sample up on GitHub
32:38
from the team that shows you how to implement this in a C++ app And I do also have the code in my repo
32:47
And we don't have time to walk through the code but I can run this quickly and show you how it
32:59
works Let's run this So this is a a C++ project and it's within here it's got a
33:06
couple of Win32 buttons These are C++ buttons and then within there it's also
33:13
got the Win UI content So everything from this toolbar down is all WinUI
33:20
content So we've got a web view control that's when UUI It's got some
33:25
uh WinUI buttons text
33:31
box So all this is embedded within the C++
33:40
app And the other way that you can do interop let's go back to PowerPoint
33:46
So you can use the web view control to embed uh web content within your WinUI
33:51
apps And I have a sample that embeds a Blazer app inside there So let's run
33:58
that quickly just to show you what that looks like So I've got two projects in here
34:04
I've got a Blazer project that uses web assembly and I have that running out on the web so we don't have to kick that
34:11
off here This is my Win UI project And this will just load up our Blazer
34:16
content from the web Let's run
34:25
this And when this opens it's just going to be a WinUI shell with your basic uh
34:31
Blazer Hello World app This is what you get when you create a new Blazer project
34:36
Most of you are probably familiar with this This is all running in the
34:42
web Take a look at this code
34:48
quickly Crl + C So the only thing in here is the web
34:53
view control And I'm just pointing it out to where my Blazer app is running
34:58
online Nothing else here Nothing in the code behind It's just loading up the Blazer app
35:08
Let's jump back to the slides and see if we can get through a couple more quick things Uh deployment options So there
35:15
are different ways that you can package your app your WinUI apps Um you can make them framework dependent or
35:22
self-contained So framework dependent apps depend on the Windows app SDK runtime being on the client machine Um
35:30
and self-contained apps you when you deploy your app you're deploying the Windows app SDK runtime with your app So
35:36
you have more control over uh the size of or you have more control over the
35:41
versioning of your package that your app has Uh but the the size is going to be
35:46
obviously much bigger when you're deploying the uh whole runtime along with your app Uh you can deploy out to the
35:53
Microsoft Store Uh you can deploy through winget So up on the winget
35:59
repository you can put your app up there Uh there's ways that you can sideloadad Um I've got a link here for instructions
36:06
of how Net Maui Windows apps can be sideloaded and that same process works
36:12
for any WinUI app And there are also thirdparty installers So install shield uh advanced
36:19
installer all those things can work with your WinUI apps
36:27
And we won't be able to get into Uno platform but uh I can explain quickly So
36:33
Uno platform is um multiplatform solution kind of like net maui but they
36:39
can also run on Linux and on the web with web assembly So you can create a single codebase that runs on iOS Android
36:46
Windows Linux uh just about any platform all from the single uh codebase And the
36:52
ZAML used in UNO platform is WinUI ZAML uh in my book in the one chapter where I
36:58
show an UNO platform demo I just take my WinUI code and I copy and paste it into an UNO solution and it's the exact same
37:05
code that I can now run on any platform And the latest releases of Uno
37:12
also have a hot design which lets you um drag and drop design your apps at
37:17
runtime So while you're running your app you can open up this designer and make changes and it'll save those changes
37:23
back to your project and see them uh at
37:30
runtime and we're not doing the demo of Uno Uh final thing here the WinUI road
37:37
map So Windows app SDK 1.7 was just released and 1.8 is up next Uh they just
37:45
released the first experimental release of 1.8 8 Uh the new things in 1.7 were a lot of
37:52
things that people had in UWP that were missing Um background task manager is
37:58
now available in WinUI Uh camera capture UI so you can use the camera in your PC
38:04
to capture images Uh the new title bar we saw and the ooth manager so you can
38:10
do ooth authentication in your apps and they're working on a ZAML designer
38:16
The right now there's no UI designer for WinUI apps You have to handcode all your
38:22
ZAML Uh but they have started work on a ZAML designer in 1.7 and they'll
38:27
continue that work in 1.8 And this QR code goes out to the
38:33
road map for Windows App SDK And let's see if we have a minute
38:40
left I have one other demo that's not part of the slides but it's pretty cool Um in the current experimental releases
38:47
of Windows App SDK there's some AI stuff that you can do So this Windows C-Pilot
38:57
runtime This uh project can only run if you have a Copilot Plus PC that's got the local uh FICA AI model on it
39:07
So what this has let's just run it and you'll see
39:12
what we've got So this is going to use the local model on my machine And if I pop up test manager we
39:20
can watch the uh MPU do its work So here's
39:27
my MPU my neural processing unit on my
39:32
machine and you'll be able to see the uh the GPU and CPU activity as well as we
39:39
run this demo Let's see if we can resize this a little bit to get everything to
39:51
fit All right So here I have a prompt provide the
39:56
molecular formula for glucose and explain its properties and we're asking it to please u give us some markdown
40:04
formatting to make it easy to read So in these APIs there are different kinds of queries that you can
40:10
run against the local model You can do a general query which is just uh you know your usual questions that you'd ask the
40:15
AI Um you can ask it to rewrite your text summarize text if you have a a
40:20
multi-page item that you'd um paste into here You can ask it to summarize it and
40:26
you can also do text to table which will create a table of items from whatever you paste in there But we just do a
40:32
general query quickly here And it's thinking and we should see the MPU start
40:39
to take off a little bit Starting to get busy There it goes Meanwhile my CPU is pretty flat Not
40:48
much going on there GPU is also not working Everything's happening on the
40:53
MPU And in the code here I'm telling it to read the data
40:59
back to me as it's being generated So we don't have to wait a long time for the whole thing to be created before I show
41:06
you the output We're getting this streamed back to the app
41:13
asynchronously So we'll wait for this to finish up There should just be a couple more lines and then I'll show you the
41:18
code and we'll wrap up
41:27
This checkbox show progress This is what controls whether it feeds it back as it's going or if it just does one call
41:34
and wait for everything to come back And while we wait Oh there we go
41:41
It's finished The other thing I have here is a checkbox to say use a strict content filter So that will filter
41:47
content um has violence filters has different filters that I'll show you in the code
41:54
here super quick Let's close
42:00
that So here's where I'm checking if we want to um show progress So if we want to show
42:08
progress it uses this generate response with progress And then we've got a call
42:14
back to show the results as they're coming in If I want to see everything at
42:20
once I just make a single call to generate response async and I get everything in the result and populate
42:26
that at the end Uh the other thing I've got is the like I mentioned content
42:34
filters and I've got a thing down here apply content filters So if the check box is checked it's
42:41
setting all these filter options for violence uh hate content sexual content self harm content So all of that can be
42:48
filtered out with these filters And this is all running locally
42:56
nothing pinging the web for this AI call So like I said that's in the
43:03
experimental release Um hopefully it'll make it out to a stable release very soon
43:12
And that's all I've


