I'm writing some extension modules for a WPF Composite application supplied by another vendor. The application is themed, and gives users the option to select from a number of themes which will change the appearance of the entire applications, including any custom modules that register themselves with the theme manager appropriately.
I really want my custom extensions to look like an integrated component, so I'm trying to use only styles defined as resources within the main application. As I'm still learning the nuances of XAML, I'm styling more by trial and error.
I'm wondering if there's a way of 'discovering' what styles are available in a different assembly. Here is an example of what I'm currently doing.
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<common:DesignTimeResourceDictionary Source="/Vendor.Desktop.WPFCommon;component/themes/generic.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
<Border
Background="{DynamicResource LightGradientBackgroundBrush}"
Margin="0"
>
The LightGradientBackgroundBrush is defined in the vendors assemblies. By including the above ResourceDictionary, the style is present during design time, and the brush isn't underlined in the XAML editor.
Can I find what other styles are defined? I'm only aware of that style because it was mentioned in passing in a sample provided by the vendor.
Edit:
I'm aware of a BAML add-in for reflector, but it doesn't work with reflector 7 unless it has been recompiled/patched. Someone has already done that here though.
I was hoping there was a better solution though. Intellisense for styles would be great.
There used to be a Reflector add-in for viewing BAML resources that worked well for that. But I haven't used Reflector in a while since Redgate crashed the party. It may not work with the current version.
You know where your resource dictionary is so you should be able to load it up in code and enumerate over the available resources. This will at least give you an idea of what's available.
See this link: http://blogs.claritycon.com/leeroth/2009/05/20/load-xaml-resource-dictionaries-at-runtime/
Enumerate over the Keys property and use the item property to access the resources. You can get as detailed as you want, but at the very least you should be able to spit out the resource names.
Related
I'm trying to create a project dll file that holds core styles, resources, controls, etc. This will then be referenced into various other projects to use as a graphic base to unify the appearance.
Anyway, I have the graphics project set up and I can use it in other projects and it all seems to display correctly. However, XAML intellisense for my static resources doesn't seem to be working.
Here is my resource dictionary reference:
<ResourceDictionary Source="pack://application:,,,/BIT.GraphicElements;component/BITCoreStyles.xaml" />
As you can see I'm using pack notation to reference it inside it's assembly. I can style elements like I would expect (StButtonAction is in the above dictionary):
Style="{StaticResource StButtonAction}"
However, I have to type it in manually. Intellisense doesn't give it as an option but if I type it manually is applies it successfully. It also works if I add the project to the solution and reference it there, however this is intended to be used by those that don't necessarily have access to the graphics project so that's not a good solution in the long run...
What am I missing? Is there a way to make Intellisense work for these?
Maybe this'll help future searchers even if it doesn't fix your specific problem.
When you have a solution involves external dll then you can occasionally find resources just don't get loaded at design time. At all. Even though you merge in app.xaml the things don't turn up until you run.
It looks like some sort of subtle bug to me.
The way I work round this is to use functionality originally intended for Blend. We are now using the blend designer in visual studio.
In solution explorer, add a resource dictionary to Properties. Yes. Properties. Create it first in your project and drag it up there. This must be called DesignTimeResources. This can then merge any resource dictionaries you will want to use just for design time or when you have an issue makes you think resource dictionaries aren't getting loaded for design time.
Mine is in army editor but uses resources from a referenced dll, UILIb. It looks like:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:ArmyEditor">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/UILib;component/Resources/UILibResources.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
This is a resource dictionary in a bit of an odd place but nothing particularly weird so far.
Next is the bit that many developers will never have done - editing your csproj.
Right click your project and choose unload.
Right click it again and edit it.
In there you will have entries for all the stuff makes up your project. And of course breaking this would be bad so maybe you want to back up first.
If you don't use blend then I think the important thing here is to add a node which says ContainsDesignTimeResources True, but here's mine:
<Page Include="Properties\DesignTimeResources.xaml" Condition="'$(DesignTime)'=='true' OR ('$(SolutionPath)'!='' AND Exists('$(SolutionPath)') AND '$(BuildingInsideVisualStudio)'!='true' AND '$(BuildingInsideExpressionBlend)'!='true')">
<Generator>MSBuild:Compile</Generator>
<SubType>Designer</SubType>
<ContainsDesignTimeResources>true</ContainsDesignTimeResources>
</Page>
Save your edits.
Reload your project.
When the designer is open, you should find resources from it are loaded. Maybe this will help intellisense find them.
I mentioned this earlier but.. In my experience, such intellisense on resources is often unreliable.
This definitely solved a similar issue I have had in this solution. It is also useful when you want to temporarily overlay resource dictionaries for localisation/branding testing.
Context:
I have a created a user control library project in Microsoft Visual Studio 2017 with a lot of Styles and ControlTemplates to be used in various future projects. Now I want to reference it in a new solution.
What works:
When I create a new solution with a new WPF-Application I can import the user control library project into the solution and add a reference to it in my new WPF-Application project - everything works fine this way. But this isn't a good solution for me because I don't want to copy the sourcecode everytime I use it.
What doesn't work:
...So I tried to not import it and referencing it as a project but to just reference the compiled dll-file of the user control library. In principle, everything should stay the same from the WPF-Applications point of view. But the Designer doesn't find the referenced resources correctly. At runtime it works perfectly well with no errors, but at designtime the Designer either ignores the referenced resources or crashes entirely.
Its behaviour doesn't seem to be very consistent anyway:
It finds some resources correctly, e.g. It shows referenced ColorBrushes defined in the user control library correctly (e.g.Background="{StaticResource MyBlue}")
Sometimes it seems to find a referenced Style-resource but not the resources nested within that Style (e.g. Style="{StaticResource TextBoxOutput}" shows error "The resource "MarginStandard" can't be found." when MarginStandard is used in TextBoxOutput)
Styles without a key which should apply by default don't apply automatically.
All this works correctly at runtime and when I reference the user control library as project rather than as dll.
What I already checked
User control library and WPF-Application use the same CPU-Architecture (AnyCPU).
User control library and WPF-Application use the same .net Version (4.6.1)
I tried different Build-Actions for compiling the user control library (resource, embedded resource, none).
The dll-file gets copied into the bin/debug-folder of the WPF-project.
All resource dictionaries from the user control library are imported in the App.xaml file of the WPF-project using the following Syntax:
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/UserControlLibraryName;component/RecourceDictionaryName.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
My Question
How can I use resources referenced as dll-file in such a way that the Designer also finds the resources correctly? My Styles and ControlTemplates alter the look of the Controls drastically, so its really necessary to be able to see the results at designtime.
I'm struggling with Templates in WPF
I understand the concept in that I can have a control, and 'override' the ContentTemplate (or similar). I use it often with the TabControl
However, I don't understand it in terms of what the initial control looked like. And if we are limited on the names. EG, could we build a control and overwrite the NonsenseNameTemplate?
If I were to build my own UserControl and provide the ability for people to override things like my NonsenseNameTemplate, what would this code look like?
My guess, with pseudo code would be
<UserControl>
<NonsenseNameTempalte>
//some resources
//some other controls
</NonsenseNameTempalte>
</UserControl>
In the above example, I can fully understand how I could create a new control and overwrite the NonsenseNameTemplate but I can't see any code examples of the UserControl and it's usage.
Template is nothing more than a (dependency) property. By writing
<Button>
<Button.Template>
<ControlTemplate>
...
</ControlTemplate>
</Button.Template>
</Button>y
you are doing nothing more than creating a new instance of ControlTemplate class and assigning it to Button.Template property of that specific button. Each control has it's own ControlTemplate saved somewhere in it's assembly. It is generally not so simple to actually get those default templates, but Blend can help with it.
Of course, you can create your won NonsenseNameTemplate property, but actually using it would require some deep knowledge of WPF composition, layouting and rendering. Which is usually not required for normal usage of WPF. And I agree that there is not a much online resources about doing something like this, for exactly this reason.
I too had an early on learning of Templates. I posted a step-by-step answer to another question via a customized button control. The nice thing about that sample, you can build and play with styles and templates in a small project and see visual impact without requiring full project rebuild
To start with, as you have mentioned that you do not have Blend. You can have Blend and install it with Visual Studio 2013 Community.
You can download this here if you do not have it already.
http://www.visualstudio.com/products/visual-studio-community-vs
A part of the installation process, it allows you to select and install Blend. Also, the newer editions of visual studio give you some of the power of blend. In your design view you can right click on a control and create or copy a template.
On to the question.
As Euphoric has mentioned. Custom control authoring does require a little more in-depth knowledge of WPF, or any of the XAML frameworks. However, there are Visual Studio templates that can help you in the right direction.
As for the template naming, you have three types of templates you will come across in XAML. ControlTemplate (which for your purposes is the one we are interested in), ItemsPanelTemplate and DataTemplate. Again, as Euphoric has said, there are few circumstances where deriving a custom version of any of these three templates would bring anything to the table.
If you were to create a test WPF application, once you have created the basic project and solution. Go a head and add in another project, and from the templates VS provides, File -> Project -> New -> Windows Desktop. In the project template list, find 'WPF Custom Control Library'. Once created, reference this project in your main WPF project.
This custom control library project will give you a skeleton setup for what you are looking for.
If you look in this project here are some things for you to note.
Firsty, you will find a folder called Themes and in there a file named Generic.xaml. In there you will see a style that has a setter setting the Template property. You will also see that both the Style and set ControlTemplate have a set TargetType that should be local:CustomControl1.
This is important as this is showing you how to create a custom controls default template. Now, to apply this template look in CustomControl1.cs and consider the following code.
DefaultStyleKeyProperty.OverrideMetadata(typeof(CustomControl1), new FrameworkPropertyMetadata(typeof(CustomControl1)));
For this control named CustomControl1, that template we looked at in the xaml will be automatically set as that controls default template where ever that control is used.
This project is a good starting point. But now you may want to override this ControlTemplate inside your main project. This is simple. I have code that looks something like this inside my main WPF project.
At the top of the MainWindow.xaml
<Window x:Class="CustomControlTesting.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:CustomControl="clr-namespace:CustomControlTesting.CustomControlLibrary;assembly=CustomControlTesting.CustomControlLibrary"
Title="MainWindow" Height="350" Width="525">
And in the body,
<CustomControl:CustomControl1>
<CustomControl:CustomControl1.Template>
<ControlTemplate TargetType="{x:Type CustomControl:CustomControl1}">
<Grid>
<!-- Define my look to override the template -->
</Grid>
</ControlTemplate>
</CustomControl:CustomControl1.Template>
</CustomControl:CustomControl1>
This is a brief overview and certainly misses out a lot. But I hope this is of help to you and can get you started.
My situation is this.
I have multiple projects under a WPF solution which make up a multi-tier application I am developing. Since separate projects will sometimes need to access the same image or xaml resource I'd like to centralize "Public" resources to one project that can be referenced by any other projects requiring these "Public" resources. For example, I have a BMP image that I use in various controls and windows in separate projects that serves as a banner/logo. It seems like I should be able to add this image as a resource to the public resources project and reference it from my other projects instead of adding the image separately to every project that needs it. If this is possible, what would it look like and how should I go about doing it? If my idea just sucks I'm open to suggestions, but the project is going to be quite large so I don't want to be adding resources all over the place.
Thanks!
P.S.
I have searched this topic quite a bit but there are so many garbage answers out there from people that don't know what they are doing. Given that I'm relatively new to WPF I'd rather get a direct answer to my problem.
Well after some tinkering and research I found a solution to my own question. It seems like bits and pieces of my answer were scattered all over the web so I'll try to explain the whole thing at once, in one place. To re-cap I basically wanted to centralize any resources used across projects within my solution. These are the steps I eventually followed to accomplish this.
1.
Create a User Control project in your solution (any project that can host Resource Dictionaries will do). I'll refer to this project as "the resource project".
2.
Add any resource files (images etc...) that you want to share between projects to the resource project. I try to organize files in sub-directories that make sense. You will want to set the build action to "Resource" so that it gets compiled into the output binary.
3.
Now add a resource dictionary to the resource project. In my case I wanted to reference several images so I made one called "ImageDictionary.xaml".
4.
Add references to the image files in the resource dictionary. I am referencing images here but its just a resource dictionary, you can put whatever in there. The string in the middle is just the relative path to the image file you are referring to.
<ImageSource x:Key="SomeImageKey">
Images/SomeImage.bmp
</ImageSource>
5.
Now go to a project that requires the resource dictionary you just made in step 4. It can be another user control or a window, whatever. Right-click on project references and add a reference to the resource project.
6.
Okay now the current project needs to reference the dictionary you made in step 4 that is defined in the resource project. I made a user control first so this is what my code would look like below... Note that I used merged dictionaries. I plan on using more later so I chose this way instead of a single dictionary.
"ResourceProject" below is the name of the project/assembly that you added the resource to.
"component" is a keyword that needs to be there, followed by the path to the dictionary xaml code file.
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/ResourceProjectAssembly;component/Resources/ImageDictionary.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
As you can see, referencing an external resource dictionary requires something called a "Pack URI". I found a short hand way of doing it. The long way is quite a bit uglier and as far as I know, there is no advantage to it. But here is what the long way looks like.
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/ResourceProjectAssembly;component/Resources/ImageDictionary.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
7.
Now that your current project has a reference to the resource dictionary in the resource project, you can use anything from that dictionary. I went ahead and put an image in my user control. Below is the code. Its just like referencing a dictionary locally.
<Image Source="{StaticResource SomeImageKey}" />
8.
Important Note!
This caused me a headache for a while before I found it. Make sure that the startup project in your solution has a reference to the resource project EVEN IF THE STARTUP PROJECT DOES NOT USE THE RESOURCE PROJECT. (I.e. right-click references, add reference etc...)
The resources will not get compiled into the output unless you do this. This part was tricky because the designer was even showing my images and I had no xaml errors but at runtime it would throw set property and cannot find file exceptions. This went away when I referenced my resource project from my startup project.
Hopefully this helps somebody.
Below are some links to a few places (including stackoverflow) that gave me what I needed to put all the pieces together.
http://blogs.msdn.com/b/wpfsldesigner/archive/2010/06/03/creating-and-consuming-resource-dictionaries-in-wpf-and-silverlight.aspx
Load WPF styles or other Static Resources from an external file or assembly
ResourceDictionary in a separate assembly
My understanding of the difference between a WPF theme and a WPF skin is the following:
A WPF skin is a set of resources loaded by an application.
A WPF theme is a set of resources handled by the OS.
To load a skin, I can just call Application.Current.Resources.MergedDictionaries.Add (mySkin);
However, I don't see any way to load a theme.
Is this documented or available?
Should I access the System.Windows.SystemResources internal class?
You can load them as a ResourceDictionary:
<Window
x:Class=”TestProject.Window1?
xmlns=”http://schemas.microsoft.com/winfx/2006/xaml/presentation”
xmlns:x=”http://schemas.microsoft.com/winfx/2006/xaml”>
<Window.Resources>
<ResourceDictionary
Source=”/presentationframework.aero;component/themes/aero.normalcolor.xaml” />
</Window.Resources>
</Window>
Note: You would need to have a reference to the PresentationFramework.Aero.dll.
There's quite a subtle difference between Skins and Themes, and the reason why you're having problems with what you're trying to do might stem from this:
In WPF, a theming and skinning takes
on slight variations to their
meanings. Theming refers to
controlling the look and consistency
of an application UI to match the
operating system. For example, a WPF
application can be themed for the
Windows Aero theme or the Windows
Classic Theme. Skinning refers to
changing the application's appearance.
In other words, applying or letting
the user pick a skin to change the
look and feel of the application.
Robby Ingrebertsen, while working on
the WPF team, simplifies it as
follows:
Around here, we generally say that "theming" refers to the system theme
and "skinning" refers to changes to a specific app. This has helped to
clarify our internal communication
From here
So essentially, if you want your app to look like one of the Windows themes,ie the current windows theme - you don't have to set any styles in your app and it'll chose a pre-defined XAML skin that resembles it automatically. But, if you want to style your application, you make a skin for the app as you're doing.
As far as loading the Windows themes, this answer might help
(Answering my own question)
The way to load a resource dictionary as a theme is to add it to the list of merged dictionaries of the generic.xaml resource dictionary.