MahApps and Property Grid - c#

First of all, great thanks to MahApps. What a cool project!
I have an existing application written in WPF that I have applied the MahApps library to. I used this tutorial:
http://mahapps.com/guides/quick-start.html
However the effect on the Property Grid (Xceed) is minimal.
The combo boxes in my other windows look like this:
The property grid combo boxes still look like this (ugly!):
However clicking on a combo box shows the right MahApps style for the items. It is only the Combo Box itself (closed) that is not flat.
My knowledge on WPF is basic. Where would I start to try and fix this? Do I need to manually override the combo box template in the Property Grid?

in MainWindow.xaml use Controls:MetroWindow
<Controls:MetroWindow x:Name="MainApp" x:Class="AppWin.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
MinHeight="700"
MinWidth="1024"
>
in MainWindow.xaml.cs inheritance MetroWindow
namespace AppWin
{
public partial class MainWindow : MetroWindow
{
...
add App.xaml following settings
<Application x:Class="AppWin.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:AppWin"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<!-- MahApps.Metro resource dictionaries. Make sure that all file names are Case Sensitive! -->
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" />
/*--change template color for example green.xaml--*/
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/red.xaml" />
/*--change template style for example BaseDark.xaml--*/
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
</Application>

Perhaps your other combobox looks ugly because the MahApps resources is not found?
Place the mahapp resources you are using in a resource dictionary in the App.xaml file so it will be accessible for all windows. (and not place them in a resource dictionary in only one window, ie. mainwindow.xaml)
App.xaml:
<Application... >
<Application.Resources>
<ResourceDictionary>
<!-- My other resources -->
<!-- ... -->
<!-- MahApps resources -->
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.AnimatedSingleRowTabControl.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseDark.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>

The property grid overrides the styles of MahApps. You have to create a own PropertyEditor for your properties. The PropertyEditor overrides the styles of the property grid.
I know thats a lot of work, but its the only way to get the MahApps look.

Related

Unable to use TextBox after including MaterialDesignInXaml

I'm building a library (plugin for Revit). I have a Window in which I have included Material design successfully.
When I try adding TextBox control to this Window, I get the following error
System.Windows.Markup.XamlParseException: 'Provide value on 'System.Windows.Markup.StaticResourceHolder' threw an exception.'
Inner Exception: NotImplementedException: The method or operation is not implemented.
Since I'm building a library, I don't have an App.xaml file, so I created a resource dictionary with the following content:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Light.xaml" />
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" />
<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Primary/MaterialDesignColor.DeepPurple.xaml" />
<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Accent/MaterialDesignColor.Lime.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
I include it to my Window using
<Window.Resources>
<ResourceDictionary Source="/MyAsembly;component/MaterialDesign.xaml" />
</Window.Resources>
As I said, using plain simple TextBox throw an exception, no styles, no anything
<TextBox />
All the other WPF controls that I've used so far work normally after including Material design in a window/page.
I have another Window in the same app where I already have TextBox. If I try including MaterialDesign to that Window, I get the same error; without MaterialDesing, TextBox works normally. If I include MaterialDesing and comment out the TextBox, the code works normally.
Any help is highly appreciated.
EDIT: Demo app that demonstrates the problem can be found here.
You must also provide the XAML namespace along with your ResourceDictionary declaration as shown below.
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Light.xaml" />
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" />
<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Primary/MaterialDesignColor.DeepPurple.xaml" />
<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Accent/MaterialDesignColor.Lime.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
put this line to your main window tag
xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"

Apply Aero style on WPF library

I want to force the Aero style on my forms. I created a "WPF Class Library" and added a form and controls to this form. As the library will be called by 3rd party C# applications running on different OS, I want to force to always apply the Aero style.
But as it is a WPF class library I have no App.xaml file where I could put my Resource Dictionary.
I placed it in a dedicated custom Styles.xaml therefore and in my form I reference it like
<Window.Resources>
<ResourceDictionary Source="Styles.xaml">
</ResourceDictionary>
</Window.Resources>
where Styles.xaml 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:MyLib">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/PresentationFramework.Aero;V4.0.0.0;component/themes/Aero.NormalColor.xaml"></ResourceDictionary>
</ResourceDictionary.MergedDictionaries>
and is set to "Build action: Embedded resource" and is stored in the main project folder. I also added a reference to PresentationFramework.Aero in my project.
When I call my library form from the C# application, I get an error saying
Set property 'System.Windows.ResourceDictionary.Source' threw an exception.' Line number 'x' and line position 'y'
What did I do wrong?
This should work for you.
<ResourceDictionary Source="pack://application:,,,/PresentationFramework.Aero;component/themes/Aero.NormalColor.xaml" />
Refere this MSDN article for more details.
UPDATE
Include ResourceDictionary in PCL
Create a ResourceDictionary
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/PresentationFramework.Aero;component/themes/Aero.NormalColor.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
<!-- store here your styles -->
</ResourceDictionary>
You can use it from Your PCL in WPF App
<Window x:Class="Test.Window"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window"
Height="300"
Width="300">
<Window.Resources>
<ResourceDictionary Source="pack://application:,,,/Your.Base.AssemblyName;component/YourResDictionaryFolder/Dictionary1.xaml" />
</Window.Resources>
<Grid>
</Grid>
</Window>
Your.Base.AssemblyName = Dll name
YourResDictionaryFolder = Folder where you created your ResourceDictionary
Dictionary1.xaml = File name which you created above

WPF icon repository

I have list of icon which will be displayed for different button i.e. save delete.
what I want to do is to list down all the icons in some xaml file like app.xaml
<Resource x:Key="error" Source="Icons/Error.ico" />
<Resource x:Key="save" Source="Icons/save.ico" />
then want to access same thing in individual file as follow.
Icon="{Binding save}"
I would appreciate if someone suggest me correct approach if this is not correct.
Create resource dictionary Images.xaml
Add all images to that dictionary in this form
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<BitmapImage x:Key="Icon1"
UriSource="Images/icon1.png" />
.....
</ResourceDictionary>
When you want to use it,
<Image Source={StaticResource Icon1} />
Dont forgot to include that Image.xaml, to the place where you want to use it... actually you can merge it directly to your main dictionary in App.xaml
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Themes/Images.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>

WPF MahApps Change style of Window notworking for elements inside its UserControl

I added MahApps resources like in App.xaml:
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.AnimatedTabControl.xaml" />
<!-- accent resource -->
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/blue.xaml" />
<!-- theme resource -->
<!-- change "BaseLight" to the theme you want -->
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/basedark.xaml" />
</ResourceDictionary.MergedDictionaries>
....
It works well on all of my windows but i have a special window (WindowA) that i want be in a different color so i added the MahApps resources to this window
WindowA.xaml:
<controls:MetroWindow.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.AnimatedTabControl.xaml" />
<!-- accent resource -->
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/blue.xaml" />
<!-- theme resource -->
<!-- change "BaseLight" to the theme you want -->
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/basedark.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</controls:MetroWindow.Resources>
Now i want apply my accent color dynamically to it, so i use some codes like this:
ThemeManager.ChangeAppStyle(appOrWindow,
ThemeManager.GetAccent("Amber"),
ThemeManager.GetAppTheme("basedark"));
The result is cool for title bar color (Amber color) of the WindowA BUT i have a label (Lable 1) in a UserControl (TestUserControl) inside WindowA and its color is Blue yet!
WindowA > TestUserControl > Lable 1
The lable 1 xaml tag inside TestUserControl:
<Label Foreground="{StaticResource AccentColorBrush}">Lable1</Label>
I want change all element colors with {StaticResource AccentColorBrush} Foreground color to Amber include all elements inside UserControls of the WindowA with AccentColorBrush StaticResource.
I think the UserControl is using MahApps resources declared in App.xaml. How can i force it to use MahApps resources declared in WindowA.xaml.
How can i fix this?
Edit1
If i apply an accent like Red to the Application the label 1 color will be changed to the Red color.
Add this to the UserControl.Resources
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/amber.xaml" />
You should use DynamicResource instead StaticResource for the foreground.
<Label Foreground="{DynamicResource AccentColorBrush}">Lable1</Label>
Hope that helps.

Applying MahApps.Metro Dark theme

I am relatively new to WPF and I am trying to apply Windows Metro Dark theme to my entire application.
I used the following in my Apps.xaml and I can see the Windows Metro Light theme properly.
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Blue.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
Now I want to change the theme to Dark. I understand I can always use,
ThemeManager.ChangeTheme()
But I believe there should be a way to do this with XAML effective to all the windows of the application.
My Question : Can someone point me how to do this without using ThemeManager in source code?
Try to use BaseDark instead of BaseLight. Try to change this line :
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
to this :
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseDark.xaml" />
That did the trick for me. Screenshot of my application using MahApps BaseDark and BaseLight accents:
BaseDark
BaseLight

Categories