I am new to WPF. My requirement is to implement the styling in a clean way. Styling includes fonts, colors, layouts, size,. etc.
Sample implementation with style is shown above. Requirement is in a window if its a form which receives input from user, common style needs to there like label has to right aligned, textbox has to be left aligned and some width and some properties and foreground property too.
My implementation
I made a separate assembly (because not only for this purpose it includes other user controls, styles, resources) which has a Layout.Xaml resource dictionary and in it all styles are defined.
Then a dependency property is created and through that the dictionary is linked as shown below.
<Window xmlns:MvvmLibsTests="clr-namespace:CreativeEye.TestConsole.MvvmLibsTests"
x:Class="CreativeEye.TestConsole.MvvmLibsTests.StyleTestView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="SyleTestView" Height="408" Width="706"
WindowStartupLocation="CenterScreen"
xmlns:Styles="clr-namespace:CreativeEye.MvvmLibs.Behaviours;assembly=CreativeEye.MvvmLibs">
<!--<Grid>-->
<Grid Styles:SetLayout.Resources="{StaticResource FormLayoutStyle}">
</Grid>
</Window>
In that FormLayoutStyle has value
<s:String x:Key="FormLayoutStyle">pack://application:,,,/CreativeEye.MvvmLibs;component/Resources/Layout.xaml</s:String>
in App.Xaml of the application.
The code for dependency property is
public static readonly DependencyProperty ResourcesProperty = DependencyProperty.RegisterAttached(
"Resources",
typeof(string),
typeof(SetLayout),
new PropertyMetadata("", new PropertyChangedCallback(CallBack)));
private static void CallBack(DependencyObject obj, DependencyPropertyChangedEventArgs e)
{
var layoutGridStylePath = e.NewValue;
if (layoutGridStylePath == null)
{
return;
}
var uri = new Uri((string)layoutGridStylePath, UriKind.RelativeOrAbsolute);
var grid = obj as FrameworkElement;
if (grid == null)
{
return;
}
grid.Resources.Source = uri;
}
And i achieved the result.
But i wanted to know is it a good way ?
and also i read some thing about memory leaks.
Reference links link 1, link 2.
I was more confused. I couldn't understand properly.
Can anyone please say in my implementation such memory leak problem will be der ?
Generally i use resources this way, but binding to c# code is also not at all a bad approach.
<Window x:Class="WPFDemo.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary
Source="Resources/MyResourceDictionary.xaml">
</ResourceDictionary>
<ResourceDictionary
Source="Resources/OthersStyle.xaml">
</ResourceDictionary>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
<Grid>
<Image Source="/Images/logo.jpg"></Image>
</Grid>
</Window>
Related
I have a project along with main project in my solution. I want to localize the content in this xaml file in this project.
I use the ways that have been discussed here How to change UI language using resource dictionary at run time in MVVM?.
However I could not find ObjectDataProvider in any way.
<UserControl xmlns:languageHelper="clr-namespace:XX"
<UserControl.Resources>
<ObjectDataProvider x:Key="Resources" ObjectType="{x:Type languageHelper:CultureResources}" MethodName="GetResourceInstance"/>
</UserControl.Resources>
</UserControl>
and I use this code to find ObjectDataProvider but i coulnt get it through
public static ObjectDataProvider ResourceProvider
{
get
{
if (m_provider == null)
m_provider = (ObjectDataProvider)System.Windows.Application.Current.FindResource("Resources");
return m_provider;
}
}
Resources.Culture = culture;
ResourceProvider.Refresh();
It shows System.Windows.ResourceReferenceKeyNotFoundException: ''Resources' resource not found.'
Well the problem is that you are creating your ObjectDataProvider in your UserControls resources. I think you have to create that in your App.xaml file
here is an example:
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ObjectDataProvider x:Key="Resources"
ObjectType="{x:Type languageHelper:CultureResources}"
MethodName="GetResourceInstance"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
At our company, we're used to develop our applications using WinForms,
Now we decided to switch to WPF-MVVM with Caliburn.Micro and Modern UI.
The thing we're trying to reach is to have a small application that has:
- 1 Modern Window
- 2 Pages inside that Modern window
the goal is to have a button inside that page that navigates the Modern Window to the second page with parameters.
I've been working trying to understand how to work this out, I succeeded with the Window (without the MUI), but when it comes to MUI, it's not really giving me the result we want.
So far, All I did, is
Create a new MUI Project
Add the Caliburn.Micro to the project
Change the App.xaml to
<Application x:Class="MuiWithCaliburn01.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:MuiWithCaliburn01">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary>
<local:AppBootstrapper x:Key="bootstrapper" />
<local:ModernContentLoader x:Key="ModernContentLoader" />
</ResourceDictionary>
<ResourceDictionary Source="/FirstFloor.ModernUI;component/Assets/ModernUI.xaml" />
<ResourceDictionary Source="/FirstFloor.ModernUI;component/Assets/ModernUI.Light.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
Create the Bootstrapper Class
public class AppBootstrapper : BootstrapperBase
{
static AppBootstrapper()
{
}
public AppBootstrapper()
{
Initialize();
}
protected override void OnStartup(object sender, StartupEventArgs e)
{
DisplayRootViewFor();
}
}
Create the ModernContentLoader Class
public class ModernContentLoader : DefaultContentLoader
{
protected override object LoadContent(Uri uri)
{
var content = base.LoadContent(uri);
if (content == null)
return null;
var vm = Caliburn.Micro.ViewModelLocator.LocateForView(content);
if (vm == null)
return content;
if (content is DependencyObject)
{
Caliburn.Micro.ViewModelBinder.Bind(vm, content as DependencyObject, null);
}
return content;
}
}
ModernWindowView.xaml & ModernWindowViewModel.cs
< mui:ModernWindow x:Class="MuiWithCaliburn01.ModernWindowView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mui="http://firstfloorsoftware.com/ModernUI"
ContentLoader="{StaticResource ModernContentLoader}">
< mui:ModernWindow.MenuLinkGroups>
< mui:LinkGroupCollection>
< mui:LinkGroup DisplayName="Hello">
< mui:LinkGroup.Links>
< mui:Link Source="Child1View.xaml" DisplayName="Click me">< /mui:Link>
< /mui:LinkGroup.Links>
< /mui:LinkGroup>
< /mui:LinkGroupCollection>
< /mui:ModernWindow.MenuLinkGroups>
< /mui:ModernWindow>
class ModernWindowViewModel : Conductor.Collection.OneActive
{
public ModernWindowViewModel()
{
//this function is doing nothing in the ModernWindow, but it works great in the Window.
ActivateItem(new Child1ViewModel());
}
}
And finally, the Child1View.xaml
<UserControl x:Class="MuiWithCaliburn01.Child1View"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mui="http://firstfloorsoftware.com/ModernUI"
mc:Ignorable="d"
xmlns:cal="http://www.caliburnproject.org"
xmlns:model="clr-namespace:MuiWithCaliburn01"
d:DataContext="{x:Type model:Child1ViewModel}"
d:DesignHeight="300" d:DesignWidth="300">
<Grid>
<Button cal:Message.Attach="ClickMe" Width="140" Height="50">Hello World</Button>
</Grid>
</UserControl>
and Child1ViewModel.cs
public class Child1ViewModel : Conductor<IScreen>
{
public void ClickMe()
{
MessageBox.Show("Hello");
}
}
My question is, step 6, why does the function do nothing? and if my way is wrong can anybody direct me to a better way?
And if it's the best approach, how can I navigate from the function ClickMe to another View.
As for your first question about why does the function do nothing, I think it may have to do with the hierarchy of your project. Using MUI this is the main (and only) window for one of my applications
<mui:ModernWindow x:Class="namespace.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mui="http://firstfloorsoftware.com/ModernUI"
Title="Window Title" IsTitleVisible="True"
ContentSource="/Pages/Home.xaml"
Style="{StaticResource MyModernWindow}">
<mui:ModernWindow.TitleLinks>
<mui:Link DisplayName="settings" Source="/Pages/SettingsPage.xaml" />
</mui:ModernWindow.TitleLinks>
in my project hierarchy, i have my project root (CSPROJ file), MainWindow.xaml then a Pages folder. Inside my pages folder i have my SettingsPage.xaml. The source attribute in my mui:Link tag points to the realitive path of my main window to my settingsPage.xaml file. MUI will then load and display that path in the content provider that is put in your main window for you by the MUI ModernWindow class default style template. No additional code is needed on your part to navigate (until you want complex sub view navigation).
my settingsPage.xaml file is a normal user control with the grid having a style assigned to the ContentRoot static resource style as it also will contain additional views/pages.
Mui source can be found on GitHub at Mui GithubLink. Here you can download the sample program, who's code is found in the same repository under app Link here for covience.
I am not familiar with Caliburn.Micro so i'm not sure how the two integrate together, such as requirements of Caliburn.Micro to function. I do know how MUI integrates with MVVM light and there are many examples of this found on the internet in my research before hand.
I'm writing a small application whilst learning MVVM in WPF.
As long as I keep on using one Window, everything is pretty easy.
Now I want to open a new Window with a specific ViewModel.
I have a main ViewModel, which contains a Command that should open a new Window / ViewModel, along with a Parameter.
To do this in an MVVM way, I've created a NavigationService, which I'd like to call like this:
public MainWindowViewModel()
{
DetailsCommand = new DelegateCommand(Details);
}
public void Details()
{
SessionsViewModel sessions = new SessionsViewModel();
_NavigationService.CreateWindow(sessions);
}
I've noticed that it's possible to "bind" Views and ViewModels in XAML, like this:
<Application x:Class="TimeTracker.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:TimeTracker"
xmlns:vm="clr-namespace:TimeTracker.ViewModels"
xmlns:vw="clr-namespace:TimeTracker.Views"
StartupUri="Views/MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<DataTemplate DataType="{x:Type vm:MainWindowViewModel}">
<vw:MainWindow />
</DataTemplate>
<DataTemplate DataType="{x:Type vm:SessionsViewModel}">
<vw:Sessions />
</DataTemplate>
</ResourceDictionary>
</Application.Resources>
</Application>
<Window x:Class="TimeTracker.Views.Sessions"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:TimeTracker.Views"
xmlns:vm="clr-namespace:TimeTracker.ViewModels"
mc:Ignorable="d"
Title="Sessions" Height="300" Width="300">
<Window.DataContext>
<vm:SessionsViewModel/>
</Window.DataContext>
<Grid>
<TextBlock Text="Hallo" />
</Grid>
</Window>
The problem I'm having is that I don't know how I can use this ResourceDictionary in my NavigationService, so that I can create a new Window by only using its ViewModel.
class NavigationService
{
public void CreateWindow(IViewModel viewModel)
{
//How do I create a new Window using the ResourceDictionary?
}
}
Make sure you have a ContentControl or ContentPresenter in your new window so that the ViewModel can be presented. Next, make sure that resource dictionary is in scope. Putting it in Application.Resources will make it global and guarantee that WPF can find the DataTemplate.
Also, don't use a Window class as your view in the DataTemplate. Use your sub-window panel (e.g., Grid, StackPanel, etc).
I do this:
<blah:MyChildWindow>
<ContentControl Content={Binding DataContext}/>
</blah:MyChildWindow>
And in Application.Resources:
<DataTemplate DataType={x:Type blah:MyViewModel}>
<blah:MyChildWindow/>
</DataTemplate>
BTW - using DataTemplates the way you are trying to do is an excellent pattern.
I have a simple window:
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:self="clr-namespace:WpfApplication1"
Title="MainWindow" Height="435" Width="613">
<StackPanel>
<Canvas Name="canvas">
<self:Red />
</Canvas>
<UserControl Name="uc">
<self:Blue />
</UserControl>
</StackPanel>
</Window>
Redand Blueare very simple UserControls:
<UserControl x:Class="WpfApplication1.Blue"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<Grid>
<Rectangle Fill="Blue" Width="100" Height="100" />
</Grid>
</UserControl>
I have created some ContextMenus:
public MainWindow()
{
InitializeComponent();
canvas.ContextMenu = new ContextMenu();
canvas.ContextMenuOpening += (sender, e) =>
{
System.Diagnostics.Debug.WriteLine(e.Source.GetType());
};
uc.ContextMenu = new ContextMenu();
uc.ContextMenuOpening += (sender, e) =>
{
System.Diagnostics.Debug.WriteLine(e.Source.GetType());
};
}
If I open the context menu on the Canvas, the Source is Red, but if I open it on the UserControl, Source is UserControl.
Any idea why?
I found this on MSDN:
ContextMenu itself is a FrameworkElement derived class, but this event will not be raised from the context menu being opened as a source. The event is raised from the element that "owns" the context menu as a property...
If I understand it correctly Source should be Canvas in the first case, but it isn't.
This behavior is covered fairly well in the MSDN documentation for the RoutedEventArgs.OriginalSource property:
Source adjustment by various elements and content models varies from class to class. Each class that adjusts event sources attempts to anticipate which source is the most useful to report for most input scenarios and the scenarios for which the class is intended, and then sets that source as the Source. If this source is not the one that has relevance to your handling of the event, try checking OriginalSource instead to see if it reports a different source that is more suitable.
Which is exactly what the UserControl class does, it patches the Source property in its AdjustBranchSource() method.
So, as hinted by the quoted text, you are perhaps looking for the OriginalSource property to make the code behave similarly, you'll get a reference to the Rectangle in both cases.
I would like to know exactly how to dynamically use a Dictionary Resource in the C# code behind - ie.. I would like to load images at runtime from an image resource within a dictionary
I have a program that has 3 images in a WPF Dictionary - these are images set as image resources.
Then in the code behind of my WPF Window I want to load any one of the three images based on user initiated events.
There is no real code I have to show as nothing that I have done works.
Ideas?
First, make sure you've defined your image resources like this:
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<ImageSource x:Key="image1">images/image1.jpg</ImageSource>
<ImageSource x:Key="image2">images/image2.jpg</ImageSource>
</ResourceDictionary>
Secondly, I'm assuming that your WPF dictionary is in its own file. Now you have to make sure you've merged your dictionary into your main window's XAML (skip this step if your resource dictionary is defined inside of the window's XAML). In your window's XAML file, make sure you have something like this:
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="myDictionary.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
Now, in your code-behind, you can use the FindResource() method to locate your image resource by it's key name (the value of the x:Key attribute on the ImageSource in the resource dictionary) like so:
imageControl.Source = (ImageSource)FindResource("image1");
Hope this helps!
This is an addition to the accepted answer:
When working within a ViewModel from MVVM, make sure to use the FindResource from the view where the resource directory is added.
<Window x:Class="My.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:ViewModels="clr-namespace:My.ViewModels"
Title="USA Hockey Player Evaluation tool"
Icon="/USAHockeyPlayerEval;component/View/Images/HET.ico"
SizeToContent="WidthAndHeight"
MinHeight="500px" MinWidth="800px">
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Images.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
<Window.DataContext>
<ViewModels:MainWindowMV/>
</Window.DataContext>
<StackPanel>
<Menu>
<MenuItem Header="File">
<MenuItem Header="Save"></MenuItem>
My view in this case is a window (I know not correct MVVM ;-) )
Image img = new Image();
img.Source = (ImageSource)WindowReference.FindResource("Pluse");
Here the WindowReference is a reference to My.MainWindow.