Develop Reference

Merge xaml files using resource dictionaries

The information on merging two XAML files is kind of confusing, could someone point me in the right direction? (W10, VS2017, UAP, Midi)
I have app.xaml, MainPage.xaml, and A.xaml. I also have an xaml resource dictionary. I want to insert A.xaml into MainPage.xaml.
(A is actually called MidiWrapper.xaml)
app.xaml
<Application
x:Class="Kawai_ES110_Midi.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
</Application>
Following How can i combine multiple XAML files using C# in WPF? I get access violation when I put first solution into app.xaml
MainPage.xaml
<Page
x:Class="Kawai_ES110_Midi.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Kawai_ES110_Midi"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid>
<Grid.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="XAMLWrapper.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Grid.Resources>
</Grid>
</Page>
A.xaml (aka MidiWrapper.xaml)
<ResourceDictionary
x:Class="Kawai_ES110_Midi.MidiWrapper"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Kawai_ES110_Midi"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<ListBox x:Name="midiInPortListBox"/>
<ListBox x:Name="midiOutPortListBox"/>
</ResourceDictionary>
Resource Dictionary xaml aka (XAMLWrapper.xaml)
<Application
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
</Application>
Thanks for your help in advance. Maybe app.xaml needs reference the resource dictionary and/or put "merged" tags into MainPage and A. Or perhaps MainPage and A have to also be/act like dictionaries?
I've updated my code, but I don't see the listboxes showing up still

I'm not sure that what you are trying to do is possible using a resource dictionary. A resource dictionary is exactly that, a list of things that are resources for your XAML so you might define styles in there or templates, etc. These are then referenced by your XAML that uses the resource. I've never tried to define elements in one but I don't think you can initialise a grid with it (which is what I think you are trying to do?).
Edit:
Re-reading your original post in combination with the comment i don't think you want resource dictionaries for this at all. What you want is a separate user control. You can find information on this here but as a short example i created a WPF project and added 2 user controls, 1 that contains a list and one that contains a button.
Mainwindow.xaml
<Window x:Class="test.MainWindow"
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:test"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<local:ListUserControl Grid.Column="0" Grid.Row="0"/>
<local:ButtonUserControl Grid.Column="0" Grid.Row="1"/>
</Grid>
</Window>
ListUserControl.xaml
<UserControl x:Class="test.ListUserControl"
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:local="clr-namespace:test"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800" Background="White">
<StackPanel>
<ListBox>
<ListBoxItem>ListBox Item #1</ListBoxItem>
<ListBoxItem>ListBox Item #2</ListBoxItem>
<ListBoxItem>ListBox Item #3</ListBoxItem>
</ListBox>
</StackPanel>
</UserControl>
ButtonUserControl.xaml
<UserControl x:Class="test.ButtonUserControl"
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:local="clr-namespace:test"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800" Background="DarkRed">
<Grid>
<Button x:Name="button" Content="Button" HorizontalAlignment="Left" Margin="10,10,10,10" VerticalAlignment="Top" Width="75"/>
</Grid>
</UserControl>
This achieves the separation between the elements that i think you are trying to achieve. So this should allow you to compose a view of several user controls where each control is a collection of controls (potentially other user controls but this can get messy). This could also be achieved using data templates as described here where you can see the content is being changed based on which template is applicable. You could define the templates in your resource dictionary and reference them that way. I think this could also be worth referencing as whilst not directly related to your question it outlines the various ways you can segment content within your application and has some relevant discussion.

DataGrid TSV file with dynamic columns

I am trying to create a DataGrid in WPF, in order to make an editor for some tab separated files. The first line of the TSV contains the columns. Also after some research, I found this code
Import data from text file and display in datagrid
which works pretty good, but, when the file is loaded the window becomes unresponsive. Or when I try to resize the window (or scroll down) again the same, it takes time to load it
This is from MainWindow.xaml
<DataGrid x:Name="dtGrid" Grid.Row="1" AutoGenerateColumns="True" ItemsSource="{Binding}"/>
Mainwindow.cs
dtGrid.DataContext = Helper.DataTableFromTextFile("tsv.txt", '\t');
PS. I also tried this too.
dtGrid.ItemsSource = Helper.DataTableFromTextFile("tsv.txt", '\t').DefaultView;
Any ideas?
EDIT:
<Window x:Class="MyFileEdit.MainWindow"
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:MyFileEdit"
mc:Ignorable="d"
Title="File Edit" Height="350" Width="525" Loaded="Window_Loaded">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="16*" MinHeight="16" MaxHeight="16"/>
<RowDefinition Height="303*"/>
</Grid.RowDefinitions>
<DataGrid x:Name="dtGrid" Grid.Row="1" AutoGenerateColumns="True" ItemsSource="{Binding}"/>
</Grid>
</Window>

Get XAML code in WPF

How can I get XAML code of a window as a string, change this string, and upload this string as a xaml-code of window?
For example, I have
<Window x:Class="WpfApplication1.MainWindow"
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:WpfApplication1"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Grid>
<ComboBox Margin="0,0,9,38" Name="button1" Height="82" HorizontalAlignment="Right" VerticalAlignment="Bottom" Width="132"></ComboBox>
</Grid>
</Window>
and I want to have this xaml code in the end
<Window x:Class="WpfApplication1.MainWindow"
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:WpfApplication1"
mc:Ignorable="d"
Title="MainWindow" Height="350" Width="525">
<Grid>
<ComboBox Margin="0,0,9,38" Name="button1" Height="82" HorizontalAlignment="Right" VerticalAlignment="Bottom" Width="132">
<ComboBox.ItemTemplate>
<DataTemplate>
<local:d_dddw_imp_insurance_list />
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
</Grid>
</Window>

If your using wpf/xaml with c#, visual studio generally compile the xaml code to c#, to be as performant as possible. If you want to have some dynamic XAML, you need to use XamlReader to read xaml and display at "on your own".
Just take a look at: Loading XAML XML through runtime
Than you can change or manipulate the xaml and display the result very easily.

How to access this user control in Main Window

I have one user control in my WPF app
<UserControl x:Class="NewWPFApp.ProgressControl"
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>
<Expander Header="{Binding Path=Headerval}">
<StackPanel Margin="10,4,0,0">
<DataGrid
x:Name="dataGrid"
AutoGenerateColumns="False"
ItemsSource="{Binding Path=records}"/>
</StackPanel>
</Expander>
</Grid>
and in my Mainwindow when I am doing this
<Window xmlns:NewWPFApp="clr-namespace:NewWPFApp" x:Class="NewWPFApp.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<ListBox x:Name="peopleListBox" >
<ListBox.ItemTemplate>
<DataTemplate>
<Grid Background="AliceBlue">
<NewWPFApp:ProgressControl Height="100" Width="100"/>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
I cant see the output.
If I remove it from the Data template then it works.But not inside the data template.
What am I missing ???
Thanks

ListBox.ItemTemplate specifies how items added to a list box will be displayed. In your case, you uses your own custom control. However, at the same time you added no items to the list box so there is nothing to display. To populate the list box you can use binding e.g.:
<ListBox ItemsSource="{Binding ItemsToBeDisplayed}" x:Name="peopleListBox" >
...
</ListBox>
Where ItemsToBeDisplayed is a property of a view model (if you use MVVM pattern) that returns a collection of objects. If not you can populate ItemsSource without using binding:
var list = new List<People>();
//Add objects to a list
peopleListBox.ItemsSource = list;
I assumed that you have People class that models people you want to display in your application. People class should have Headerval and records properties because you use them in your your ProgressControl control. If you do as described, a new instance of your ProgressControl control will be created for every object in ItemsSource.

Showing a control based on type of databound viewmodel?

I'm learning WPF at the moment. I'm finding xaml quite tough to use. I have MainWindow.xaml defined like this:
<Window x:Class="Compliance.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<ResourceDictionary Source="MainWindow.Resources.xaml"></ResourceDictionary>
</Window.Resources>
<Grid>
</Grid>
</Window>
And MainWindow.Resources.xaml like this:
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:vm="clr-namespace:Compliance.ViewModel"
xmlns:vw="clr-namespace:Compliance.View">
<DataTemplate DataType="{x:Type vm:Entities.AbstractEntityViewModel}">
<vw:AbstractEntityView></vw:AbstractEntityView>
</DataTemplate>
</ResourceDictionary>
AbstractEntityView is like this:
<UserControl x:Class="Compliance.View.AbstractEntityView"
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="ID:"></Label>
<TextBlock Text="{Binding Path=EntityId}"></TextBlock>
</StackPanel>
</UserControl>
Then in App.xaml.cs I am overriding OnStartup like this:
MainWindow window = new MainWindow();
//Model class
Individual ind = new Individual(1,"Name");
//subclass of AbstractEntityViewModel
var vm = new Entities.IndividualEntityViewModel(ind);
window.DataContext = vm;
window.Show();
However, nothing appears in the window.
I used the answer from this question to get my control to render. However, this requires you to refer to elements in the view from the code, which I don't want to do.
Is it possible to get a window to pick a View to render based on the ViewModel set as its datacontext? Or do I have the wrong idea about how MVVM is supposed to work?

You have the right idea, but you're not actually telling WPF to display your ViewModel anywhere
I usually host a ViewModel in a ContentControl object if I am binding to a single ViewModel
<Window x:Class="Compliance.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<ResourceDictionary Source="MainWindow.Resources.xaml"></ResourceDictionary>
</Window.Resources>
<Grid>
<ContentControl Content="{Binding }" />
</Grid>
</Window>
The ContentControl is usually not needed for lists of Models or ViewModels, since the object is automatically inserted as the Content property of the ContentPresenter of each item. For example, no ContentControl is needed when binding a ListBox to a collection of ViewModels
<ListBox ItemsSource="{Binding MyCollectionOfViewModel}" />