Develop Reference

TreeView subcollection autosort when properties changes

I would like to sort the second level of my TreeView. The sorting depends on two different conditions depending on the FieldType and the Order properties. In my case it is possible that the order increases or decreases by the user. The user uses arrow up and down buttons. How can I keep the list sortet if an item is added or removed and the user changes the Order property?
My current TreeView:
<TreeView Grid.Row="0" x:Name="tvImages" ItemsSource="{Binding SelectedTemplate.Images}">
<TreeView.Resources>
<HierarchicalDataTemplate DataType="{x:Type entities:TemplateImageDTO}" ItemsSource="{Binding FieldSections}">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Order, StringFormat=Image {0}}" Margin="0,3,0,0"/>
</StackPanel>
</HierarchicalDataTemplate>
<HierarchicalDataTemplate DataType="{x:Type entities:FieldSectionDTO}">
<DockPanel LastChildFill="False" HorizontalAlignment="Stretch" Width="Auto">
<StackPanel DockPanel.Dock="Left" Orientation="Horizontal">
<TextBlock Text="{Binding FieldType, Converter={StaticResource enumConverter}}" Margin="0,3,0,0" />
<TextBlock Text=" - Field " Margin="0,3,0,0" />
<TextBlock Text="{Binding Order, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" Margin="0,3,0,0" />
</StackPanel>
<StackPanel Orientation="Horizontal" DockPanel.Dock="Right" Margin="0,0,10,0">
<Button Width="24" Height="24" Style="{DynamicResource MahApps.Metro.Styles.MetroCircleButtonStyle}">
<iconPacks:PackIconFontAwesome Kind="AngleUpSolid" Foreground="{DynamicResource AccentColorBrush}" />
</Button>
<Button Width="24" Height="24" Margin="10,0,0,0" Style="{DynamicResource MahApps.Metro.Styles.MetroCircleButtonStyle}">
<iconPacks:PackIconFontAwesome Kind="AngleDownSolid" Foreground="{DynamicResource AccentColorBrush}" />
</Button>
</StackPanel>
</DockPanel>
</HierarchicalDataTemplate>
</TreeView.Resources>
</TreeView>

I found my Solution here: https://stackoverflow.com/a/19363888/6751312
After the user clicked the arrow up and down button, I increase and decrease the order property and resort the list.

Significant performance drop when instantiating specific usercontrols

I am developing a WPF app from 2 locations, one has a beefy PC on windows 10, the other has a much older PC with worse hardware, running Windows 7.
on the windows 10 PC, I never notice a problem, this is only reproducible on windows 7 machine.
In my Window, I have a ContentControl which is bound to a UserControl property in the window's viewmodel.
I can show different usercontrols there, and most behave fine. I have 2 however, which when I attempt to load them, they take literally 3-5 seconds, during which the UI thread hangs.
They don't have much going on in xaml, I have more complex stuff in xaml in other controls so I don't think the problem lies there.
The one thing these 2 controls are doing differently, which other controls which don't have this issue aren't doing is in the constructor for the usercontrol in the .xaml.cs file, they set their datacontext.
InitializeComponent();
DataContext = new CreateGroupPanelViewModel();
The contructor for the viewmodel, just sets some properties to values. Mainly some string to string.Empty, instantiates 2 ObservableCollections, sets a bool to true and sets a string to "Create Game".
The first time I open this control, I have the problem but the second time it poses no delay at all. Also, if I run the program for a minute or so and THEN try to open it for the first time it will also be fine.
I cannot understand why instantiating this usercontrol would create such a massive performance hit, or why it would act so differently on the 2 different machines.
EDIT
The slowdown occurs within the InitializeComponent(); of the usercontrol.
Here is the XAML of such a control:
<UserControl x:Class="CasinoDB.UserControls.ModifyPanels.UCModifyGamePanel"
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:CasinoDB.UserControls.ModifyPanels"
xmlns:vm="clr-namespace:CasinoDB.ViewModels"
mc:Ignorable="d"
d:DesignHeight="500" d:DesignWidth="300">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition />
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Text="{Binding Header}" HorizontalAlignment="Center" Margin="5" FontWeight="Bold" FontSize="20" />
<StackPanel Grid.Row="1" HorizontalAlignment="Center">
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="5">
<TextBlock Text="Name:" Margin="5" />
<TextBox Text="{Binding Name, UpdateSourceTrigger=PropertyChanged}" Margin="5" MinWidth="150" />
</StackPanel>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="5">
<TextBlock Text="RTP:" Margin="5" />
<TextBox Text="{Binding RTP, UpdateSourceTrigger=PropertyChanged}" Margin="5" MinWidth="50" />
</StackPanel>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="5">
<TextBlock Text="Variance:" Margin="5" />
<TextBox Text="{Binding Variance, UpdateSourceTrigger=PropertyChanged}" Margin="5" MinWidth="150" />
</StackPanel>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="5">
<TextBlock Text="Lines:" Margin="5" />
<TextBox Text="{Binding Lines, UpdateSourceTrigger=PropertyChanged}" Margin="5" MinWidth="100" />
</StackPanel>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="5">
<TextBlock Text="Min Bet:" Margin="5" />
<TextBox Text="{Binding MinBet, UpdateSourceTrigger=PropertyChanged}" Margin="5" MinWidth="50" />
</StackPanel>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="5">
<TextBlock Text="Max Win:" Margin="5" />
<TextBox Text="{Binding MaxWin, UpdateSourceTrigger=PropertyChanged}" Margin="5" MinWidth="75" />
</StackPanel>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="5">
<TextBlock Text="Vendor:" Margin="5" />
<TextBox Text="{Binding Vendor, UpdateSourceTrigger=PropertyChanged}" Margin="5" MinWidth="150" />
</StackPanel>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="5">
<TextBlock Text="Notes:" Margin="5" />
<TextBox Text="{Binding Notes}" Margin="5" Width="250" TextWrapping="Wrap" AcceptsReturn="True" AcceptsTab="True" SpellCheck.IsEnabled="True" Height="75" VerticalScrollBarVisibility="Auto" ScrollViewer.CanContentScroll="True" />
</StackPanel>
<CheckBox Content="Create Another" IsChecked="{Binding CreateAnother}" Margin="5" Visibility="{Binding ShowCreateAnother, Converter={StaticResource BooleanToVisibilityConverter}}" HorizontalAlignment="Center" HorizontalContentAlignment="Center" />
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" Margin="5">
<Button Content="SAVE" Command="{Binding Save}" Margin="5" Style="{StaticResource ConfirmButton}" />
<Button Content="CLOSE" Command="{Binding Close}" Margin="5" />
</StackPanel>
</StackPanel>
</Grid>
</UserControl>

OK, so after attempting to isolate the issue, I finally found my problem. It lies in SpellCheck.IsEnabled="True" on TextBoxes. I found this by commenting out large sections, testing performance, then uncommenting small amounts until it was acting slow on the machine it acts slow on.
After figuring this was the cause, I found a similar post on SO with information relating to a registry entry being filled up with dictionairies. I don't appear to have an entry in that location in the registry, so maybe my problem was similar, but that it was looking and couldn't find anything at all.
Anyway, I can live without spellcheck in those fields, I'll just remove it.

MVVM ItemTemplate with custom control

I'm following this tutorial on how to use a ListView ItemTemplate to display a list of person : http://www.wpf-tutorial.com/listview-control/listview-data-binding-item-template/
I understood the general concept but I am stuck on one point.
Here is the ItemTemplate sample :
<Grid>
<ListView Margin="10" Name="lvDataBinding" ItemsSource"={Binding MyPersonsList}">
<ListView.ItemTemplate>
<DataTemplate>
<WrapPanel>
<TextBlock Text="Name: " />
<TextBlock Text="{Binding Name}" FontWeight="Bold" />
<TextBlock Text=", " />
<TextBlock Text="Age: " />
<TextBlock Text="{Binding Age}" FontWeight="Bold" />
<TextBlock Text=" (" />
<TextBlock Text="{Binding Mail}" TextDecorations="Underline" Foreground="Blue" Cursor="Hand" />
<TextBlock Text=")" />
</WrapPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
What I cannot understand, is how to replace the TextBlocks with a custom control like this :
<Grid>
<ListView Margin="10" Name="lvDataBinding" ItemsSource"={Binding MyPersonsList}">
<ListView.ItemTemplate>
<DataTemplate>
<WrapPanel>
<MyPersonDisplayer Person="{Binding ???}"/>
</WrapPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
How to tell the template I want to set the MyPersonDisplayer control property Person with the source item ?
EDIT :
I tried to add only Person={Binding}, but it displays me this error.

I think it might have problem about the implementation MenuItemViewModel property in MenuItemView class. Do you have implement the MenuItemViewModel property as DependencyProperty? Maybe you can refer this post.

New line in ListBox with bound data

I'm putting data to ListBox from a list of objects using this simple code:
<ListBox Name="lbxListaZadan">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel xml:space="preserve" Orientation="Horizontal">
<TextBlock Text="{Binding title}" />
<TextBlock Text="
" />
<TextBlock Text="Priorytet: " />
<TextBlock Text="{Binding priority}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Instead of expected output:
Task1
Priorytet: 1
Task2
Priorytet:2
Task3
Priorytet: 3
I'm getting:
Task1Priorytet: 1
Task2Priorytet: 2
Task3Priorytet: 3
Why is the newline in a place I would not expect it to be, and how the hell can I reach the expected output in listbox.

<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock Text="{Binding title}" />
<StackPanel Orientation="Horizontal">
<TextBlock Text="Priorytet: " />
<TextBlock Text="{Binding priority}" />
</StackPanel>
</StackPanel>
</DataTemplate>
A newline character can only work inside a single TextBlock, not between two of them.

You can put 2 TextBlocks in vertical StackPanel
<StackPanel>
<TextBlock Text="{Binding title}" />
<TextBlock Text="{Binding priority, StringFormat='Priorytet: {0}'}" />
</StackPanel>
also instead of 2 TextBlocks for priority you can use one with StringFormat

The Environment.NewLine would only have the expected effect, if the texts are in the same TextBlock.
WPF then renders the Text property of the TextBlock with the new line in mind, which causes a line break.
To achieve the wanted behavior, you'd have add a vertical layout element:
<ListBox Name="lbxListaZadan">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel xml:space="preserve" Orientation="Vertical">
<TextBlock Text="{Binding title}" />
<StackPanel Orientation="horizontal">
<TextBlock Text="Priorytet: " />
<TextBlock Text="{Binding priority}" />
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

XAML Get data from binded elements

I have this XAML code:
<ListView Name="ListBoxWithNews" ItemsSource="{Binding News}" Grid.Row="1" Grid.Column="1" Grid.RowSpan="2" Grid.ColumnSpan="2">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="{Binding imageURL}" Width="75" Height="75" />
<StackPanel>
<TextBox Text="{Binding Title}" Width="200" />
<TextBox Text="{Binding Body}" Width="200" />
</StackPanel>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
The controls are binded using the MVVM pattern. The user can change the content of the two text boxes. Is there a possible way to get the updated text from these text boxes at some point when I need them?

Your ViewModel should implement INotifyPropertyChanged and Use TwoWay Binding as below
<ListView Name="ListBoxWithNews" ItemsSource="{Binding News,Mode=TwoWay}" Grid.Row="1" Grid.Column="1" Grid.RowSpan="2" Grid.ColumnSpan="2">
<ListView.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="{Binding imageURL,Mode=TwoWay}" Width="75" Height="75" />
<StackPanel>
<TextBox Text="{Binding Title,Mode=TwoWay}" Width="200" />
<TextBox Text="{Binding Body,Mode=TwoWay}" Width="200" />
</StackPanel>
</StackPanel>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>