How to bind my UserControl to an AvalonDock - c#

please I am getting out of my mind trying to understand something, I really need some direction, because I am lost.
I have a UserControl I created called TerminalControl which have a view which wraps a TextBox bounded to a Text property in the view model, which is updated in real time through RS232 connected to an embedded system.
So the flow is data arrives to RS232 (updates) ==> VM.Text ==> (data binding) ==> TerminalView.TextBox.Text
All I want is to add this user control to an AvalonDock 2.0 through data binding.
I created a data template in the window holding the Docking Manager
<avalonDock:DockingManager x:Name="dockManager"
DocumentsSource="{Binding ???}"
Grid.Row="1">
<avalonDock:DockingManager.LayoutItemTemplateSelector>
<vm:PanesTemaplateSelector>
<vm:PanesTemaplateSelector.SessiomDataTemplate >
<DataTemplate>
<Terminal:TerminalEditorView/>
</DataTemplate>
</vm:PanesTemaplateSelector.SessiomDataTemplate>
</vm:PanesTemaplateSelector>
</avalonDock:DockingManager.LayoutItemTemplateSelector>
and created the documents inside the docking
<avalonDock:LayoutRoot>
<avalonDock:LayoutPanel Orientation="Vertical">
<avalonDock:LayoutDocumentPane/>
<avalonDock:LayoutAnchorablePane Name="ToolsPane" DockHeight="150">
</avalonDock:LayoutAnchorablePane>
</avalonDock:LayoutPanel>
</avalonDock:LayoutRoot>
</avalonDock:DockingManager>
I have a modul that creates a TerminalControl and returns the viewModel to the MainWin view model.
My problem is that I dont know to what I should bind the DocumentSource of the AvalonDock, as you can see above.
What am I doing wrong?
Is there something wrong in my architecture?
Guys, any help will be highly appriciated because I am running out of ideas.
Thanks

Ok, since there is no answer to my questiuon, here is the solution I am going on:
My UserControl (Terminal) will implement an interface IUIWindow.
This interface will be held by the main view model in an observebale collection, which will dynamically will add or remove IUIWindow elements.
and the the Avalon dock which resides in the main view will bind to that collection in its DocumentSource.
In the binding I will hold a converter which will convert from the interface to the type the Document expect.
This is the best solution I could find, if anyone has any opinions/remarks/suggestions I will be glad to hear.

Related

WPF Dynamic view of a dialog - contentpresenter cannot rendered

Based on this mechanism, I created a dialog window of which I can dynamically assign the content by a <ContentPresenter Content="{Binding .}">
The content I want to assign is an user control with a corresponding ViewModel. This works as I can render the DialogView in other usercontrols
<DataTemplate DataType="{x:Type ViewModels:DialogViewModel}">
<Views:DialogView/>
</DataTemplate>
)
However, in the DialogWindow, DialogView cannot be rendered but instead, only the string representation of DialogViewModel is visible. What might be the reason why I cannot render the view of contentpresenter's content?
Any help is much appreciated!
Thanks in advance
Where did you define the Data Template? It sounds like you are creating them as Window resources, and did not include it in your DialogWindow. If you're defining them as Window resources, the Data Template definition needs to be included on every Window you want to render this way. If the ViewModel/View pair is global to the application, it is easier to just define it in the App.xaml where it will be picked up by any Window or UserControl throughout the application.

How to Create a View within a View WPF

I explain my issue as I'm quite new to UI design :
I have a main View which displays a TreeView on its left part. When an element is selected I'd like to show a description of the Item on the right on the same window. The design of this description depends on the nature of the Item.
So I created a View per Item Type corresponding to the different possible design.
Now When I click on the TreeView I have no idea how to show the corresponding view on the right of the same window. (I'm not asking about catching the event, just displaying a view within another view, like if I dynamically plotted a control).
Is it possible ? If not what kind of approach would you suggest ?
Many Thanks.
This seems like a great candidate for a Data Template.
Basically, create a content presenter and bind its content property to the TreeView's SelectedItem property. Now, create data templates for each of your types (using the DataType property) in the ContentTemplate property.
Now, the correct data template will be chosen with the correct data whenever you select something in your tree view.
As far as a separate dispatcher goes, I'm not sure, but I'm also not sure what scenario would require one.
More information can be found in this SO question.
Sample:
<ContentPresenter Content="{Binding Path=SelectedItem, ElementName=TreeView}">
<ContentPresenter.ContentTemplate>
<DataTemplate DataType="{x:Type Type1}">
<!-- Bunch of stuff-->
</DataTemplate>
<DataTemplate DataType="{x:Type Type2}">
<!-- Bunch of stuff-->
</DataTemplate>
</ContentPresenter.ContentTemplate>
</ContentPresenter>

WPF MVVM storing user controls in the ViewModel? A big no-no?

I am trying to host a user control inside my main window but I'm having a hard time deciding how to implement it into my view model.
First, I created a separate view model for the user control and used a data template to map it to the control before hosting it inside a ContentControl:
Data template:
<DataTemplate DataType="{x:Type viewModels:TaskbarIconViewModel}">
<tb:TaskbarIcon/>
</DataTemplate>
XAML:
<ContentControl Content="{Binding TaskbarIconViewModel}"/>
If I were to use this setup, how would I call methods on the user control and how would I set the properties of the user control, either in XAML or the view model?
Secondly, I had the idea to hold the user control in the view model and then bind it to a ContentControl once again. this seems wrong to me and against MVVM. Is this right? Is it acceptable to hold controls inside of a view model?
In the view model:
public TaskbarIcon TaskbarIcon { get; set; }
XAML:
<ContentControl Content="{Binding TaskbarIcon}"/>
What's the best course of action here?
Storing UserControl(s) in the ViewModel: a big no-no? YES
The ViewModel shouldn't be aware of the view.
What you're talking about is what PRISM's regions do, don't reinvent the wheel ;)

Changing Main Viewing Area

I'm wondering how to go about creating different views in the main window when a button is pressed. I'm not sure of the correct terminology, so that has hampered my google fu.
I'm thinking that the main viewing area would be a content control, that I could change when a event happens. I made a small drawing to help illustrate my idea / thought.
Any input will be appreciated. Thanks!
It would be really easy to implement this senario using MVVM approach....
Make a ViewModel for you MainView. Then Define Properties of the ViewModels of your UserControls
For Example You have Two UserControl as FirstView and SecondView then make a properties in your viewmodels as ViewToLoadProperty of the type ViewModel (usually called as ViewModelBase)
Set bindings as
<!-- Panel For Hosting UserControls -->
<Border Grid.Column="2">
<ContentControl Name="userControlContentControl"
Content="{Binding Path=ViewToLoadProperty,
}">
<ContentControl.Resources>
<DataTemplate DataType="{x:Type ViewModelLayer:FirstViewModel}">
<ViewLayer:FirstView/>
</DataTemplate>
<DataTemplate DataType="{x:Type ViewModelLayer:SecondViewModel}">
<ViewLayer:SecondView />
</DataTemplate>
</ContentControl.Resources>
</ContentControl>
</Border>
<!-- Panel For Hosting UserControls -->
Then when you click the button Use a command to set the respective ViewModel Intance to this(ViewToLoadProperty) property...(Use RelayCommannds or something like it)
DataTempates would do the rest of the job by selecting the right View according to the right type of ViewModel
YOu can use MVVMLight toolkit if you are implementing MVVM Pattern.. :)
On the right you could have a frame. Then the button would bind a different page or user control to the content of that frame.

WPF Custom Control - ItemsControl template not being applied

I'm building a custom WPF control that derives from TabControl. In the ControlTemplate, I'm using a ItemsControl to display a list that is being bound from the template (an observable collection of type FileMenuItem). During program execution, I'm getting the following error in the output window:
ItemTemplate and ItemTemplateSelector
are ignored for items already of the
ItemsControl's container type;
Type='FileMenuItem'
The type FileMenuItem is derived from MenuItem. If I change the base class to DependencyObject, the code actually runs and the template is applied (so that's an option). I googled the error and couldn't find anything about it, has anyone run into this while developing custom controls? Even though I have a workaround, I'd like to understand what's happening, and I think using the MenuItem as a base class is a cleaner implementation.
I can post more code if it would help. Thanks!
The purpose of a DataTemplate (like ItemTemplate) is to provide a visualization for a data object. Specifically, it defines a set of elements to add to the visual tree in place of the data given to an ContentPresenter or ItemsPresenter. In your case your source list is a collection of objects that are already able to be added directly to the visual tree for display in the UI.
You can see this in the following simplified example where only "Three" shows up in Red because the first two items are defined in a form that can be displayed directly by ComboBox.
<ComboBox>
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" Foreground="Red"/>
</DataTemplate>
</ComboBox.ItemTemplate>
<ComboBoxItem>One</ComboBoxItem>
<ComboBoxItem>Two</ComboBoxItem>
<sys:String>Three</sys:String>
</ComboBox>

Categories

Resources