Expander scrolling problems - wpf

I have a an Expander inside a Stackpanel, inside a ScrollViewer.
Now when I move my mouse over the expanded expander, the scrolling of the scrollviewer doesnt work anymore.
Can someone help me understand why?
<ScrollViewer VerticalScrollBarVisibility="Auto" Name="Scroller">
<StackPanel Name="Panel1">
<Expander Header="{Binding Source={x:Static properties:Strings.GeneralSettings}}" IsExpanded="True">
<StackPanel>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
<RowDefinition />
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<TextBox Grid.Column="0" Grid.Row="0" Text="{Binding ProjectDataService.CurrentProject.ProjectName,Mode=TwoWay}" material:TextFieldAssist.Hint="Projektname" Margin="10" />
<TextBox Grid.Column="1" Grid.Row="0" Text="{Binding ProjectDataService.CurrentProject.ProjectLead,Mode=TwoWay}" material:TextFieldAssist.Hint="Projektleitung" Margin="10" />
<TextBox Grid.Column="0" Grid.Row="1" Text="{Binding ProjectDataService.CurrentProject.City,Mode=TwoWay}" material:TextFieldAssist.Hint="Ort" Margin="10" />
<TextBox Grid.Column="1" Grid.Row="1" Text="{Binding ProjectDataService.CurrentProject.ZipCode,Mode=TwoWay}" material:TextFieldAssist.Hint="Postleitzahl" Margin="10" />
<TextBox Grid.Column="0" Grid.Row="2" Text="{Binding ProjectDataService.CurrentProject.Street,Mode=TwoWay}" material:TextFieldAssist.Hint="Strasse" Margin="10" />
<TextBox Grid.Column="1" Grid.Row="2" Text="{Binding ProjectDataService.CurrentProject.HouseNumber,Mode=TwoWay}" material:TextFieldAssist.Hint="Hausnummer" Margin="10" />
<TextBox Grid.Column="0" Grid.Row="3" Text="{Binding ProjectDataService.CurrentProject.ContactName,Mode=TwoWay}" material:TextFieldAssist.Hint="Ansprechpartner vor Ort" Margin="10" />
<TextBox Grid.Column="1" Grid.Row="3" Text="{Binding ProjectDataService.CurrentProject.ContactEmail,Mode=TwoWay}" material:TextFieldAssist.Hint="Kontaktemail" Margin="10" />
<ComboBox Grid.Column="0" Grid.Row="4" Margin="10" SelectedItem="{Binding ProjectDataService.CurrentProject.ProjectStatus,Mode=TwoWay}" material:TextFieldAssist.Hint="Projektstand">
<ComboBoxItem Content="Abgenommen" />
<ComboBoxItem Content="Eingebaut" />
</ComboBox>
</Grid>
</StackPanel>
</Expander>
</StackPanel>
</ScrollViewer>
I found out, that it is the MaterialDesign Framework, which breaks the scrolling. To enable the framework I need to put
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Light.xaml" />
<ResourceDictionary Source="pack://application:,,,/MaterialDesignThemes.Wpf;component/Themes/MaterialDesignTheme.Defaults.xaml" />
<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Primary/MaterialDesignColor.Indigo.xaml" />
<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Accent/MaterialDesignColor.Indigo.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
into the application.ressources.
the second line breaks the scrolling

I had the same issue. It is a bug in the material design nuget: https://github.com/MaterialDesignInXAML/MaterialDesignInXamlToolkit/issues/1395
it is fixed in the current preview for materialdesignthemes 3.0. Check "include prerelease" in nuget manager to be able to select the preview versions for this nuget package.

Related

XAML DataTemplate with parameter

I have a data template that is:
<DataTemplate x:Key="CalDescButton">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock
Grid.Row="0"
Grid.RowSpan="2"
Grid.Column="0"
Grid.ColumnSpan="2"
Style="{StaticResource LargeIconStyle}"
Text="" />
<TextBlock
Grid.Row="0"
Grid.Column="1"
Foreground="Transparent"
Style="{StaticResource MediumIconStyle}"
Text="" />
<TextBlock
Grid.Row="1"
Grid.Column="1"
Foreground="Transparent"
Style="{StaticResource MediumIconStyle}"
Text="" />
<TextBlock
Grid.Row="0"
Grid.Column="1"
Foreground="Transparent"
Style="{StaticResource MediumIconStyle}"
Text="" />
<TextBlock
Grid.Row="1"
Grid.Column="0"
Foreground="Transparent"
Style="{StaticResource MediumIconStyle}"
Text="" />
<TextBlock
Grid.Row="1"
Grid.RowSpan="2"
Grid.Column="0"
Margin="0,-6,0,0"
Foreground="Aqua"
Style="{StaticResource XSmallIconStyle}"
Text="" />
</Grid>
</DataTemplate>
Then I have other 6 where the only thing that changes is the Text Char code.
Those templates are applied to buttons:
<ToggleButton
Command="{Binding CmdSetSorting, Mode=OneWay}"
CommandParameter="CalAsc"
ContentTemplate="{StaticResource CalDescButton}" />
The question is: can I pass a variable to the template and use it in the Text="" instead of having 6 different templates just for that?
How can I do it?
Just to be clear I'd like to have something like:
<DataTemplate x:Key="IconButton">
and then:
ContentTemplate="{StaticResource IconButton ()}" />
set Content property of Button:
<ToggleButton
Command="{Binding CmdSetSorting, Mode=OneWay}"
CommandParameter="CalAsc"
Content=""
ContentTemplate="{StaticResource CalDescButton}" />
it should become DataContext of root element in DataTemplate (because it is ContentTemplate) and will be accessible by Binding:
<TextBlock
Grid.Row="0"
Grid.RowSpan="2"
Grid.Column="0"
Grid.ColumnSpan="2"
Style="{StaticResource LargeIconStyle}"
Text="{Binding}" />

Multiple TabItems bound to same ViewModel are not updating the first time a tab is selected

I have a tabcontrol with 3 tabs on it. Each tabitem contains a different contentcontrol, all of which are bound to the same ViewModel, and there are some items in all 3 contentcontrols that are bound to the same property.
My problem is, if I change a comboBox on the initial tab, that change is not reflected on the other tabs, they still have their SelectedItem set to the default value. This only happens the first time I switch to that tab. After I have selected a tab once, everything works as expected; changes made on one tab are reflected on the other tab.
I am trying to avoid too much code-behind, and I have searched and tried all of the solutions regarding delaying of the binding, or updating the binding when the tab is selected, but I have had no luck.
Here is my TabControl:
<TabControl Grid.Row="1" Margin="0,10">
<TabItem Header="Tab1" IsSelected="True">
<ContentControl Content="{Binding}" ContentTemplate="{StaticResource Tab1}" />
</TabItem>
<TabItem Header="Tab2">
<ContentControl Content="{Binding}" ContentTemplate="{StaticResource Tab2}" />
</TabItem>
<TabItem Header="Tab3">
<ContentControl Content="{Binding}" ContentTemplate="{StaticResource Tab}" />
</TabItem>
</TabControl>
And here is one of the ContentControls:
<DataTemplate x:Key="Tab3" DataType="{x:Type vm:MainViewModel}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
<RowDefinition />
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Label Grid.Column="0" Grid.Row="0" Content="Flow" Style="{StaticResource tabLabel}" />
<TextBox Grid.Column="1" Grid.Row="0" Style="{StaticResource tabTextBox}" />
<ComboBox Grid.Column="2" Grid.Row="0" Style="{StaticResource tabUnitComboBox}" ItemsSource="{Binding DataList1}" DisplayMemberPath="Name" SelectedItem="{Binding SelectedData1}" />
<ComboBox Grid.Column="0" Grid.Row="1" Style="{StaticResource tabComboBox}" ItemsSource="{Binding DataList2}" DisplayMemberPath="Name" SelectedItem="{Binding SelectedData2}" />
<TextBox Grid.Column="1" Grid.Row="1" Style="{StaticResource tabTextBox}" />
<Label Grid.Column="2" Grid.Row="1" Content="m³/h" Style="{StaticResource tabUnitLabel}" Visibility="{Binding SelectedData2, Converter={StaticResource VisibilityConverter}}" />
<ComboBox Grid.Column="0" Grid.Row="2" Style="{StaticResource tabComboBox}" ItemsSource="{Binding DataList3}" SelectedItem="{Binding SelectedData3}" />
<TextBox Grid.Column="1" Grid.Row="2" Style="{StaticResource tabTextBox}" />
<ComboBox Grid.Column="2" Grid.Row="2" Style="{StaticResource tabUnitComboBox}" ItemsSource="{Binding DataList4}" DisplayMemberPath="Name" SelectedItem="{Binding SelectedData4}" />
<Label Grid.Column="0" Grid.Row="3" Content="Temperature" Style="{StaticResource tabLabel}" />
<TextBox Grid.Column="1" Grid.Row="3" Style="{StaticResource tabTextBox}" />
<ComboBox Grid.Column="2" Grid.Row="3" Style="{StaticResource tabUnitComboBox}" ItemsSource="{Binding DataList5}" DisplayMemberPath="Name" SelectedItem="{Binding SelectedData5}" />
</Grid>
</DataTemplate>
The ViewModel is pretty much standard, inheriting from ObservableObject and implementing OnPropertyChanged. As I said, everything works perfectly after selecting a tab once, but I would really like to get it working from the start.
Any suggestions would be greatly appreciated. Thanks.
In case you want to use that comment as and answer
Are you by any chance just starting with assigning the backing field.
Not firing INPC on the initial load.

Listbox resizing automatically, button doesn't

I've got a ListBox with CheckBoxes in it which resizes automatically when I resize the Window.
I found the CheckedListBox XAML code on StackOverflow I think and I didn't modify it, and I'd like the same thing for all the UI elements.
I've read something about setting Anchors. As I already said, I didn't do anything to the XAML code, neither did I set any Anchors?
Is there anything in the XAML code which I'm not seeing which is responsible for the resizing?
<Grid>
<TextBox Height="23" HorizontalAlignment="Left" Margin="12,28,0,0" Name="textBox1" VerticalAlignment="Top" Width="238" />
<Label Content="Profilname" Height="28" HorizontalAlignment="Left" Margin="12,0,0,0" Name="label1" VerticalAlignment="Top" />
<ListBox ItemsSource="{Binding datasource}" Margin="12,57,12,41" Name="checkedListBox1" Opacity="0.7">
<ListBox.ItemTemplate>
<DataTemplate>
<CheckBox Content="{Binding Path=Item}" IsChecked="{Binding IsChecked}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Button Content="save" Margin="12,302,12,12" Name="button3" Click="button3_Click" />
</Grid>
Thanks in advance!
You are doing it like a Canvas, but you are using a Grid.
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Label Content="Profilname" Name="label1" Grid.Row="0" />
<TextBox Name="textBox1" Grid.Row="1" />
<ListBox ItemsSource="{Binding datasource}" Name="checkedListBox1" Grid.Row="2" >
<ListBox.ItemTemplate>
<DataTemplate>
<CheckBox Content="{Binding Path=Item}" IsChecked="{Binding IsChecked}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Button Content="save" Name="button3" Click="button3_Click" Grid.Row="3" />
</Grid>
See now everything resizes.
You can add margin and padding now as desired for styling.

Scrolling ValidationSummary in Silverlight

I am attempting to make ValidationSummary in Silverlight scrollable. It does not work and I am not sure what I am doing wrong.
When wrapped in ScrollViewer, the validationsummary is not shown.
<UserControl x:Class="SilverlightDataValidation.MainPage"
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:ct="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data.Input"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<Grid x:Name="LayoutRoot" Background="White" BindingValidationError="LayoutRoot_BindingValidationError">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="55" />
<ColumnDefinition Width="345" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="25" />
<RowDefinition Height="25" />
<RowDefinition Height="25" />
<RowDefinition Height="25" />
<RowDefinition Height="160" />
<RowDefinition Height="40*" />
</Grid.RowDefinitions>
<ScrollViewer Grid.Row="4" Height="135" HorizontalAlignment="Left" Margin="0,4,0,0" Name="scrollViewer1" VerticalAlignment="Top" MaxHeight="200" Width="333" Grid.Column="1" HorizontalScrollBarVisibility="Auto">
<ct:ValidationSummary Width="300" Grid.Column="1" Margin="0,0,45,0" />
</ScrollViewer>
<TextBox Name="txtName" Text="{Binding Name, Mode=TwoWay, ValidatesOnExceptions =True, NotifyOnValidationError=True, UpdateSourceTrigger=Explicit}"
Grid.Column="1" Grid.Row="1"
Height="23" HorizontalAlignment="Left" VerticalAlignment="Top" Width="185" />
<TextBox Name="txtAge"
Text="{Binding Age, Mode=TwoWay, ValidatesOnExceptions=True, NotifyOnValidationError=True, UpdateSourceTrigger=Explicit}"
Grid.Column="1" Grid.Row="2"
Height="23" HorizontalAlignment="Left" VerticalAlignment="Top" Width="120" />
<Button Content="Save" Grid.Column="1" Grid.Row="3"
Height="23" HorizontalAlignment="Left" Name="butSave" VerticalAlignment="Top" Width="75" Click="butSave_Click" />
<TextBlock Grid.Row="1" Name="textBlock1" Text="Name"
VerticalAlignment="Top" Margin="22,0,0,0" Height="23" HorizontalAlignment="Left" />
<TextBlock Grid.Row="2" Name="textBlock2" Text="Age"
VerticalAlignment="Top" Margin="34,0,0,0" Height="23" HorizontalAlignment="Left" />
</Grid>
When you remove the validationsummary from ScrollViewer it shows.
ScrollView not required, was able to accomplish the same effect by setting maxheight property on the ValidationSummary

Last Grid Column Not Auto Resizing With Grid

I'm having a problem with my TextBoxs not "Auto" resizing. I'm trying to create a form that behaves and looks like the Properties Editor in Visual Studio. What appears to be happening is that the third column is not expanding to fill all of the available remaining space in the grid. Image below is how my form looks on startup.
The width of the textboxs is determined by the MinWidth setting on the third ColumnDefinition statement. Also, the Width is set to "*". With any other setting, the resizing done with the GridSplitter doesn't work correctly.
<StackPanel Orientation="Vertical" VerticalAlignment="Top" x:Name="Stacker" Grid.IsSharedSizeScope="True">
<Expander x:Name="Expand" IsExpanded="True" Header="This is a test of a Second Panel" Width="{Binding Width, ElementName=Stacker}">
<Grid x:Name="EditGrid1" Margin="3" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" MinWidth="50" SharedSizeGroup="SharedSize1" />
<ColumnDefinition Width="Auto" SharedSizeGroup="SharedSize2" />
<ColumnDefinition Width="*" MinWidth="50" x:Name="ValueCol" />
</Grid.ColumnDefinitions>
<GridSplitter Grid.Column="1" x:Name="ToolBoxSplitter1" Grid.Row="1" Grid.RowSpan="6" Panel.ZIndex="1" HorizontalAlignment="Stretch" ResizeBehavior="PreviousAndNext" Width="3"/>
<TextBlock MaxHeight="40" Grid.Column="0" Grid.Row="1" Text="{x:Static lex:DoSomeThingView.Name}" />
<TextBlock MaxHeight="40" Grid.Column="0" Grid.Row="2" Text="{x:Static lex:DoSomeThingView.Address}" />
<TextBlock MaxHeight="40" Grid.Column="0" Grid.Row="3" Text="{x:Static lex:DoSomeThingView.Zip}" />
<TextBlock MaxHeight="40" Grid.Column="0" Grid.Row="4" Text="{x:Static lex:DoSomeThingView.NumberOfDoors}" TextTrimming="CharacterEllipsis" Grid.IsSharedSizeScope="True" />
<TextBlock MaxHeight="40" Grid.Column="0" Grid.Row="5" Text="{x:Static lex:DoSomeThingView.DoubleNumber}" />
<TextBox Grid.Column="2" Grid.Row="1" x:Name="UserName1" MaxHeight="50" TextWrapping="Wrap"
VerticalScrollBarVisibility="Auto" SpellCheck.IsEnabled="True" />
<TextBox Grid.Column="2" Grid.Row="2" x:Name="Address1" />
<TextBox Grid.Column="2" Grid.Row="3" x:Name="Zip1" />
<TextBox Grid.Column="2" Grid.Row="4" x:Name="NumberOfDoors1" />
<TextBox Grid.Column="2" Grid.Row="5" x:Name="DoubleNumber1" />
</Grid>
</Expander>
</StackPanel>
Any suggestions on how to correct this?
Have a check once again of any style being set globally because your layout worked perfectly fine with me.
try overriding your textbox style by a local resource
<StackPanel.Resources>
<Style TargetType="{x:Type TextBox}"/>
</StackPanel.Resources>

Resources