[Music] hi welcome Visual Studio toolbox I'm your host Robert Greene and joining me today is Daniel Jacobson hey Daniel hey how's it going good how are you I'm good I'm good Daniel's a program manager on the visual studio team that was correct and you are an expert in building Windows 10 apps sure yeah absolutely um you this app that you showed it net conf on channel 9 you also showed it at one of our internal technical events that I thought was just so cool that I wanted you to come on the show and talk to us about building window 10 apps using the universal Windows platform in the context of this actual application because I think it really kind of drives home why people should be interested in this and what the possibilities are it's not just about the surface it's not just about the phone so you know the universal Windows platform runs anywhere Windows runs and that opens up some really interesting possibilities such as sure yep you're going to show yeah so the real beauty of the universal Windows platform is being able to write one application and run it on any one of the Windows 10 device families which right now includes IOT as you see here does top mobile surface hub xbox hololens you name it so one app runs everywhere it's really things that no doubt are being worked on that we're not allowed to know about yes probably who knows so the inspiration for this application actually came to me when a friend approached me saying that they were interested in starting their own small business in Seattle a coffee shop if you will of course coffee Seattle make sense yes so what they wanted to do to optimize their chances of success being a new business was be data-driven be smart about the way they run their application so I thought this is a perfect use case for Microsoft technology I could build universal Windows platform applications that target multiple devices Usenet technology and Azure and pretty much build an end-to-end solution that would help them out so what I built here is a device that will help determine when someone enters or exits their store then send an event to an azure hosted asp.net web application which will be listening for those events then store it in a database and then when they want to review that data over time they can use a desktop or mobile application to actually look at graphs see how is my store trending how many people are in my store at different times in the day what's the busiest day of the week what's the busiest time of the day that way they know when do I need a higher help what days what times how successful are the promotions that they're running do they see a spike in traffic when they run promotions etc oh so that was the idea behind this and as you can see here the app design has quite a decent plethora of parts but it's actually a relatively simple application when you get into the nitty-gritty details for all of these apps so the IOT device really only has one class of code that actually does anything same with the Azure hosted web API it's really just a single class that does everything that's like 200 lines of code and then the client app is a little bit more involved we're not going to go through all the code but I'll point you to the github link after this so you can take a look at it yourself so the way this is going to work is on the IOT device which is what we'll spend some of our time it's it's it's more unique in modern application development era phones have been around for quite a while now same with desktops but these are up-and-coming so what this is going to do is based off of these devices I'm going to fire an entry or an exit event saying someone has entered my store or someone has exited in my store and when that's done it'll send an HTTP request sorry an HTTP request to my Azure hosted Web API listening for a post response which will then write the event information to a database including what type of event is it and at what time did it occur okay and then it will actually send a push notification to the device running the application so one example here is Sam in the back um it's a small shop I'm doing inventory work or I'm doing bookkeeping I'm the only one working at the time right someone walks into my store no one's there to greet them well I'll get a notification instantly saying hey someone has entered your store you better better go take their order so it's another neat way to reduce the number of people I need working yeah this is the modern Bell there you go who needs a bell when you have active smart phones and then finally when the push notification is sent the client at the data visualization app that has some graphs it's notified - hey update the number of people in the store and then it refreshes the data cool yeah so I guess we'll just go ahead and get started yeah so in Visual Studio I have a solution that I've already pre-populated with some of the infirm I'm not going to spend too much time on the asp.net application but as I mentioned this is hosted on github and only cut at the end but what I want to show with the asp.net application is how easy Visual Studio makes it to publish it to a live running web well web app so here's my API I'll look at the one class that I've actually modified most of this is from the template but here's my single controller of interest which has some metadata about my Azure services these are just keys and other private information that's all office gated from the code through a resource file then I have two methods of importance git which is just going to get a list of all the documents and post which is going to post a new document so it actually takes in the parameter my custom event from my portable class library so this is actually shared code and then it writes that to the database and that's pretty much it so two classes you can find those online but what is Keys hard-coded in the code somewhere yes so keys is in my portable class library and a resources file okay I don't want to show that to everyone cuz I can mess with my service here yeah so what I'll go ahead and do is show you how easy it is to publish so if I right-click on the application itself and I have the web tools installed all I have to do is find publish right here I sign in with my credentials which I've already done so it should cache it I can see my profile so I would select Microsoft Azure app service yep it would populate with all of my services select the servers okay and if this was a production environment I would just hit publish that's it but since I want to actually debug this later I'm going to go ahead and change the settings to make sure it is debug in ECP which I did that before so I'll publish and that's it so now this is actually going to send this code to my live running asp.net web application hosted in Azure yep so just to test that as soon as the finished pub finishes publishing we'll debug it real quick make sure this is working before we get into the uwp applications and while this is going the reason I want to focus on this one first is because as you can see both the IOT device and the data visualization app have dependencies on the azure app right so the IOT device is reading to the web app the client app is up sorry got that backwards the IOT device is writing you have a document through through this cloud service and then the client app for mobile and PC that's visual as I visualizing the data who's reading from it okay so as you're a speed on that first and then you WP publish succeeded I can see now in my browser here is my running application so what I want to do now is actually attach the debugger to that and make sure it works so I'm going to press a breakpoint on the post event go to cloud Explorer another tool within Visual Studio I don't have to leave the IDE navigate to my web apps shop analytic service right click attach debugger and then that'll try to find the live running process to attach to in my Asscher service so it will launch the service and if I return to visual studio once I see the breakpoint is ready to go I should actually be able to send a post method to my live service and hit this breakpoint make sure it's working so I'm using a another application called postman which is just a simple web debugging tool that enables you to send HTTP requests to any website you want and what I have here is a pre filled out body so I'm going to send an event type event to my live service that is event type of true which means someone has entered the store and I'm going to send it for today which is September 1st it is so let me go ahead and change this oh if it will let me that's interesting post body oh that's why I was in the wrong one September 1st and this is 8 p.m. global time so 20 o'clock ok I will hit Send I should hit the breakpoint I hit the breakpoint as expected it is loading the information so now I can actually take a look at the variables that are being passed in so a new event crew a fight time you'll see 9 or September first 20 o'clock I can continue to execute this code and now I should actually see a push notification on my device so this device had been previously registered for the push notification service um so even though the app isn't running the data visualization app isn't running because I had run it in the past I'll get the push notification so what that means is if I've got my Windows 10 phone and I don't have the app up and running but someone enters my store I'll still know that they're entering my store right which is pretty cool so I'm pretty confident that's working now I'm not going to worry too much more about the asp.net application let's actually build the uwp application so one thing I'm going to do is actually continue to attach the debugger to this running service and I'm going to build the IOT app in another instance of Visual Studio you'll see why in just a bit so let me open another version of Visual Studio with the solution open there we go and I'm going to actually start from scratch I'm going to add a new project to the solution I don't have an IOT client project tip so I'm going to right click on the solution I don't need cloud Explorer since this is a client up I don't need to worry about this controller anymore now we'll minimize that so let's go ahead and add new project and I will just select blank Universal Windows platform application and I will call IOT client so as soon as I create the project it lets me select my target platform version in this case I'm going to choose the anniversary edition I like to play with the latest and greatest stuff go ahead okay so to get started with this app and for those of you who have worked on IOT devices before what you'll recognize is a lot of the code is just boilerplate code that essentially defines where all these devices are registered on the IOT device and the breadboard so I can say this device is here I want to communicate with this device is it an input or an output device it's really not any logic it's just kind of getting getting everything set up so I'm not going to write that code that codes boring I do want to write the logic so what I'm going to do now is navigate to the main page of my application woops that's the wrong one and I'm going to include that code so let me go ahead and find that code does stops it bits and I'll walk you through what this code means it's just not as exciting to write it cool so let's start at the top I see a lot of squiggly lines that's because I'm missing some references so to start with keys as I mentioned before is in my portable class library so I can add a reference to the same portable class library that's included in my asp.net application I'm sharing resources across both apps the next thing I will see is missing is GPIO pin I can hit control dot to add a reference to the class if I go further HTTP client is missing the references I'm just going to resolve all my references so GPA what someone opere keys actually have to add a reference to the portable class library so GPIO status is actually not something I can resolve immediately what this actually is is a representing a text block on the UI so because it is just a Windows 10 application in order to help me debug that I'm doing everything correctly I just added a text block to the UI of it okay so let me go ahead and navigate to the zamel and for those of you familiar with sam'l development this is just as a molap I will add a textblock X colon name whoops equals GPIO status beat the designer but that's alright horizontal I'm an equal center vertical alignment Center and then I'm gonna make it really big so we can actually see it 72 now I should be able to reload the designer there we go now let's since I closed my tag so I'm not going to see anything here yet but when we run run the application you'll see that so if we return to the code behind that results down no squigglies and all that remains is to event handlers and I'll explain those in just a second but that's what makes a IOT development with Universal Windows platform really easy Wow so I'm just going to create empty methods to handle those for now okay and let's take a look at what this is doing and then just deploy it and see what happens so if I go to the right top the first thing I'm doing is defining the base URI for my azure Web API and this is essentially going to be used to send the post message so I'm going to construct my HTTP client object with this as my base URI and then when I send the post message it knows ok target the right live running servers right these pins if we take a look at the schematic for this device are just actually mapped to pins on the Raspberry Pi so you can find diagrams for the the specific bread where the specific IOT device that you're targeting that'll have a pin mapping for all of the digital devices that you'll be connecting to it ok so if I take a look back to the code 5 and 17 refer to the pins for my sensors so that's what we have here we so that's what we have here yup connected to a breadboard on metal board and then the breadboard has wires connecting to the Raspberry Pi device and correlating to those pins that I specified so the black wire here is ground red is hot so it's the voltage and then the four colors are just different digital devices connected to the pins that enable me to control them through the app okay yep so for somebody who has is a good c-sharp coders done built apps it hasn't really played with the Raspberry Pi know how long look how long does it take to get to the point where you could wire up sensors like this like this yeah probably a day maybe thank you okay yep so I built this in an afternoon and the only previous IOT experience I had was Arduino based it was not uwp it's you don't have to be electrical engineer done soldering I mean so so though in the past right the commonality that all of these devices have is that they're all just digital devices okay they're all very they'll behave similarly so even though I'm using an IR beam sensor here it behaves just as a button would I mean it's going to have a value of 0 or 1 depending on the state of the device so if it's a button and it's pressed it'll have a different value than when it's depressed just like when this is covered versus when it's not covered it'll have a different value okay and is there good introductory material on let's actually show you where that is so if I just search for Windows 10 IOT core on Bing what I will find is tons of documentation so if I just select learn about Windows 10 IOT core there's really great information about what it's like to develop for these boards including examples that people have built so an air-hockey robot and then some tutorials as well so if I click on documentation and I look at the samples hello blinky is essentially the hello world of IOT development so I could select c-sharp C++ does it show you and it shows you exactly how to buy everything ok so to get started it tells you exactly the the hardware you need how you hook it up together and here's the pin mapping that I was referring to before so this is actually the same board that I have and as you can see here GPIO 2 and GPIO 3 are just the numerical pins that I'm referring to here so 5 17 4 and 6 are the ones I'm using so 17 5 6 and then 4 I think is here so all in the same thing yep so it's not too difficult so that's what those are referring to those are just the constant integers that define where I'm plugging those into my raspberry now these are the objects that are actually going to reset represent those pins and then these enter and exit boolean's are going to be used for the actual logic of the code so we'll explain that in detail as I'm writing the code and then client is my HTTP client that is going to be used to send my HTTP web request to my live running service finally the last thing you need to do is actually initialize the GPIO controlling so you'll pretty much see this method in any of the tutorials you go through for an IOT device development but once you have all of the GPIO pins determined first you make sure that a controller exists on the device and what this means is if I were to deploy this application to a desktop or a phone it would hit this line hit this if statement and GPIO would in fact be no there's no GPIO controller on my surface yeah so then it would return out of the method yeah at least nothing that I can control um so then I would send there is no GPIO controller on this device and my application wouldn't do anything that's it so nothing would crash I'm only using the universal API set right meaning I don't have any platform specific API is everything is just common and then I'm actually opening the pins for those four sensors so as you can see GPIO pin I'm defining the sensors and opening the pins okay so after that I need to say is it an output device sir is it an input device so these LEDs are output devices I cannot interact with them the values never going to change I can write a value to them I can say it's on or off but I can't read anything from it so when I set the drive mode for the lights I set it to output and then the sensors are the opposite they're all they're going to give me a value back when I cover it or uncover it so those are input devices just like a button would be okay um after that the debounce timeout is really just to filter out any noise from the IR beam sensors so for some reason the the value changed for 50 milliseconds really really quick like unregister below something that was undesirable it wouldn't actually cause anything to happen after that I just create value changed event handlers and that's really what IOT programming is all about when something happens the value is going to change I have some sensor that changes the value and then I respond to it so what I want to do is I want to place breakpoints on both of these and deploy my application to this device so first I'm going to make sure it's my startup project set a startup project I'm going to select a debug and I'm going to choose armed because I'm debugging to an armed device Raspberry Pi 2 has an ARM processor would finally - electro machine it's hooked up to the network and I'm going to copy the IP address from before and to play so while this is deploying the very first deployment to a Raspberry Pi takes a little bit but it's a $30 computer so you can only expect so much after the radio first f5 oops I it speeds up drastically and you know you'll observe in just a moment so while this is deploying I do want to explain the logic of how this device is actually going to work so if we go back to the PowerPoint I can see this is kind of the overhead view of my device so if I were looking at it like this yeah this is what I would be seeing okay and I can see I've got my customer ready to enter the door it's my ninja cat riding a t-rex with the Microsoft flag and I can see both of the boolean values are going to start at false right meaning they have not crossed any of the sensors so as soon as my customer enters through the first sensor so they've gone half way through the door yeah I change the value for my enter device I know the value of this sensor has changed I can respond to it and I can change the boolean value that I'm tracking as it continues through the door I can now see both of those boolean values have been set to true or in this case both of the sensors have been broken right and I know an entry event has occurred because entry sensor was fired off first and then exit sensor right now if the reverse were true if it went through the exit sensor first and then the entry sensor that's an exit event someone's walking straw just went like that and messed with you so someone so actually if you look at the github repository and someone goes like this and messes with you so that it messes it up I actually have a timeout after a couple seconds and nothing happens it resets the state of the device another example could be say a fly goes by and it messes it up right yeah so so there are ways to counteract that and if you just know some simple c-sharp programming it's pretty easy to do okay but for the purposes of this we don't worry about that case so as soon as the event is triggered though I'm going to immediately reset the state of the device so that when the next customer comes through it's ready to go it needs to respond instantly so let's see so the application is almost done f fiving should take just a couple of second it's kind of like using an emulator takes time the first time yeah I understand right get everything over there you're good flanked to you a device sits and then this app along with dotnet runtime the subset of it yep in all likelihood that runs on this device right dotnet saw dot nets already on here right the runtime so you're copying the literally you putting on it just the executable so in this case it's everything that comes with the application so all of the references all of my new get packages so the it's interesting you mentioned the DA at runtime so with the universal Windows platform you can actually package your dotnet runtime as a part of your application okay so since this is a debug application it's not a store application it's actually deploying but net basically okay however if I were submitting an application to the store for example that shares the same exact net runtime as all of the other apps in the store obviously we're not going to include that version of the.net runtime with every app so there are shared frameworks that you can take advantage of okay um but you can actually change the version of the dinette libraries you want to reference through nougat it's pretty cool cool and then how much storage is on this device how many so it's like this can you get on there it depends on your SD card so I actually have a micro SD card on here AC but that actually has the operating system as well so if I want to flash this device with a new operating system I can take out that micro SD card plug it into my computer download the latest preview build of IOT core and plug it back in and ready to go alright yep so great so the application has gone and it looks like a breakpoint was already hit probably when I reached over yeah so I triggered one of these sensors and we'll go into more you to get the exit further you've reached through I think you actually exited the store I think so I always get it mixed up which ones entrance and which ones exit so now might just have to turn it around but okay I trigger one of them first but what's interesting is I just need to know what is happening when that breakpoint is hit what are the values that I'm tracking at this point so in this case I can see the value has changed for my exit sensor and I want to track the arguments that are being passed into this event so I can just use Visual Studio debugging tools to look at the local variables and see that args that edge is equal to falling edge and I know that seems kind of cryptic almost but this is the the parameter that you're going to track with most of the digital devices that connect to these IOT devices and if you did more of the tutorials that would become more obvious but even if you don't do the tutorials you can figure it out just some clever debugging right so what that means is the instant that that breakpoint was hit meaning means the sensor is broken right and when the sensor is broken args that edge is equal to a GPIO pin edge falling edge so that's how I track if it's broken if it's unbroken it's going to be equal to rising edge okay and those are just enumeration values so I can stop otherwise I'm going to throw an exception and use that knowledge to finish my logic so this is the important part and then for reference the beam is broken and now else the beam is unbroken there are really only two states for this device your long effectively so now I can write the logic for my application on here using those if statements yep so as soon as the beam is broken that's when I want to set the boolean value to true so since this is my exit sensor value equals value changed I need to set exit equal to true now if the enter sensor had already been fired that boolean value would already be true meaning this one was fired second that's when I know what event has happened right so if enter now I'm going to say customer has entered true that means someone has entered my store that method doesn't exist we're going to write in just a moment okay else well exit is already equal to true otherwise I really don't need to do much so in this case actually want to break out of my method and not do anything else did the backwards from how I normally do it normally I put exit equals true at the bottom but it shouldn't really matter okay so the only other thing that I want to do if enter is equal to true is reset the state of the device as soon as I fire off the event so I reset both of those boolean values to false so now it's ready to go for the next person so the code in customer has entered is what's going to send a message send the event to Azure correct okay yep so now um if the beam is unbroken I actually have a light to track when the beam is broken and I'm broken for debugging purposes that's all that's going to happen here so as soon as the beam is broken let's turn the light on so exit light dot right GPIO pin valued low and if you do blinky that the hello world of IOT devices letting that line of code we're pretty similar the light so the LEDs here's red and yellow LED in the device yeah so now I'm just going to copy and paste that to here and I'm going to write the value of hi to turn it off and that's really all I need to do for this so I can just copy and paste this segment into the customer has entered method oops sorry no the entry sensor value changed method and let's take a look here so let me lower the output a little bit so we can see everything so now if our edge equals GPIO pin edge falling edge they're the same exact devices this is the same exact behavior this is right the only thing that's going to change is now I'm working with the entry sensor right so enter light enter equals true whoops and free light yes entry light now if exit so if exit was already fired I'm actually going to be sending an exit event so exit was fired first and then enter I'm still going to reset the state of the device that is the same else entry light dot right GPIO pin value hi so the last thing I want to do is remove the not implemented an exception here and just place a breakpoint to make sure that the events are working as proper or as we expect before we before we send a message to the edge of your website let's make sure we're getting the right expected behavior right so now you'll see deployment should be much faster this time deploy succeeded that was much faster yes there you go so the breakpoint is ready to go so the first thing I'm going to do is just cover one of these oops sometimes when you have some bright lights like a studio light it interferes with the censors but if I cover this one pretty closely I can see the red light is turning on the lights blinking yeah so now if I cover this one the yellow one I can see the lights actually staying on because a break points it so the code is not continuing to execute to turn the light off all right so here I can see in this case V is false that is an exit event so that is going out of the door that means if I were to continue execution of the code and go the other way it should be true so let's try it let's cover yellow first and then red so again breakpoint and now I see V is equal to true yeah red stays on because again the codes not going to turn the light off until it continues to execute right so that's all I need to know so my entry and exit events are working properly on the device now let's actually do something with that information so again just using c-sharp code I can create my object triggered event which I need to first add a reference to my portable class library models folder let's call it event T event equals new trigger event and I'm just going to go ahead and create the event in line so event time equals state time dot now event type equals V I'm thinking I might actually I have a theory that when I'm gone my cat just sleeps all day long I don't be able to find out yeah that you could actually use proximity sensors instead of IR beam sensors so instead of tripping a beam if it goes near it you could also trigger an event right so you can track things at the home you can use this as a security device or some type of monitoring if you're one of those data obsessed people as well you could figure out where your cat spends the most time in the house I know her just by all near the bed so I already know that but a sense in another bed and you could actually calculate how much time spent under the bed versus other other places so lots of funny stuff you can do so I've got my event now I just need to actually create the content to send to my HTTP a web application so HTTP content equals new string content the string itself is just going to be T event to string and then I'm actually going to use some of the overloaded parameters to send the media type so I'm interested in telling my asp.net application that this is Jason that I'm sending because of my tea event to string method I overload it I can actually navigate to it to return the json serialization of that object and that's that it works properly with my asp.net app so let me just do encoding dot utf-8 and then application jason and one thing that i always accidentally do is do forward slash or backslash always get it confused so I can make sure I do it right application slash JSON perfect cool so the only thing I need to add now is I just have to post it so this is the one I want content should actually give it a name and now all I need to do is HTTP client which already have open sorry client I already have my HTTP client I don't need to recreate it dot post async the request UI is going to be API slash event and I'll show you where that comes from and then the actual content so the API event is just what's appended to my base URI so my base URI is shop analytic service as your website's net API event is what's at the end so now if I were to do this so how does it know where did you specify the base URI so I specify up right yes so I specified the base you are I lost debugging to my life service sometimes it times out so I'm going to test debugger again and you'll see why very very soon so up above is where I specified the client information base UI equals keys that has your web app AP UI and then when I actually create the client in main page load sorry at the bottom clavicles narrating yeah ok client equals new HTTP client so yeah so as soon as this page loads what I do is I create my HTTP client with that base address and then I initialize the board right yep cool plot explores um let's try it touching one more time sometimes you get finicky behavior with live writing services so anyways let's go ahead and actually deploy this application to the device and set a breakpoint when the customer has entered the store what or exited depending on the parameter passed through and just so we can track the entire this codes running on the device this code is executing on the device and you've set a breakpoint it's going to show up in visual studio because you are debugging on the remote machine I'm deep but I'm doing remote machine debugging on the IOT device yeah so remote machines bugging has existed for a long time I could do PC to PC yet but now I can do PC to xbox pc to IOT PC to surface of Xbox you name it let's see what's going on with this one my life service is not behaving so well but that's okay we'll go ahead let's see a breakpoint perfect this should be true someone has should be coming into the door so on my local variables load V equals true yeah I can hit f5 again and now what I should see is as soon as it sends the event it has executed properly I should get a push notification that's where I was saying my life service my other reel so a little bit delayed but someone has entered the store example seconds later now it's interesting is I can actually view all of the events that I sent sent so far again in Visual Studio so if I go to document DB accounts loving that because it's just unstructured data and no need to spin up a whole database so this is I'm actually using yeah it's just a list so I'm using document DB which is a no sequel database all it is is a JSON document for the demo I just have a single document but one of the things we're working on in the repository is making it more scalable to use the the no sequel query that is supported so creating a new document for every event and then a collection for every month for example and then we could kind of parse it however okay but you'll see why I use a single document when I copy and paste all my fake date and it's really convenient so if I find my document C document EB is very powerful but I just have single document I can go ahead and load and here we go so at the very beginning we did 20 o'clock ah a clock global standard time and I said true and then I've done one real event that I sent through the IOT device which happened just a couple about a minute ago which is 144 and it's now 145 yep so that is the real event and I didn't have to leave visual studio at all for that so now just for convenience I want to show you another tool that you can use for document DB to copy and paste the data so you can actually see the data when I run the next app okay so in the azure portal i can again go ahead and refresh this document this is the live document here are the two events that i was just working with now let me go ahead and find my fake data i have a lot more than just that and this will actually make the app look like something there we go many more events so I can go ahead and save that okay and not my database has been updated with that data so makes it really easy to schedule in going linked better than going about 1,500 times exactly although we get lots of steps on the band my mom would get really tired though so I'm actually going to break out a Visual Studio 2015 for now but first I want to deploy the IOT device so I'm not going to debug it I'm just going to hit ctrl f5 to deploy it without debugging and that will just continue to run it on on that IOT device for pretty much ever okay um so I think one funny example is I went on vacation and deployed it before vacation came back a little over a week later it's still running fine I came back and swung my hand across all the lights on the push notification cool it's pretty reliable no crashes or anything like that so deploy is succeeded I can go ahead and close this instance at Visual Studio let me go ahead and get rid of this instance of Visual Studio I don't know why that debugging wasn't working that's okay and let's take a look at Visual Studio 15 preview which which preview version is this so this is the next major release of Visual Studio or agile studio 15 preview 4 is available to smore this is actually beyond 4 but now okay so this is latest and greatest sigh you never know what could happen hopefully everything works properly so 4 is available publicly and this is something past that yes something password is available publicly right this is one of the beauties of working at Microsoft is getting to play with daily bits of everything it's awesome so let's go ahead and take a look at this application this is what's going to visual the data mm-hmm I really just have one page that I'm doing there's a lot of code that processes the data behind the scenes and that's where again we can optimize our database structure to just do that in the cloud using querying but for now we're not going to worry too much about it up here you go we might have some intellisense bugs with this version of Visual Studio but I don't think we need it if we're not actually gonna write too much sam'l but the designer works so that's good so let's take a look at the designer first to see what this looks like so on a phone I can see I have a grid here mm-hmm and it's a little easier to view the structure on a desktop first because of adaptive code so if i zoom in I can see I effectively have a grid within a grid so here's my main grid is the outer entire rectangle is the first main grid and in that grid I have two rows this is the first row and then this entire thing is the second row so the first row just contains my coffee shop name the hours and I'm open it'll also give me information about when the data was refreshed then in here I have this picture that tells me how many people are currently in my store okay it's really busy and people are like lining up to the door or something I want to know how busy it is and then I have three graphs that will be displayed in quadrants and what I do is I actually write this adaptively so that if it were on a phone I would just be able to scroll through each of those charts so I can see here's one of the charts below and then it's not going to show you the rest because it's cut out of the UI but I could scroll through it and I'll demonstrate that as well so I'm going to go ahead and just deploy this application and what I want to show here is one of the new features that's coming out in Visual Studio 15 for zamel development to really help you build performant zamel apps okay so this should take just a second I'll also show you a couple of tools that have been out for a little while now but a lot of people still don't know all about them they've only been out for a little over a year so this application is running so let me close some of this so what I want to show you first is what is new so inside of the Diagnostics tools window we have these Diagnostics wall debugging tools that run just while you have five rewrap there's a new one called UI analysis for uwp tools now this is not on by default since it's brand new so for those of you watching if you want to turn this on all you have to do is click select tools check on UI analysis and then you'll have to reset the debugging session okay it's pretty painless but what that does is it gives me a whole bunch of different events about my application and the performance of my application so the number one is using binding instead of compiled bindings I'll have to go ahead and fix that at some point but the one that I want to show you is one that actually surprised me and I found out about this because of this tool so let me restart my application here's the app you can see all the data let me restart my application and describe what I'm doing that is bad that UI analysis told me about that I had no clue about it's actually pretty cool so when my application first launches I can see I don't see much except for this loading ring right and what i'm actually doing behind the scenes is i'm creating these objects and i'm just hiding them so i'm setting their visibility property to visibility collapsing and what that means is on startup it's still loading that zamel control into memory it's having to do the processing to create it and just not doing anything with it right and what UI analysis told me is let me find one of them here we go element numpy 'pl in store of type 1 RT it's the the charting control was collapsed at load time so it told me that collapsing an element or setting its opacity to 0 will not prevent the element from being created so it is creating the element it's using processing power it's slowing down my startup time well that's something I definitely want to fix so not only that but I can actually this is going to work it might be broken because of this it's the problem with daily builds so when this is out if I double click on this it'll take me to the line in zamel that is causing that to break mmm so I can actually just go ahead and navigate to it so numb people in store right here so here's the chart so now what I want to do is change one of the properties so it's going to be hard without intellisense but I can do it so X : the flirt load strategy is the way to fix this oh I do have intellisense lazy cool just I don't have the highlighting I guess so I'm going to set a property called X : to furloughed strategy equals lazy on this chart and then I have to do one other thing so I have to navigate to it in the code-behind up one other tool that I always do this myself I've just gotten so used to it samo edit and continue is another new tool in Visual Studio 15 as you'll notice this application is still running I'm still debugging is app and I just added that property to my zamel without having to stop anything and I just did there because I'm used to it now so I think that's really going to transform the way people create sam'l applications yeah so I will stop it because not going to have to edit the code behind let's go ahead and here and let me make sure I get the right property name so X not num people in storm so the way I'm going to get rid of that warning and UI analysis is I'm going to set that property and then I'm going to call some it's somewhere in the code where it actually makes sense to finally load that element so it's not going to be read at startup it's going to be when I have the data available to actually make that chart meaningful so I'm going to look at my code and I can see on main page loaded I get the data and then I set the data context and as you can see I already did it for a different control before but if I do this dot fine name num people in store this doesn't actually do anything but it tells the code hey I need to create this object I'm trying to do something with this object so it will create an airline so this is going to retrieve the object that has a specified identifier name so in trying to retrieve it it's telling the sam'l hey you need to create it so now if I run this again I should only see five I guess infractions of that specific UI analysis time so here we go so now if I go back here and I sit select filter you analysis it's down to 48 instead of 49 visibility collapsed so as you're debugging what's amazing about this is since its while you're debugging you'll catch these as you write your code so rather than waiting until the very end doing your post-mortem profiling you're at all ready to go oh wait you have 60 performance things to fix on your UI threads well now as you hit these issues you just go ahead and fix emit persuade yeah so the last thing I want to show is UI debugging is my UI debugging that has can you get those before running is there a no so those are actually calculated at runtime so there's a process running that will tell you that this issue is occurring okay so the last thing I'm going to demo is actually in Visual Studio 2015 with this same application and I want to show it because not many people know about it Oh hardcore example developers definitely know about it now but there's still a lot of new developers that are not aware of this feature and I want to make sure it's pretty evident to them that they have this tool toolbox available to them so Sam will you eye debugging is kind of the precursor to zamel editing continue which I showed you before and I think it might be a little busted in Visual Studio 15 but that's what happens when you play with today's build yeah so let's go ahead and hit f5 it should still work I've seen that warning before it's because I forgot to add a reference to my portable class library but the binary output of this folder is enough to get it to work because in another project I have the reference it's confusing but yeah the app works I just want to show the same with your ID buggy so live visual tree now I can see it so here I've got this actual Dorner in my running application let me go ahead and actually while this is running let me show you the adaptive UI nature so if I make this really skinny after a certain point it makes everything in a single column and I can just roll down so the behavior on the phone is I just go ahead and swipe and I can see everything working but now let's say I wanted to change some of the styling on this say I don't like the size of contoso coffee shop I can go and click on the adorn er is that always been collapsible like that uh since update three yeah Wow cool and it's also you can do it start it showed up so you can also hide it I didn't notice collapsed this one is right so you can get rid of it entirely if right interfering with your app so are on the topic of getting rid of things go back there yep why is this decision tools options so that's a global setting a frame I never ever wanted I never ever want it unless I explicitly turn it on and I shouldn't have to go into abductors oh yes for every single one and get rid of it yes sure that's good for you we've actually had this feedback before there's there's two sides of the fence there's the people who actually do use this information line that's why examples options you said it globally alright I'll take that back to my time thanks it's a great feature but when I'm building an applications give them away I didn't know if that if the thing works yet I'm frame rate is one of the last things I'm gonna check that's true never the first thing yep okay but you can see kind of see that's one of the benefits of having a show and inviting there you go close to the product any prior wisdom so what Sam what your ID bugging does is it lets me select that control and then when that control is selected in my effectively this is kind of like the Dom for those of you have to web debugging I can see all of my visual elements that are at runtime and this could be programmatically generated controls if it has this next to it it means it was user generated in a page okay so I can actually click that to navigate to the control in the sam'l so let me actually just show the same oh so that's the textbook that I'm actually looking at here so this version of Visual Studio does not support sam'l edit and continue but the power of that is I can use them or you I debugging to find the control right then I can use the live property Explorer to modify local properties of it so I can set that to 30 to make it bigger I think that looks a little bit better and now if I were to stop this application and run it again it would revert back to 24 right but with zamel edited continuing editing I can then after testing am a lot property explorer I could then edit the zamel file while it's debugging changes the values of the property hit save and then just keep going and I don't even need to stop the application so that's cool yeah it's pretty powerful one of my favorite new features in Visual Studio 15 oops don't know what I did there Ike's and I hit alt tab I wanted to go back to this one oh it's still gone but yeah that's those are some of the new tools cool any questions umm yeah one question so the the PI Raspberry Pi sends a message to the azure service yep which then use notification hub to send a message out to the client right yes okay so some someone a event-driven model where an event is fired the azure service kind of wakes up that sounds like what Azure functions are so did you consider using Azure functions ah for the server side so I initially didn't consider using Azure functions mostly because I wanted to demonstrate the power of sharing dotnet code across all of these different platforms so I'm using uwp I'm using asp.net and I'm using the same code for all of them yeah but as your functions would also serve the purpose of what I'm doing okay cool yep but just to show this one last time as I'm running this it should trigger an event and I should see current people in store either increment or decrement I don't decrement that was exiting so now I don't want people in the start so I got this way then it should go back to zero cool and it's pretty fast so ready oops I might have missed oh yeah they got one so takes two seconds three second clearly notification and update it so you could have that you can have a screen like this in the window of the store shows the number of people in the store and what the average wait time I could eat that too yes I can hook this up to my register so so one of the things I was considering just additional functionality is having register functionality in this app and then I could do how quickly our orders processed how much is the average order I could show correlate this data with money instead of just how many people in the store if I'm running a promotion maybe I'm giving discounts so more people might not equal more money yeah it's such a but the last thing I did want to show is a couple resources for this mostly the github page I think that's what's all this all the code is up in github yeah for both the client and the server and if you have any issues with it or any questions raise an issue or tweet me at pm at Mike this is going to be a living repository for awhile who makes a good sample of all the different services available to you and did they open the coffee store are they using this are they using it today now so this is still just v1 we have to first create our printed circuit board and put it in not um no not yet okay maybe Sunday thanks so much yeah all right cool this is a great example thanks for coming on and showing other problems yeah lot of fun alright hope you enjoyed that take a look at the code play around with it let us know what you think and we'll see you next time on Visual Studio toolbox [Music]
Wednesday, 23 October 2024
Build triple A games with C++ in Visual Studio 2022
[MUSIC] >> Hi, folks. My name is David Li. I am the C++ Game Dev PM at Visual Studio. I'm here to talk to you about some new and exciting changes in Visual Studio 2022. Recently, our CEO, Satya Nadella, has said, as a company, Microsoft's all-in on gaming. At Visual Studio, we're all-in on gaming too. We have been creating new and exciting experiences for Visual Studio based on your feedback. Whether your Unreal developer, an indie game developer, whether you make your game on our proprietary engine or work on AAA game studio, let me show you why VS 2022 is the IDE for you. First, let me get started with the demo on Hot Reload. Now for game developers, this might sound familiar to you. Have you ever spend 30 minutes playing your game just to get to a specific state? Spend all those minutes and hours getting to that state just to find out your bug fix didn't work? Or if you're a technical artist. If you repeatedly have to restart a game just to see your [inaudible] iterations, Hot Reload is a feature for you. Let me show you how Hot Reload works. Imagine you're building an open source, cross-platform [inaudible] project like Bitfighter here. In Bitfighter, you have a ship that has a red round shield. You can activate the shield with a press of a button. Now what if you want to make the shield a little bit more exciting? Let's do that in Visual Studio. Here, instead of the color red, I'm going to make it cyan, and instead of a circle, I'm going to draw a star. Normally, without Hot Reload, you will have to close down the game, rebuild it, and click through the menus just to get to the same state. With Hot Reload, all you have to do is to press the "Hot Reload" button. It takes a few seconds for Hot Reload to run. Let's see here, a giant 10-point blue star. Isn't that crazy? Oh, okay. Maybe that's a little bit too exciting. Let's change it back to something a little bit more reasonable. Instead of the star, I'm going to go back to the circle. But this time, instead of red, I'm going to change the color to gold. Instead of pressing the "Hot Reload" button, you can also activate Hot Reload on File Save. To enable that, go to the dropdown next to the Hot Reload button. Click "Hot Reload on File Save". Once that is enabled, every time you save the game through Ctrl +S or the Save button, the change are automatically applied. Here, a gold round shield. Hot Reload supports any changes that are currently supported by Edit and Continue, and is not limited to only game developers. With Hot Reload, you no longer have to close your application, recompile it, get the application back to the same state, only to find out your fix doesn't work. Instead of spending minutes and hours getting to the same state when debugging, take those precious minutes back with Hot Reload for C++. Next, let me show you a demo with Intellicode for Unreal Engine. We build Intellicode for Unreal Engine by parsing many Unreal Engine databases and making an AI model. When enabled, Intellicode for Unreal Engine shows up in Unreal projects. For established developers, Intellicode saves time by suggesting the most common suggestions and sorting them to the top of the member list. For new developers, Intellicode suggests the right APIs in the right place. For Teams, you can train custom team models over your codebase, which makes the effects of Intellicode even more powerful, but providing suggestions on internal types as well as more specified suggestions based on your Team's coding patterns. This also makes it easier to onboard new developers as it help suggest things the Team is using elsewhere. Here, let me demonstrate how Intellicode works with member access. When you press a "Dot", Intellicode suggestions will show up with a star. The star denotes that this suggestion is from Intellicode. Similar down here, when you press the "Dot" operator, you'll get another Intellicode base suggestion. Down below, the Arrow operator also brings up a list of Intellicode suggested suggestions denoted by the stars. In this case, the top suggestion is GetController. With Intellicode for Unreal Engine, power up your experience of developing Unreal Engine games in Visual Studio. We have been working closely with Epic Games to make a great experience of developing Unreal Engine games in Visual Studio. Haven't tried the Unreal Engine? You can check it out under the game development with C++ workload in the Visual Studio Installer. One of the things that we have been working with Epic Games is increasing the responsiveness of IntelliSense. IntelliSense for UE projects is now significantly more responsive due to utilizing PCH when generating VS project files. Look for this new updates in a new version of Unreal Engine 4.27 coming soon. Similarly, Intellicode for Unreal Engine 5 is coming in an upcoming release. What do you want as an Unreal Engine developer in Visual Studio? We want to know. Connect with us on Twitter, and leave us your feedback. Aside from making Unreal Engine IntelliSense improvements, we have also been making core performance in C++ IntelliSense improvements in Visual Studio 2022. We have made a test based on Unreal Engine 4.27, a large project, and benchmarked it with VS2019 against the VS2022. The timings we're taking when VS opens a project for the first time and subsequent times average over three runs. Visual Studio 2022 feels faster when getting to code. You can get to code quicker in Visual Studio 2022 and open the file twice as fast. You can also wait less time for IntelliSense ready. Get the syntactic highlighting and code changes to appear in member list twice as fast. With the new improved IntelliSense performance in Visual Studio 2022, you can save seconds each time you open a file. We hear pain about IntelliSense performance with game developers. Now these are only few seconds each action. But imagine, how many times are you opening a file every day? How many times are you waiting for IntelliSense to open every time you open a new file? These are only a few seconds but add up over time. Especially for bigger projects, this will scale. These are small numbers, but they add up. We want more feedback because we aren't done making improvements. Install Visual Studio 2022 side-by-side with VS2019. We want to make it easy. VS2022 is binary compatible with previous C++ two sets in 2019 or older. If you are coming from VS2019, you may be familiar with our built throughput improvements. Let me briefly tell you what you'll gain from upgrading to the latest tools. Using the latest tools, the Gears 5 team at The Coalition saw a 2.6. seven times faster end-to-end build time and 2.8 faster link time compared to VS2017. Similarly, at Turn 10 Studios, they saw a five times improvement and link times for Forza Motorsports. For Forza Horizon 4, the link times are now 18 times faster than in Visual Studio 2017. The decrease in build time enabled Playground Games to switch from /DEBUG:FASTLINK to /DEBUG:FULL. You can enjoy all the benefits of the latest toolsets by upgrading VS2022. When you load your projects, you'll be prompted to upgrade, but you don't have to. You can still use the old compilers and the older toolsets and they will still work. You can enjoy the IDE experience of Visual Studio 2022 that way. Third-party libraries that will also work. Don't have a package manager? Try vcpkg. Download Visual Studio 2022 today, and try out all the new and exciting features we have in store for you.
Build 2023 - Advance developer tips and tricks in Visual Studio
[Music] hello everybody and uh welcome to this last session of the day the last session before the big celebration is happening somewhere behind us here in a big room and um I'm very very happy that you have chosen to share this time here with us today because we're going to talk about some cool tips and tricks for visual studio right productive developers are happy developers and this is very important stuff so we want to make sure you have a good time I know you kind of want to get to that celebration get some food get a drink maybe so let's have a good time let's have some fun and if you have any questions please post them to the usual place online we got the Jim and Vera sitting over here and Matt and Andy sitting remotely helping to answer the questions as we go along and if we have time at the end we can take some of the uh the bigger questions at the end of the session here so um let's just get to it all right so here I have a project oh look at this hang on oh you know what it is look at all my tool Windows it all looks like a mess here what happened was that before I plugged in up here I had my laptop plugged into like a large monitor that's really wide so I had all this room for Tool windows but now it looks kind of all crammed in so let me just uh fix that real quick there we go or as I like this here fresh car smell this is my favorite uh way to start Visual Studio in the day Windows minimized oh very very nice and I can just go between all these layouts here all right here's my wider screen layout here's my web layout and here's my fresh car smell so this is not a new feature I'm showing you here I'm doing this with a single keyboard shortcut to move between all these it's called saved Windows layouts the reason I want to show you this is because I know we got data on this that you don't use it so what you do is that you create all your tool Windows you drag them around you put them in the location you want maybe multiple monitors you have solution Explorer on one side and test Explorer on the other whatever it might be and then you go to window and just hit save window layout when you do that that gives you a bunch of all your saved layouts you can give them any name you want and very easily you can change between them so that's what I did with all the keyboard shortcuts here Ctrl alt and then you know one two three four five however many you've got so a little tip to get started all right so this project I Got Loaded here it's a web API project asp.net and it has swagger so it renders this UI when I run it in the browser that's what it looks like so I can see all my endpoints but Visual Studio has never really had that ability for me to really quickly get a glance of what are the different endpoints that I have in my app so if I do my saved window layout for my web workload see I don't just have a window layout for each monitor configuration I have one for the different types of apps I'm building so when I'm in web mode here I want to show the new um endpoint explore shows up here so this looks pretty much what we saw on the Swagger UI I get to see all my endpoints here can take this let me just drag it up here there we go so that's kind of nice and I can even open all these different um these are basically routes right my endpoints I can see what file they belong to the methods I can navigate through them by clicking on them and so on but what if I want to make an HTTP request to any of these so let's go down and look at the contact endpoint here I'm going to right click and I can also generate requests click that and it's going to create an HTTP file dot http This Is A New Concept in Visual Studio it's not the new a new concepts of the world an extension for vs code and a few other editors support this format but what it does it allows me in plain text to send requests let me just zoom in here a little bit so check this out it creates a variable at the top to point to my local host and I can just hit the play button and it will now send an HTTP request and return it right here so because this is an HTTP file it's just a text file on disk I can check this into my source control so my team members can see how to use my API or our API but also I can use it as documentation let's say I have an open source project or something like that this file can now act as documentation on how to use the API and um oh let me get my explore I think back here let's do another get request here I'll just right click another one of the end points here this is one that returns for certain ID let's do ID number two and hit the execute here and now we can see we get just that one request or sorry that one record back um but I can also make a post I can make anything here and you see these green pound signs or hashes those are the delimiters between the different requests I'm sending but I can go in here and see now I want to do a post request so I'm going to say well oh content type application Json all right and then I just need to give it some Jason I got something right here copy that in oh I just want to make sure you can see it here we go so I'm going to make a post request to this particular endpoint and I'm going to pass it in a HTTP header and a request body and executing that super simply gives me this just a confirmation pack and if I now get all my records again we can see that I now have oh did I not send it correctly maybe not ah is that right all right it's here there we go thank you everybody so now as I'm building up my HTTP file here I'm documenting my API and I'm making something that my whole team can use to test new things you know to test the API that we're building so really really handy and what's really cool is if some of you are using vs code some of you are using visual studio and whatnot this file works on all the different editors they all understand this format all right but speaking of testing what if I want to test something that or I have a mobile app talking to my API and it might be a colleague of mine that builds that mobile app and that colleague wants to test something that I'm doing on my laptop here on the API how do we take a mobile app from one person's desktop and connect it over to my API on my localhost well typically that's not really been that easy there are some products out there that can help with that you have to pay for them but now you probably have heard this we have Dev tunnels and so I can go up here on my play button and go to Dev tunnels and I can create a new tunnel let's give it a name how about build we can then say should this be temporary or persistent like how long should we keep this Dev tunnel alive let's just do a temporary and what about the security of this should be just private organizational or public let's do public so now I've created a tunnel and I'm gonna here's a confirmation you've created a tunnel yes thank you so now if I run the app again Ctrl F5 it's going to spin up that same swaggering as before but this time it's going to show me a confirmation you are about to connect to a developer tunnel and then some sort of URL and we can see I get the exact same UI here but it's no longer a local host it's this other thing and just to prove that I'm not cheating here if you want to you can point your camera that you're at that QR code right there and see if you can hit this because remember we did a public endpoint uh so you should see the exact same thing on your mobile device okay I'm gonna just grab this URL and I can go back to my HTTP file and paste it in right here okay so now I changed my URL and if I hit the button here I'm now creating a request toward the public API and it works just fine right because I have a death tunnel that basically connects the public internet with my Local Host right here so if I build web hooks or viable apis for mobile apps or if I have any other scenario where I need someone else or some other system to connect to my machine do I want to test maybe I want to test whatever website I'm working on on my phone to see if it renders correctly on a mobile device I can now do that super easily and not only is it easy it's free so that's very very nice [Applause] all right so so that was the endpoints the the web server endpoints but what about the code that generated them so here they are this is what it looks like um web API this is what web API looks like nowadays and you know I don't necessarily know how this works I remember back in you know.net framework with MVC and so this looks a little bit different to me than I'm used to and you probably know this when you're working with apis that you're not you don't know if you're using a new nougat package that you haven't used before you don't know how to use that API that it provides or if you're new to a team you don't know how that team writes their code right so if we look at this code here there's something called group dot map post right here I don't I'm not sure what that means so check this out if I just hover over this API okay I got to be faster look at the bottom I'm sorry I can't scroll this but at the bottom it says GitHub examples and documentation I'm holding the mouse over the method called map post okay this is an API method so I'm not going to click this and it opens up a new window right here assuming just check the scroll bar this is a long list of examples of other apps using this API in all sorts of different kinds of ways there's really a lot here I can learn a lot by doing this like what did I have to do before I had to go read documentation right well if there was documentation but now I get to see how people are actually using it right here and it's so clever that it even knows about the different overloads for this particular method and it can give me all these examples what's really helpful to me here what I really think is really cool about this direction is first of all in order to provide relevant examples the AI engine in Visual Studio understands the context that my code is in so when I hover over something it understands what that code is there for and can therefore give me relevant examples but last year a survey came out I think this is even more interesting a survey came out that found that the average developer codes for 52 minutes per day the rest of the time goes with reading code reading documentation code reviews you know email meetings and so on so all the time we spent reading documentation wouldn't that be nice if we can kind of get that back and we can code some more so instead of 52 minutes we can get 50. eight or even more and that's what this helps me with this has saved me several times already I've used this for a couple of months now in our internal bills and it's now all available here to everybody so I'm very excited for that one all right let's um let's add a new folder to this project so you know how you add a folder you right click oh go down to add new folder right that's how we do it so recently we added a new thing that instead of doing that I can do add new item but you know add new item let's do the keyboard shortcut what's the shortcut for add new item shift F2 okay there's someone here that knows what I'm about to show it's Ctrl shift a add new item and we get this little thing up now this doesn't look like that add new item thing the add new item thing looks like this that's what I'm looking for normally right but it now has this compact View and so if I want to do a folder let's call it folder I'm just going to end it with a slash and hit enter and immediately that was created there okay so some oh all right I'll take it thank you so what's this Ctrl shift a does it always gets you back to the view used before did you use the compact view or the full View but if you're like me I always want the compact view first regardless of whether or not I use the full view earlier and so what someone was saying shift F2 always gets you to the compact view regardless and from here oh I can do some other cool things I can create a what if I create two files foo.cs followed by I bar.cs now I got two phones super easy well what if I want to create a subfolder or a file inside a subfolder that doesn't exist I can do SUB folder slash .cs and now I have that file so I can comma separate I can create subfolders I can create folders super easily here I'm very excited for this feature um this was one of the highest voted for extensions that existed that you voted for us to put in the box so it's finally here and um I love it but how smart is this thing so this was the bass class here's the foo class it's a class how does it know it's a class I just gave it a file name well because it maps to the templates that was in that big view the old add new item dialogue you know we have all those templates it is clever enough to map file extensions to what is probably the most likely template that you want in this case a class but what about that I bar file that we did it's an interface yes exactly because naming convention right all right bar makes sense so this thing is pretty clever and um and that's cool I want to show you something else that's really clever this is another thing that um I think it was until we added this no more than I think two weeks ago the second highest voted feature that we add and it goes like this what is the difference between enthusiasts and I bars yes or in another way how do I find out what the difference is well now I can right click one and I can compare with any file on disk or I can select this for compare so now I take I bar right click that and can say compare with food.cs because that was the one I just selected and doing that gives me the diff View [Applause] yeah finally sorry for the wait it's now here and this is just the first um the first feature we have of this uh we're going to look at much more comparison between files and clipboards and all sorts of things that have to do with file comparison and different going forward this is the first one that landed uh and it's in the the latest preview release all right I'm going to shift over here to a different project different instance of Visual Studio here I have a bigger project loader I think it's two projects actually in this solution and I got a bunch of stuff open here you know I'm gonna I don't even know how many files I got open so I'm just going to start by clicking up here next to the tabs and say show tabs in multiple rows oh yeah thank you so now I can actually see all the tabs that are open [Applause] um but I just opened this project or this solution rather and you know if I'm working on something if I'm working on a solution I'm working on a task and I'm not finished with the task but I have to go home you know in the afternoon I'm not closing Visual Studio I'm going to I leave it in the that stated it's in so that when I come in the next morning I can continue where I left off but for all the times when I don't need to continue where I left off let's say I'm done with the task of the day I probably closed Visual Studio and then when I start Visual Studio again in the morning and I open my solution I don't want this I don't want it to open to the state I was in yesterday so this might not be true for you this is me okay I don't want this because I want the fresh car smell this is not fresh car smell it has everything open and notice solution Explorer everything is expanded okay so what happens is when I open this solution in Visual Studio then says oh let me hydrate the state that this solution was in the last time it was worked on from disk into memory and then on the UI thread expand all the notes in solution explorer that means nothing else can happen we can't paint anything else on the screen at that point while that runs and then we're going to open some C sharp files which means we have to load all of Roslyn we have to load the language Services the colorizers all those things who says I'm even going to open a C sharp file that might not be what I'm going to do right now so I'm going to go to tools options and under project and solutions there are two check boxes that are there unless we remove them one of them is called reopened documents on solution load and the next one is restore solution Explorer project hierarchy State on solution load that's a mouthful going to remove that too and click ok so let me close the solution and I'm going to open it again okay one two three click and there it is so very very fast solution load here because no state was hydrated by reading a file on disk into memory onto the UI thread okay and fresh car this is wonderful foreign I got two quick ones to go notice the top it has like this orange Banner if I go back to the other solution it had a green Banner what's this about well I'm using an extension here and I want to mention this not because this extension is particularly awesome which it happens to be particularly awesome but because there's so many cool extensions out there and I want to make sure that you know about that we have extensions I think you needed to be reminded sometimes that there's thousands literally thousands of extensions that can help us be more productive and this one is called solution colors and it allows me to give any color to any solution including if I'm working on the same solution in two different instances of Visual Studio but different branches they can have different colors because I can sometimes have a hard time differentiating between the different open instances of Visual Studio again and check this out it even puts that color down here in the windows jump list or taskbar so I can very easily navigate between the two all right so the last thing I want to show you I gotta have to be fast here is um code cleanup and code cleanup profiles so again it is not the newest of features but I know that you're not using it okay so I want to draw your attention to this this is cool this little thing down here that looks like a Duster or broom or something it's called code cleanup and I can configure code cleanup into two profiles by default it just has a few fixes included but I can take all the available ones and we got a lot now I'm going to hold down shift so that I can select multiple here move that up click ok so now what I'm doing is that I'm applying all my coding standards that I have configured either in my settings under Tools options or if I'm a team I probably have an editor config file so whatever wherever I get my coding standards and Coach styles from I can have Visual Studio apply this super easily so let's take this file as an example I can now hit Ctrl ke and my entire team's coding standards are now applied really really quickly so about 20 of code reviews go to talking about code standards and coding Styles and so now we can get that time back because I can do that very easily here I can even set it up so it happens automatically on Save okay I don't even have to invoke this manually and speaking of of getting ready for code review we have some brand new features in Visual Studio 2022 for working with git and to demo some of that I want to invite my friend Jesse on stage to show some of the really really cool and new things that we have available Jesse all right awesome hi everyone my name is Jesse and I'm the product manager for the Version Control team in Visual Studio we know that you care a lot about productivity and we want to boost that productivity while you're using git so my goal is to show you how we've made Version Control easy and efficient by allowing you to do more in the IDE and minimize distractions that take you out so to set the stage for the demo we've made some changes and I've already opened the get changes window here so let me make that a little bit bigger I've got some changes in my resize file and my enumclass and I'm going to start preparing my commit so there are two GitHub issues that I care about in this scenario the first one is actually tracking the work that I'm doing on this project and the second one I was tagged in by a colleague because they thought it was relevant to my work so as I start typing my commit I'm going to use the closest keyword when I complete this pull request it's going to go ahead and close that issue for me so I don't have to worry about it that's nothing new but then I want to reference my GitHub issue and what you would need to do is go out into the browser copy paste that issue ID or look up and find exactly what you're looking for but if you had a good idea of the title or the name of that one you can use our issue search so if I type the hash button I get that list of all of my recent issues that I've been tagged on I can use keyword search to narrow down my results and I can find exactly what I'm looking for without leaving Visual Studio yeah it's pretty awesome the other issue that I wanted to reference let me do that quickly and I'll use the button here which does the same exact thing let me narrow that down grab that and you can see that both of these items were added to my related item section and if I wanted more context I can right click and open these directly in the browser so I'm realizing this is my last commit that I want to make before completing my pull request so just to avoid any surprises happening in the pipeline I'm going I'm going to go ahead and rebuild my solution now we've all been there where a build starts and it might take a while to run we might be tempted to leave Visual Studio go check teams or catch up on email and we heard that it's a blocker to not be able to do your git operations so we've enabled staging and then committing all while the build is running so I can continue doing my git flow while the build is still going on and you can see that happening below all right let's look at my git repository window I've got some updates in there that I want to share so I've clicked on the view all commits button that's my preferred way easiest way to get there and I want to draw your attention the graph here is nothing new but we did add some UI enhancements to Aid and readability and what I want to show is the multi-branch graph that we've created so I mentioned that I'm creating a pull request and I'm going to do that against the develop branch so let me just click on this eye icon and visualize that and now I can see exactly how my commits stack up between my branches whereas before I'd have to wait till I made my pull request and get that view in the web so now I'm all prepared to create my PR right away awesome another great thing about the multi-branch graph is that it makes me really confident when I'm performing complex git operations now if I was asked to cherry pick a bug fix for a branch that I worked on a while ago I'd be fumbling between stack Overflow trying to find the right command and then the right commit ID so that I didn't make a mistake and mess up my reap up so with the multi-branch graph I can just visualize that bug fix Branch let me scroll to it really quick and then I can right click here and then if I want to make doubly sure that this is the right change I can double check that in my commit details and now that I'm confident I'll go ahead and just click cherry pick I've got the banner to let me know that was successful then I can scroll back to the top of my feature branch and just ensure that that's exactly the right bug fix I wanted to apply that was so much easier than having to go track down the right command to do that cool so you figured out all of the commits that you wanted to add to this PR the build ran successfully and now you're ready for that last step which is creating your pull request so I'm pushing my changes and I'm greeted with that Banner that lets me know that it was successful and then you might be familiar with this link today if you tried it out and clicked on that link it would take you out into github.com or Azure devops or wherever you were creating that floor quest in the web but we heard from you all that it's pretty silly to be able to complete 90 of your workflow in visual studio and then have to leave to do the last 10 percent so I'm excited to share the new pull request view in Visual Studio which allows me to finish creating that right in the IDE so it's got everything that you might want I'll go ahead and quickly create my pull request it's not going to be terribly descriptive or interesting but you guys are going to do much better than I am and then I've got that same issue search available here and I can go ahead and create that pull request and see it by refresh available on GitHub right there so these are all the features that I wanted to share in the time I had today but they're only a fraction of the updates that we've made make sure that you're downloading the latest preview of visual studio and engage with us on developer Community these were all different requests that came from you all and it's what allows us to make such awesome features so I'll give it back to meds but enjoy the rest of your build thanks yeah that's some good stuff um and uh everything you saw here so far has is currently available except for the last PR the pull request thing it's coming very soon so during the summer here or winter if you're on the southern hemisphere I guess but soon let's say um other things we talked so we talked a lot about like things that you're requesting us to put into Visual Studio new features all this stuff and the thing that comes up all you know all the time of course is performance and um it's hard to demonstrate performance in a setting like this so I just want to make sure I had a slide to let you know that it's something we actively work on we have a lot of Engineers that work on this it's their full-time job and we have made some great strides 17.5 came in um it's the version of Visual Studio 2022 that we shipped in February it had a bunch of improvements if your.net developer um check out the new build acceleration if you haven't already you're going to cut your build times uh by 80 it's like a huge win there's a whole lot of other things solution load is eight times faster if you have those some of those big solutions that really need that extra boost um solution closed which is interestingly enough is actually a thing who thought that that would matter but it does and it's now faster and so is the profiler I want to I want to call out the profiler uh for two reasons one is you're not using it and it's fantastic it lets you find performance issues hot paths reliability issues very very easily in directly in Visual Studio it instruments your running app and it can give you all those answers and we've been making so many updates to it that it's better than ever and it's really can answer those hard questions about performance and reliability and it now generates the results three and a half times faster for me that has actually meant I can make it part of my inner loop so when I write Visual Studio extensions for instance I can run the profiler just that I would like run my debugger because it's now so fast it's not something I have to think of doing later on it's just something that's part of my inner loop and it makes my code stronger um all right so all this stuff is um of course we continue work on performance so uh 17 6 we've released a week ago 17 7 preview one has even more stuff um so go check out the latest and greatest uh 17.6 if you're on the release Channel if you're on the preview Channel get 17.7 and the extension I showed you was called solution colors if that has any interest all right so three weeks ago I think Dante something like that we had a blog post coming out about a topic that turned out to be really interesting to all of you and so we thought we can't do build without showing you and talking about this particular subject and for that I want to invite my friend Dante on stage to do exactly that Dante thanks France so my name is Dante gagne I'm one of the product managers of visual studio and I'm in charge of the UI refresh so as mads mentioned we published a blog post about the UI refresh that we've been working on and yeah I want to come up here and show a little bit about what we're doing so I'll go ahead and show you what we're looking at and basically if you've been looking at visual studio and saying to yourself you know this looks like a UI that was designed uh like a decade ago and the reason is is because for the most part it has been it's been a while since we've had a new refresh and we decided it's time to do a new one and this isn't something that we take on light light mostly because the UI in Visual Studio this is something that affects every single one of us it's something that we're going to be looking at every second of every hour that we work on visual studio and that's more than the 52 minutes we spend coding it's really all your time is going to be spent time so we want to make sure we get it right we want to spend the time and make sure it's going to be the UI that it's going to be more comfortable and it's going to be something that we're going to enjoy working in and our guidance is we want to make it the most accessible and approachable UI that we've ever had now I'm not gonna go through all the design principles I'm going to encourage you go up to AKA dot Ms slash vs fluent that's the blog post that we put up there and it's got all of the principles and everything but what we're doing this time we really want to work with our community we want to work with you to make sure that this is the UI that we're ready to work with some folks who have been working with visual studio for a while might remember some of the UI that wasn't necessarily accepted quite so well and we want to make sure that this time it is what we want and let me show you what I'm talking about here what I'm showing on the screen now the top toolbar is the toolbar that you've got right now in visual studio if you've got 17 6 or any of the more recent ones that's what you've gotten below that is one of the toolbars that we showed in that blog post this conforms with some of the web content accessibility guidelines of larger controls that make it easier say for people with a motor disability to be able to click on those controls and make sure that they're not misclicking larger controls reduce cognitive load make it a little bit easier for people to use it a lot of things like that that adhere to the fluent UI design guidelines a whole bunch of other things like that but the feedback we immediately got from our developer Community is it's a little bit too big so we went back and said you know based on the guidelines that we're working with and based on the community guidelines or the community feedback that we're getting can we take all of that into account and below that I'm showing the next Generation mock-ups that we're working with so we're iterating on that feedback and we're iterating on our design principles and we're moving towards a UI design that we feel is going to be more in line with what we're trying to reach that accessible and approachability and at the same time taking into account what our our community what our developers folks like yourself what's more important to you and that's how we're approaching this UI refresh we want to make something that is going to be what we are going to be spending a lot of our time doing in the days and years to come here's another example the document tabs these ones again the top one is the document tabs that you're used to and the one below that is the one that we showed in the blog post and immediately we heard people say don't take any room from the coding window please don't take any room from the coding window okay how what can we do with that one how can we change the things and the bottom one was showing one that took quite a bit less room from the coding window and in fact one of my designers is showing me a new mock-up that she was just working on that actually gave one or two more pixels to the coding window but still adhere to those design principles that we're working with and all of these things that we're doing are coming from feedback from the community now I've already had a couple people asking me when are we going to get a chance to look at this and the answer is I don't know right now because we don't we're not ready to make this available in the previews until we're making sure that we're listening to the feedback from the community and we're taking that all into account we've got time we're not in a rush to put this out because we want to be very deliberate for this refresh before we're rolling it out so we don't have a timeline on it we want to take our time and we want to get this right and the way we get that right is with engagement with y'all and getting you all into the conversation so I do want to encourage folks once again AKA dot Ms slash vsfluent that's the blog post and we're going to continue to engage at vs fluent we're going to continue to be working with developer Community I know mads and uh Jesse both mentioned that as well that we're working with the community and we're really serious about that with UI refresh here please join in the conversation and we're going to continue to iterate on that with everybody there so um with that I look forward to talking with folks more about it and I'll hand it back to men's thank you thanks Dante all right so we are at the end of uh this session and I want to just take a moment and say thank you so much for coming here I know it's just before the celebration and you're probably thinking when does he shut up so I can go stand in line I understand but before I let you go uh I just want to say it's been a privilege to be here on stage with these two fine people representing the visual studio team and show you some.net things some some Visual Studio things and as you know there's a bunch of different sessions here at build about Azure and all sorts of different uh topics and if you want more visual studio and net it is super important that you tell us and the way you tell us is to fill in one of these session surveys like give us a good rating here in the comments let us know you want more visual studio and Dot net for future conferences whether it's build ignite or whatever it might be the powers that be listen to that stuff so please help us out and uh cast your vote so to say thank you so much and see you in Celebration foreign
Build 2017 Workplace Safety Demonstration
[MUSIC] As our world becomes increasingly digitized, so does our ability to connect with it. Imagine if you could search your surroundings the same way you search the web. Using existing cameras and advances in AI, we can now find things and people in the real world, in real time and take action to improve safety and well-being. When a dangerous spill occurs in a chemical plant, cameras recognize the incident. Information about the spill is instantly shared with the people who need it the most. Enabling them to protect other employees from coming in contact with the hazard, [MUSIC] And clean it up. [MUSIC] This technology can also help keep people safer in hospitals. Patients recovering from heart surgery are limited to how much they should exert themselves. When someone exceeds the prescribed level of activity, a nurse is alerted. [MUSIC] What's more, the location of the closest wheelchair is identified, so that the nurse can quickly get the patient seated and safe. [MUSIC] This technology is also useful in an environment like a construction site. Where people who need specialized tools are spread out, sometimes across multiple floors. Using cameras already in place, this technology can identify a specific tool. As well as the closest authorized person who can deliver it. Saving everyone time and keeping the workflow moving. The digital and physical worlds are come together to help make everyone more safe, secure, and productive. And we're bringing the Edge of Microsoft's Cloud to any device. [MUSIC]
BlackMarble’s remote detective - powered by the Visual Studio family of DevOps tools
[Music] black marble is a group of really enthusiastic technology loving Geeks that have established themselves as the go-to guys if you've got a difficult problem devops is a big part of black marble it bridged the gap between it and operations for us two serve came about initially from one of our customers Cambridge sh constabulary one great thing that two serve is enabled is an idea of a remote Detective When officers are on the scene of a crime they're Gathering evidence and feeding it into the two serve event dashboard a detective back at a station can now look at that in real time and guide the actions of the people on scene in developing two serve we've really put into practice everything that we've learned along the way around devops and Alm Visual Studio team Services provides an end to-end solution for us from the Inception of an idea in the pub as you write it on the back of a beer mat we can check our coding and a whole variety of crossplatform solutions we can then build our Sol solution and deploy it out again into a whole heterogeneous areas so it's now really giving us a selection of tools that allow us to address the real world needs of our clients by combining Visual Studio team Services build and release with Azure resource templates we were able to help one of our Marquee customers take their deployment time down from over four months to just over an hour we've quadrupled our devops practice over the past year the risk if you don't keep up to date with the new technologies that enabled devops is that you'll be left behind it is important that our clients trust us and the fact that we're a Microsoft partner is very important to them it gives our customers the confidence that even though we may not be the largest supplier on the Block we have a proven track record of delivery and we have a very big friend standing behind us to support us knowing that we're transforming policing is a big part of why I love my job if we can get to serve into as many police forces as possible it means that all police forces can collaborate and have that digitized ation and transformational experience [Music]
Bind Controls to Other Controls (11 of 18) Building Apps with XAML and .NET MAUI
[Music] hi welcome to visual studio toolbox I'm your host Robert Green and I'm your presenter Paul Sheriff hey Paul We are continuing our series on building apps with zaml andet Maui and today we're going to start talking about data binding but before we do that we have a short followup to the previous episode in between uh Paul was one wondering why he couldn't get the wrapping that he wanted to occur and then he figured it out so what happened well so if we go back here if you remember what I had is I had the entry within the horizontal stack layout problem is that the flex layout is whatever that child is that's the thing it's going to be laying out right so you needed to add another horizontal stack layout and when you do that now it pushes hey there we so all right you know it's one of those things you're doing a demo you're doing live and you're like wait a minute I know that works what am I doing wrong and then you figure it out as soon as we stop recording right of course of course but happily since we're recording these back to back to back we're able to address it right away absolutely absolutely cool okay all right we're gonna learn how to bind controls to other controls yeah why are we learning such a thing why why well I got a great sample to show you actually so let's go ahead and we're going to bring up our product detail view now and we've got this cost and then we've got an entry for the cost I'm going to replace that entry with a horizontal stack layout and the way that this works now is I've still got the entry but I'm adding a stepper in so let's run this so you can see what it looks like and then we'll come back and we'll talk about this code that I've written inside of the zaml [Music] here all right let's get this over here so we can see it side by side here we own the products here all right so you can see the cost right here and you notice it's been defaulted to a value of one and then right next to it I've got this little what's called a stepper control and I can click on the plus I can click on the minus and if I click on the minus here and I keep going down I'm clicking I'm clicking I'm clicking nothing is happening because if we look back over here at the code you'll see that I set a minimum on this stepper to be one and I have a maximum of 99,999 and I've specified that I want it to increment by one each time I click on the Plus or the minus sign okay yeah now if you'll notice I have given this stepper a name one of the things we've always talked about if you wish to interact with a control that's on your page here right you need to give it a name and that interaction either happens in the code behind in CP but it can also happen here in this data bind we take a look at the entry control you can see I've set what's called The Binding context so what we're saying is hey and ENT I want you to bind yourself to another control and we're going to reference that control by the name called cost stepper so you see those two values match in fact if we you know use the intellisense it tells us which ones it is allowed to bind to so it looks for any names that's easy enough and then the text portion of the entry which is where you're typing in right this value here is the text property MH so we're saying you want to bind to the value property of this stepper so if I come in here and I set the value equal to 80 for instance look what happened on the screen over automatically changed didn't it and now since they're bound together when I hit the minus sign it's going to go to 79 78 or if I hit the plus sign it's going to go up and if you enter 80 as the or something different as the Val into the entry that updates the stepper so it's a two-way binding you got it so now when we go there excellent yeah so this is called Data binding and this this data binding happens between one control and another we're also going to be able to use our C classes to do this kind of binding as well all right so one thing you could do in the I assume there's an event behind the stepper on click so you could set the value of the entry and code correct but this is this is a little cleaner uh I would right code um so I guess it kind of depends on I mean if it's a obviously a simple binding like this You' put it in the zaml if there's more complicated stuff going on then you'd want to and have to write code but it's possible you could have to write some code absolutely you know we're trying to I I try to avoid as much code behind and as much C code as I can if I can express something in zaml I'd rather do that because then I see it all right here I don't have to okay what was the name on here in the zaml then go try to find that in code behind in the C to me that's it's a lot cleaner yeah definitely so let's go down and we've got the next one which is the price so let's do the same thing for the price here okay so what I've done here now is I replace that that entry okay I've got this binding context here all right MH and so you'll notice though that nothing's happening right we got that little squiggly again all right so that means that I've got to restart it so it's just one of those things that does happen sometimes that examl hot reload especially when you're working with bindings it does it does typically need to restart a fent so yeah and there we go now you can see that it's starting with one because that's the minimum so it's set value to minimum even though I didn't put it in there so this one is called price stepper so on the entry I did the same thing I set the binding to the value property of whatever is in this binding context which in this case is the price stepper cool now one thing I want you to notice here right is okay I've got a cost let's say I've got a cost of 10 well right now I can still set a price lower than the cost yes that's probably not good is it much for long it isn't yeah that probably wouldn't be good our our bosses would not like that very much so what we can do now is we can actually bind the two steppers together so let's change this price stepper here or actually let's start out with the cost stepper okay so I'm going to go up to the cost stepper here and I'm going to change all of these guys right here I'm going to set the value to 10 the minimum is still going to be one but now the maximum I'm binding to the value and look at the binding context for this The Binding context is the price stepper okay and then on the price stepper I'll change these guys so that I have a value of 20 I'm going to start so that the price is always greater than the cost and then I'm going to set the minimum right to the in of the value now back to the cost stepper so by doing this right um I think it actually should probably work now so if I bring that cost up look at that I am hitting I'm trying to click on that plus it's not working I'm trying to click on the minus on price it is not working cool so once again instead of writing C code I'm I'm able to express all of this in zaml which is really cool now what if you wanted the price to always be 20% higher than the cost can you okay can you do something a little more complicated there we could there you you'd actually have two different options here all right so first off as you mentioned earlier you could write in the event right code that says hey always make sure it's you know 20% higher than the cost for instance okay so you could write that in csharp the other option would be what's called a value converter and we're going to talk about those in actually just a minute okay so you'd have two different ways that you could accomplish that got it all right so that's one thing you can bind values from one to another but that's not all you can buy okay let's actually go back to our users now our user details we'll bring this guy up let's bring our solution Explorer here and we'll go back to the user detail view so on this one I've got a check box down here uh where is it Flex time all right I'm going to give it a name I'm going to set the name to flex time and then what I'm going to do is I'm going to go down to where that time picker is so we added the time picker last time and I'm going to bind now the is enabled property of this time picker I'm going to bind it to context of the flex time if you look over here you'll notice it already disabled the start time because the flex time is not checked if I go up here and I check the flex time this very cool yeah so it's not just values it can be almost just about any property not all of them but just about any property can actually be data bound that includes visibility um you know the time could be bound and we're going to do that later all right and the date on the uh you know the date could be bound so all of these things this is a great example of you know taking advantage of this control to control bind so you could come in and have the the page in View mode where everything is disabled and then have an edit button or checkbox and then that enables all of the controls or absolutely that cool absolutely if that's something you wanted to do make everything read only and you have a button that click edit and then they all become enabled sure that's in fact a lot of people do that and they do that like bound to maybe some security right because if someone only has read only access to a screen the security would actually just hide that edit button right and then right they could never click on it so nothing could ever become enabled yep so great all right well now guess what we're going to write some code woohoo finally I know everybody's like man had a lot of zamling all right let's go ahead I'm going to add a new folder here called converters and I recommend you do this because you probably will create a few converters and I'm going to create a new class and this one's going to be called inverted boou converter oh that sounds a little strange doesn't it all right a converter is very simple it actually implements this interface called I value converter and it has two methods this this interface is really simple two methods it has a convert and a convert back 99% of the time you're only going to write code in the convert not to convert back convert back a lot of people actually just throw an exception or they return null or something like so sometimes very rarely I I think I can remember one time I had to use the convert back but the way this works is we're going to pass in a value one of those bound values from one of our controls and we're going to do something to that value in this case I'm going to bind this to like an is enabled or is visible property on one of the controls but I'm going to change it so if it comes in as true I'm going to change it to false if it comes in as false I'm going to change it to true that's why it's called inverted Bo converter now this is a very simple example of a value converter but nine times out of 10 the code is going to be very simple in here on what you're going to do um I have a complete WPF Library I wrote years ago and I probably only have 10 converters it's not like something that you write a ton of so all right so how do we use this thing right let's go back to our user detail View and here's the thing I want to actually show you if we look back here this is in this name space now adventureworks ma. converters so that means I need to add a new XML name space right I'll call it converters and I'm going to reference oops sorry equals the adventure works. m.on converters yep so then what I can do is inside of here I can create a Content page. resource es and I can reference converters and there's my class I just simply need to give it a uh a key here I'll call it inverted Boolean like so so this is now a resource that I can use and if you remember we had resources before right okay so resources were things like that string or those doubles that I created earlier right now I've got another resource that happens to be a class okay all right let's scroll down now to find a radio button and the radio button here is my fulltime radio button and I'm going to set a name on this and I'm going to call it full time okay so now I'm going to go to the time picker so now I want to instead of referencing and binding to that is check to the flex time what if I wanted to do fulltime and bind to that so I Chang The Binding context here fulltime time all right and now I'm going to set the is binding to the is checked of full time right so that's remember the fulltime is the fulltime and the part-time so if I do this so let's run this first so we can take a look at how this works just like this we haven't even used the converter yet and it's thinking about it and here it comes all right so if we come in here and you notice that the full time is currently checked and so I can actually choose a start time but that's not really what I want if you're full-time you know you're in on salary we don't really worry about start times but if you're part-time you really want to be able to choose a start time don't you okay so this is one of those examples where well I want to bind to the is checked okay but I want to change it so that it's the inverse of that so we add what's called a converter here and and we use one of our static resources and it's called inverted Boolean okay this is a little bit of a contrived example because obviously I would probably just go to the part-time and bind it to that but it's a good way to show the difference and how sometimes you don't have you know like maybe CH changing something visible or invisible you might need to use something where it's the opposite very common thing you'll do trust me you will use this all the time so let's go here take a look and now we can see that now it's working correct got it cool and then you can put anything you want into that converter you could have complex calculations check up information in a database anything you want right absolutely I mean there can be there be a lot of code in there typically it's not a lot of code it's generally changing something very slightly from one thing to another okay um for example remember how we change those handlers to change the onoff to like yes no yeah that could be something you would even do in a converter where when somebody chooses a particular check box maybe you want to have a label next to it that gives more of a full description that could be something you could do in a converter okay so typically they're going to be more simple things if you need to write a lot of code you're going to wind up putting that in the view model which we're going to talk about you got in just another three three more episodes yep okay cool but at least we have now got a good introduction to binding controls together and using these value converters and again the beauty is that you you're not writing a lot of code for this you're doing all this binding and interactivity in the zaml so it's all in one place it's nice clean yep yeah you might need to go look up you the little value converter see what it's doing but if you give things a good name then it usually it's pretty self-explanatory I mean inverted Boolean that's pretty clear what's happening now can you do a peak on that can you go to definition can you see the code from inside the is that yeah if I do a peak definition on this okay all it's going to do is get me to this guy here okay so it gives me to the zaml because that's what this definition is right okay so but if I come here then and then I go ahead and do the peak definition there's the code Okay cool so it depends on what you know where you're located at right so in this case I it was the key that I was down there but if I come up here to the resources it's very easy to do that PE cool y there we go excellent all right so that's binding controls to other controls in the next episode we're going to look at what we're actually going to take a look at now creating C objects and binding to those very cool all right so stick around and we will see you next time on Visual Studio [Music] toolbox