I have a wizard created in WPF consisting of pages as UserControl objects. What I'm trying to do is to load plugins from .DLL files which contain the following:
A code file for the plugin logic.
A XAML user control which will present configuration options for the plugin, displayed in the main wizard.
A view model for the user control.
I've been able to successfully load in and instantiate the UserControl object as well as the View Model, and I have gotten to the stage where the Control appears in it's own wizard page as intended.
(This is probably the view model that's instantiated correctly, since I set the title for the wizard page in the view model and that all works fine)
The problem I'm getting is that the UserControl I've loaded from the DLL isn't displaying correctly. Instead of displaying the UserControl contents, it just shows the plaintext MyDLL.MyCustomUserControl from the line x:Class="MyDLL.MyCustomUserControl" where the actual user control should be.
The contents of my user control that I'm loading from the DLL is:
<UserControl x:Class="MyDLL.MyCustomUserControl"
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">
<StackPanel>
<Label Content="This is the Plugin Options Page" />
<TextBox Text="{Binding Path=PluginStringText}" />
</StackPanel>
</UserControl>
The property PluginStringText exists in the View Model for this User Control.
I have a feeling I need to somehow assign or bind the View Model to the User Control after loading it in from the DLL.
As part of my wizard, there is a section where I define Data Templates (this is another UserControl which contains the Wizard's pages), but I don't know how to actually add extra templates during runtime. I have a feeling this is causing the issue.
Searching through many topics reveals I could probably do this through the code behind file for the view, but then I have no way of obtaining a reference to the view's code behind in the first place to call a method. Is there a way of adding a new DataTemplate entry from the View's View Model class?
<UserControl.Resources>
<DataTemplate DataType="{x:Type viewModel:ExistingPage1ViewModel}">
<view:ExistingPage1View />
</DataTemplate>
<DataTemplate DataType="{x:Type viewModel:ExistingPage2ViewModel}">
<view:ExistingPage2View />
</DataTemplate>
<...>
Thanks in advance if someone could point me in the right direction
I found a way to resolve this.
The problem was as I had expected, there was no mapping between the ViewModel data type and the View in which to render the ViewModel with.
I discovered a useful guide here http://www.ikriv.com/dev/wpf/DataTemplateCreation/ which explains how to create a new data template within code, very similar to if you'd hard coded the template in the XAML.
This was all well and good, but I still had to find a way to call the method to create the data template.
Well - It turned out I didn't need to call the method at all in the code behind! I just put the method to create the data template directly in my view model which is responsible for populating the wizard's pages.
This also has the added benefit that I do not have to hard code my existing pages datatemplate's in the xaml.
I will add the code referenced at http://www.ikriv.com/dev/wpf/DataTemplateCreation/ for future reference:
The method to create the DataTemplate object:
DataTemplate CreateTemplate(Type viewModelType, Type viewType)
{
const string xamlTemplate = "<DataTemplate DataType=\"{{x:Type vm:{0}}}\"><v:{1} /></DataTemplate>";
var xaml = String.Format(xamlTemplate, viewModelType.Name, viewType.Name, viewModelType.Namespace, viewType.Namespace);
var context = new ParserContext();
context.XamlTypeMapper = new XamlTypeMapper(new string[0]);
context.XamlTypeMapper.AddMappingProcessingInstruction("vm", viewModelType.Namespace, viewModelType.Assembly.FullName);
context.XamlTypeMapper.AddMappingProcessingInstruction("v", viewType.Namespace, viewType.Assembly.FullName);
context.XmlnsDictionary.Add("", "http://schemas.microsoft.com/winfx/2006/xaml/presentation");
context.XmlnsDictionary.Add("x", "http://schemas.microsoft.com/winfx/2006/xaml");
context.XmlnsDictionary.Add("vm", "vm");
context.XmlnsDictionary.Add("v", "v");
var template = (DataTemplate)XamlReader.Parse(xaml, context);
return template;
}
This DataTemplate then needs to be registered as an application resource:
Registering the DataTemplate:
Application.Current.Resources.Add(template.DataTemplateKey;, template);
Once again, this code was provided thanks to Ivan Krivyakov at http://www.ikriv.com/dev/wpf/DataTemplateCreation/
Related
I'm trying to set a new DataTemplate as a new Window resource in my MainWindow derived from the System.Windows.Window class. The code for the XAML is quite simple and looks like this:
<Window.Resources>
<DataTemplate DataType="{x:Type model:MyViewModel}">
<view:MyView />
</DataTemplate>
</Window.Resources>
What I exactly do here?
I try to show my data (MyViewModel) in or as a specific view (MyView). So far I do understand. Otherwise I wouldn't see the form itself, but the view model as a string with my.namespace.MyViewModel in the window.
But programmatically I do not understand, how to achieve the same. I know, that I have to add a new DataTemplate to the resources of my window. For this I have to "tell" the DataTemplate, which view to use (for the representation) and which data I want to represent, right?
So it must be something with:
DataTemplate template = new DataTemplate();
template.DataType = typeof(MyViewModel);
// Something, something ...
this.Resources.add(...);
Is this the right way to go? Or am I completely wrong?
I searched the web for solutions and also my WPF book, but there are only XAML implementations.
Why do I do that?
I have a headered content control which loads view models dynamically. The problem here is, that the user controls are sometimes dynamic and in case of data presentation I need to assign a specific (dynamic created) view to the data. So I try to load the current static user controls also in the way shown above.
Is there a way to go?
Or is there a better way to achieve the same results?
Whenever I bind text property to view model property
<TextBlock Text="{Binding SomeExampleText}"/>
on the designer I see nothing in the place where my text will appear in runtime. When I use x:Bind:
<TextBlock Text="{x:Bind ViewModel.SomeExampleText}"/>
on the designer I see "ViewModel.SomeExampleText", sometimes it does not display full length because of lacking space (if the binding path is too long).
Is there any way to have custom text displayed in designer just for preview instead of binding path or nothing as ashown above?
There are ways to create view models specifically for design time. The simplest approach is probably this:
<TextBlock Text="{x:Bind ViewModel.SomeExampleText, FallbackValue='Hello!'}"/>
That one shows the string "Hello" in the designer, both with Binding and x:Bind.
For Binding you can set the design-time data context something like this:
<Page
...
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:viewModels="using:MyNameSpace.ViewModels"
d:DataContext="{d:DesignInstance Type=viewModels:DesignTimeViewModel, IsDesignTimeCreatable=True}"
mc:Ignorable="d">
The DesignTimeViewModel doesn't need any spcecific relation to your run-time view model; it only needs to have suitable properties with the same names. If you are binding to collections, this is probably your best bet.
Create a specific view model for the Design view in order to dial in the view's layout and style with realistic data that won't enter the run-time environment.
Since x:Bind looks to the code-behind for a strongly typed data source, you'll need to mimic that data binding path in the Design view. Here's one way:
Apply the d:DataContext attribute to your view set the Type property to your view. When "IsDesignTimeCreatable" is true, it'll create a new instance of your code-behind.
d:DataContext="{d:DesignInstance Type=local:MainPage,IsDesignTimeCreatable=True}"
Your code-behind likely has a ViewModel property that can be set to a design-time state with fake data or a run-time state with real data.
This blog post shows an example: http://fast417.blogspot.com/2016/06/uwp-design-preview-with-xbind.html
I have a Window, and there are three types of content that can be displayed (they are all of UserControl type):
Login view
App view
Error reporting
What's the most appropriate way to switch between these? My thought was to pass instance of Window in the constructor and then addressing it's content.
Content = new LoginView(this);
And then change the content from LoginView,
public LoginView(Window wnd){
InitializeComponents();
wnd.Content = new MainView(wnd);
}
But this wouldn't update the Window's content. Is it caused by the caller (LoginView) being the window's current content? If that's the case, what would be the proper way to handle such situation?
Also note that the snippet provided doesn't include any logic. I just left it as simple as required to demonstrate the issue I'm facing.
Basically the connection between those controls is such:
Login view
- when the application starts
- when the application window sends a request (to the server) that returns unauthorized
App view
- handles all the application's features
Error view
- replaces app/login view in case of an error and informs user about what to do
You should maybe look at the MVVM pattern. Usually every user control / view should have its own view model, when using the MVVM pattern. So you can define different Views inside a MainView. Like the following example shows:
<Window.Resources>
<DataTemplate x:Key="LoginView" DataType="{x:Type ViewModel:LoginViewModel}">
<local:LoginView />
</DataTemplate>
<DataTemplate x:Key="AppView" DataType="{x:Type ViewModel:AppViewModel}">
<local:AppView />
</DataTemplate>
<Window.Resources>
So in your code of the MainView, you have to pass the appropriate ViewModel in a ContentControl. This will reference the right View.
<ContentControl Content="{Binding LoginViewModel}" />
So the DataTemplate will be shown, depending on the xxxViewModel that is passed.
This MVVM stuff is making my head hurt. I have an application which has a list of editors in a left pane. On the right is a tab control where the editors will be displayed. I have a main application view model that contains a collection of view models. I call this collection Workspaces. This is borrowed from the MvvmDemoApp that Microsoft provides here.
public ObservableCollection<WorkspaceViewModel> Workspaces
{
get
{
...
}
}
These workspaces are bound to a tab control in the main application window like so:
<DataTemplate x:Key "WorkspacesTemplate">
<TabControl
IsSynchonizedWithCurrentItem="True"
ItemSource="{Binding Workspaces}"
SelectedItem="{Binding ActiveWorkspace}"/>
</DataTemplate>
...
<ContentControl
Content="{Binding}"
ContentTemplate="{StaticResource WorkspacesTemplate}"/>
The view models are tied to a view using DataTemplates like so:
<DataTemplate DataType="{x:Type vm:MessageLogViewModel}">
<vw:MessageLogView/>
</DataTemplate>
This works fine. However, now I need to make the application configurable where the list of editors are read from a config file. I imagine this config file will contain the view and view model components for each editor. But, how do I tie the two together so that when someone binds to a view model (or a collection of view models), the correct view gets displayed (similar to what the DataTemplate does but in code, not XAML)?
I'm trying to stay away for Inversion of Control (IoC) techniques. I'm not sure our team is ready for that must sophistication.
IoC is the perfect solution for this however without this option you could creating the XAML data template in the view model using an XmlWriter and expose it as a property to bind to.
Edit: Bindings
You have your list of view models. Create and expose this XamlTemplate property in each view model (in a base view model class). The property should create Xaml along the lines of:
<DataTemplate xmlns:vw="...">
<vw:MessageLogView/>
</DataTemplate>
Then use a ContentControl to bind to:
<ContentControl Content="{Binding ViewModel}"
ContentTemplate="{Binding ViewModel.XamlTemplate}" />
I've created a simple WPF application which has two Windows. The user fills in some information on the first Window and then clicks Ok which will take them to the second Window. This is working fine but I'm trying to incorporate both Windows into a single Window so just the content changes.
I managed to find this Resource management when changing window content which seems like it is what I'm after. However, I've search for ContentPresenter but couldn't find much help for how I need to use it. For example, if I use a ContentPresenter, where do I put the existing XAML elements that are in the two Windows? I'm guessing the first Window will go into the ContentPresenter but the second one will need to be put somewhere for when it needs to be switched in.
Any help would be great. A simple working example would be even better.
TIA
A ContentPresenter is normally used when restyling existing controls. It is the place where the Content of a control is placed. Instead you should use a ContentControl, which is simply a control that has a content element. Alternatively, you could directly set the Content of your window.
You extract the contents of your two existing windows into two UserControls. Then you create a new Window which will host the contents. Depending on your business logic, you set the content of that window (or that window's ContentControl if you want additional "master" content) to either of those two UserControls.
EDIT:
As a starting point. This is not complete working code, just to get you started. Note that this is bad architecture; you should probably use a MVVM or similar approach once you get this running!
<Window>
<ContentControl Name="ContentHolder" />
</Window>
<UserControl x:Class="MyFirstUserControl" /> <!-- Originally the first window -->
<UserControl x:Class="MySecondUserControl" /> <!-- Originally the second window -->
In code behind of Window:
// Somewhere, ex. in constructor
this.ContentHolder.Content = new MyFirstUserControl;
// Somewhere else, ex. in reaction to user interaction
this.ContentHolder.Content = new MySecondUserControl;
I use ContentPresenter for snapping in content. In the window, I put something like this:
<ContentPresenter Content="{Binding MainContent}" />
In the view model, I have a property called MainContent of type object:
public object MainContent { get { return (object)GetValue(MainContentProperty); } set { SetValue(MainContentProperty, value); } }
public static readonly DependencyProperty MainContentProperty = DependencyProperty.Register("MainContent", typeof(object), typeof(SomeViewModel), new FrameworkPropertyMetadata(null));
Whatever you set MainContent to will show up in the window.
To keep the separation between view and view model, I typically set the MainContent property to another view model and use a data template to map that view model to a view:
<DataTemplate DataType="{x:Type viewmodels:PlanViewModel}">
<views:PlanView />
</DataTemplate>
I put that data template in some central resource dictionary along with a bunch of other view-model-to-view mappers.