How to set visual studio navigation menu style? - mahapps.metro

Someone know how to set menunavigation style? In particular I want to create the same style of the navigation menu of visual studio. In the demo project there's one available but I don't understood how the style is set. This is the style:
UPDATE with my APP.xaml
<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 Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.TreeView.xaml" />
Before:
After mouse overlap:

The VS menu style is used by the Styles.xaml resource dictionary, just put it in the resources of the window, or if you want it in the hole app, in the App.xaml.
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/VS/Colors.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/VS/Styles.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
Edit (ful app resources)
<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/BaseDark.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/VS/Colors.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/VS/Styles.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
Edit (only the menu style)
using only the menu style is not possible for the hole app, you must add the resources where your menu is created.
<Grid>
<Grid.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/VS/Menu.xaml" />
</ResourceDictionary.MergedDictionaries>
<Style TargetType="MenuItem"
BasedOn="{StaticResource StandardMenuItem}" />
<Style TargetType="Menu"
BasedOn="{StaticResource StandardMenu}" />
</ResourceDictionary>
</Grid.Resources>
<Menu>
<MenuItem Header="Main">
<MenuItem Header="Menu 1"></MenuItem>
<MenuItem Header="Menu 2"></MenuItem>
</MenuItem>
</Menu>
</Grid>
Hope that helps.

Related

WPF: How to remake Mahapps Metro application to class library?

I have a WPF Mahapps Metro style application.
That is the MainWindow containing Usercontrol, and inside it works with other Usercontrols like Wizard Pages.
Now I am trying to remake it to a class library to use it in WiX Bootstraper application.
The one of problems is: where place resources which are in
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
...
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
I have placed it to the main Usercontrol xml but it is an error:
<UserControl.Resources>
<ResourceDictionary> <------------x:Key required?
<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>
<DataTemplate DataType="{x:Type viewModel:ViewModelAlreadyInstalledPage}">
<view:AlreadyInstalledPage/>
</DataTemplate>
...
You have to put the DataTemplate inside the ResourceDictionary:
<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>
<DataTemplate DataType="{x:Type viewModel:ViewModelAlreadyInstalledPage}">
<view:AlreadyInstalledPage />
</DataTemplate>
</ResourceDictionary>

Changing UI Style in MahApps.Metro MessageDialog buttons

I have a custom theme for my application and I would like to change the Style of the buttons (color, border, etc..) of the Buttons generated by the MessageDialog to match my application theme. Is there a simple way to do this in XAML ?
If you set your application theme in the app.xaml like below the standard mahapps.metro styles usually do a pretty good job of matching the application (including the mahapps MessageDialog).
app.xaml
<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/Red.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
sample button styles
<Button Style="{DynamicResource AccentedSquareButtonStyle}" />
<Button Style="{DynamicResource MetroCircleButtonStyle}"/>
You can also change styles if sections of your code
<StackPanel>
<StackPanel.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/FlatButton.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</StackPanel.Resources>
</StackPanel>
You should check out MahMappsmetro and their Github
Hope that is what you were asking.

Merged dictionaries and local resources

I have a Styles.xaml that groups many ResourceDictionarys inside a MergedDictionary.
I imported Styles.xaml in my UserControl.Resources
<UserControl.Resources>
<ResourceDictionary Source="Dictionaries\Styles.xaml" />
</UserControl.Resources>
but when I try to add a converter
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Dictionaries\Styles.xaml" /> <--! Exception -->
</ResourceDictionary.MergedDictionaries>
<BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
</ResourceDictionary>
</UserControl.Resources>
it raises
ArgumentNullException: Value cannot be null.
Parameter name: item
Wrapping the converter inside another MergedDictionary has no effect.
How can I solve this?
Thank you all!
SOLVED
I eventually figured it out: the Exception was raised inside one the .xaml files, but Visual Studio does not provide enough info to locate the faulty line.
Following code does work.
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Dictionaries\Styles.xaml" />
</ResourceDictionary.MergedDictionaries>
<BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
</ResourceDictionary>
</UserControl.Resources>
Try this
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/PROJECTNAMESPACE (TestProject.Something);component/Dictionaries/Styles.xaml" />
</ResourceDictionary.MergedDictionaries>
<BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter"/>
</ResourceDictionary>
</UserControl.Resources>

MahApps style should not apply to all items

I noticed when adding the MahApps.Metro styles to my resource dictionary that these styles are being applied to all items within my application, this is not the desired effect. I only want to use the ToggleSwitch and Combobox Styles. How can this be achieved?
Thanx!
put only the following resource dictionaries in your xaml
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colours.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.Buttons.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.ComboBox.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>
<Style TargetType="ToggleButton" BasedOn="{StaticResource MetroToggleButton}" />
<Style TargetType="ComboBox" BasedOn="{StaticResource MetroComboBox}" />
<Style TargetType="ComboBoxItem" BasedOn="{StaticResource MetroComboBoxItem}" />
</ResourceDictionary>
hope this helps

MVVM Light ViewModelLocator + ResourceDictionaries

I originally posted this message on the MVVM Light CodePlex page but haven't heard a response yet so I'm hoping someone here can help me. Here is the question:
I recently started playing with MVVM (new to WPF too - quite the learning curve for all of this) and everything was working great with my ViewModelLocator instance and binding design-time for VS2010 until I started using the MetroToolkit provided on CodePlex. Before utilizing the toolkit, I had the following:
<Application.Resources>
<local:ViewModelLocator x:Key="Locator" d:IsDataSource="True" />
</Application.Resources>
All of my views were binding great and everything looked really good. I was surprised at just how easy someone without MVVM (or MVC) experience could get up and running. Then I hit a snag of MetroToolkit requiring merged resource dictionaries and now no matter what I try I can't get VS to find my ViewModelLocator again inside App.xaml. Here is the new markup:
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Colors.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Animations.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Geometry.xaml"/>
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Generic.xaml"/>
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Buttons.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Scrollbar.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Scrollviewer.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/RadioButton.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/ProgressBar.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/ContextMenu.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Tooltip.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Checkbox.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Headings.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Textbox.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Combobox.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Slider.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Expander.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/TabControl.xaml" />
</ResourceDictionary.MergedDictionaries>
<local:ViewModelLocator x:Key="Locator" d:IsDataSource="True" />
</ResourceDictionary>
</Application.Resources>
I have tried giving the resource dictionary a key, adding the line outside of the area (above and below - throws nasty and very unhelpful errors) and can't get it to find my VM Locator. It works immediately when I remove the block from App.xaml, but based on my very limited knowledge of WPF I need those if I want the styles to be available to all views in my application.
Any thoughts? This has been driving me crazy for a few hours now.
yep...I just saw this the other day...You have to put a resource dictionary inside...
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Colors.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Animations.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Geometry.xaml"/>
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Generic.xaml"/>
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Buttons.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Scrollbar.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Scrollviewer.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/RadioButton.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/ProgressBar.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/ContextMenu.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Tooltip.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Checkbox.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Headings.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Textbox.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Combobox.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Slider.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/Expander.xaml" />
<ResourceDictionary Source="/MetroToolkit;component/Themes/Dark/TabControl.xaml" />
<ResourceDictionary>
<local:ViewModelLocator x:Key="Locator" d:IsDataSource="True" />
</ResourceDictionary>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
**EDIT
Sorry...Fixed it now...I was going from memory...this is the way it is in mine.
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Dictionaries/converters.xaml" />
<ResourceDictionary Source="assets/styles.xaml" />
<ResourceDictionary Source="assets/sdkstyles.xaml" />
<ResourceDictionary Source="assets/corestyles.xaml" />
<ResourceDictionary>
<local:ApplicationResources x:Key="ApplicationResources" />
</ResourceDictionary>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>

Resources