From the course: Microsoft XAML: 3 Type Converters and Resources

XAML resources and ResourceDictionaries

From the course: Microsoft XAML: 3 Type Converters and Resources

Start my 1-month free trial

XAML resources and ResourceDictionaries

- [Narrator] XAML resources are a practical feature in the XAML frameworks that enable developers and designers to create, organize, and consume reusable resources. They are a vital part of the XAML infrastructure. They enable XAML styles, templates, and shared colors and brushes, a great way to build a consistency across your application interface. Essentially, XAML resources provide a way to declare an object in your XAML, provide that object with an identifier, then use that object elsewhere in the XAML file or across the application. Now for the implementation details. Resources are located in ResourceDictionaries. And like all Dictionary classes, adding a resource to a ResourceDictionary requires two parameters: a key and a value. There are three ways to create a resource: in code, in a ResourceDictionary file, or in a resource's section of a XAML file. Let's look at each of those. Start by opening this ExampleDictionary.xaml file. So this is an XML file. The key difference in this XAML file is that it uses a ResourceDictionary as the root element. And this is going to add these items, this SolidColorBrush, to the ResourceDictionary. And in order to add it to a dictionary, it has to have a key which I'm providing here and it has to have the value which is the entire SolidColorBrush. So as you can see, I've got two SolidColorBrushes inside this dictionary. Let's say I wanted to add a color to this, so a consistent color I would like to use across the application. I've added the color. I'm getting a blue squiggle because each dictionary entry must have an associated key. I'll take this key, copy it here. Now I'm getting another error. That key's already defined. So you probably know this, but dictionaries have to have unique keys. You can't have two items in the dictionary with the same key. So I'll need to change this to HighLightColor. Now I've got three items in this ResourceDictionary. The next place to look for creating resources is over in a traditional window, one that has visual UI like this MainWindow. So the root element here is a Window. And the thing about the Window class is that it has a Resources property. So the Window class and some of the other UI elements that you'll work with inside XAML have a Resources property. And the data type of the Resources property is a ResourceDictionary. So I can take the same code that I had over here, this Color item, copy that, bring it over to MainWindow, and paste it in here, and it accomplishes the same thing. So I've got three items inside this ResourceDictionary. The third place to create a ResourceDictionary and add some resources is in some C# code. That's what I'm doing here in my constructor. I'm creating a ResourceDictionary, instantiating it here in line 19, and then I'm adding an item and I'm providing a key and a value. And at this point, I have two items in my dictionary and then I take that dictionary and I assign it to the Resources property of the window. So again, there's three places to declare them. Let's talk about where you'd use each one. Let's look at this ResourceDictionary. This is a separate file that is not affiliated with any window or page or user control. The reason you'd use this is that you want to define resources that you'd use across the application or you want to take this resource file and use it across multiple projects. When you use a XAML file like this with a Window element or user control root element, now you're scoping the resources to be used within that Window but not anywhere else inside the project or the application. And then the last choice is in code. This is rare. You typically don't create your resources here although you can. This would be for dynamically swapping out items in the ResourceDictionary at run time. Remember, the whole purpose of ResourceDictionaries and resources is so that you can declare all of these items and put them in your XAML file.

Contents