Responsive UI for WpF application - wpf

I am trying to create a responsive design for my wpf application but having issue.Because when i am resizing it.it is not working.So can anyone help me out.
trying to adjust the screen based on different sizes to see if any components are reacting to that. Unfortunately they don't I am not sure what I am missing
<Window x:Class="LSLABAPP.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:LSLABAPP"
mc:Ignorable="d"
Title="MainWindow" Height="300" Width="525" MinHeight="300" MinWidth="525" ResizeMode="CanResizeWithGrip">
<Grid>
<Grid.Background>
<ImageBrush/>
</Grid.Background>
<Grid.RowDefinitions>
<RowDefinition MinHeight="80" Height="50"></RowDefinition>
<RowDefinition MinHeight="40" Height="40"></RowDefinition>
<RowDefinition MinHeight="40" Height="40*"></RowDefinition>
<RowDefinition MinHeight="40" Height="40*"></RowDefinition>
<RowDefinition MinHeight="40" Height="40*"></RowDefinition>
<RowDefinition MinHeight="40" Height="40*"></RowDefinition>
<RowDefinition MinHeight="40" Height="40*"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition MinWidth="100" Width="100"></ColumnDefinition>
<ColumnDefinition Width="417"/>
<ColumnDefinition Width="0"/>
</Grid.ColumnDefinitions>
<TextBox x:Name="UserName" Grid.Column="1" HorizontalAlignment="Left" Height="25" Margin="30,10,0,0" Grid.Row="2" TextWrapping="Wrap" Text="UserName" VerticalAlignment="Top" Width="172"/>
<PasswordBox x:Name="Password" Grid.Column="1" HorizontalAlignment="Left" Margin="30,10,0,0" Grid.Row="3" VerticalAlignment="Top" Width="172" Height="25"/>
<Label x:Name="UsernameLable" Content="UserName" HorizontalAlignment="Left" Margin="10,10,0,0" Grid.Row="2"
Grid.Column="0" VerticalAlignment="Top" Width="81" Height="26"/>
<Label x:Name="PasswordLable" Content="Password" HorizontalAlignment="Left" Margin="10,10,0,0" Grid.Row="3"
Grid.Column="0" VerticalAlignment="Top" Width="81" RenderTransformOrigin="0.333,2.038" Height="26"/>
<Canvas Grid.Column="1" HorizontalAlignment="Left" Height="80" VerticalAlignment="Top" Width="417" Background="#FF4E79EE">
<Label x:Name="label" Content="Testing" Canvas.Left="70" Canvas.Top="10" Width="260" Foreground="White" FontWeight="Bold"/>
<Label x:Name="label1" Content="DEV Environment" Canvas.Left="130" Canvas.Top="36" Foreground="red" FontWeight="Bold"/>
</Canvas>
<Canvas HorizontalAlignment="Left" Height="80" VerticalAlignment="Top" Width="100" Background="#FF4E79EE" />
<Image Margin="0,0,414,0" Grid.ColumnSpan="2">
<Image.Source>
<BitmapImage UriSource="Content/.ng" />
</Image.Source>
</Image>
</Grid>
</Window>

when you set a fixed height or width, then wpf won't resize.
But maybe this is a duplicate question to How to make all controls resize accordingly proportionally when window is maximized?

Related

How do I align a grid to the bottom and place two buttons in the bottom right corner?

Beginner with WPF here. I am trying to make a window that has a panel in the bottom of the window, that contains two buttons side by side in the bottom right corner. basically, like this picture. but, all I have managed to code is this. The bottom panel is a mess. How do I make it look like my original design? I have tried dragging within the designer, but it is not working.
My XAML below (for the entire window - because I'm a noob. feel free to correct any mistakes).
<Window x:Class="ace.views.Window1"
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:ace.views"
mc:Ignorable="d"
Title="Welcome to My software " Height="450" Width="800">
<Grid VerticalAlignment="top" HorizontalAlignment="Stretch">
<StackPanel Margin="30">
<TextBlock FontFamily="Segoe UI" FontSize="30" Foreground="#0078D7">Welcome to my software</TextBlock>
<TextBlock FontFamily="Segoe UI" FontSize="20" TextWrapping="Wrap" Margin="0 20">This application is here to help you to teach vocabulary to your students, and to keep track of their progress.</TextBlock>
<TextBlock FontFamily="Segoe UI" FontSize="20" TextWrapping="Wrap" Margin="0 20">Let's get started in the next step.</TextBlock>
</StackPanel>
<Grid Background="#EFEFEF" VerticalAlignment="Bottom" HorizontalAlignment="Stretch" Margin="0,0,0,0">
<Grid.RowDefinitions>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Button x:Name="cmdSubmit"
HorizontalAlignment="Center"
VerticalAlignment="Stretch" Grid.Row="0" Width="120" Content="Next" />
<Button x:Name="cmdReset"
HorizontalAlignment="Center"
VerticalAlignment="Stretch" Grid.Row="0" Width="120" Content="Cancel" Grid.Column="1"/>
</Grid>
</Grid>
</Window>
Two RowDefinitions in outer Grid should do the trick for Window layout.
Changing ColumnDefintions for inner Grid will help to pin buttons to the right side.
<Window x:Class="ace.views.Window1"
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:ace.views"
mc:Ignorable="d"
Background="#EFEFEF"
Title="Welcome to My software " Height="450" Width="800">
<Grid Background="White">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<StackPanel Margin="30">
<TextBlock FontFamily="Segoe UI" FontSize="30" Foreground="#0078D7">Welcome to my software</TextBlock>
<TextBlock FontFamily="Segoe UI" FontSize="20" TextWrapping="Wrap" Margin="0 20">This application is here to help you to teach vocabulary to your students, and to keep track of their progress.</TextBlock>
<TextBlock FontFamily="Segoe UI" FontSize="20" TextWrapping="Wrap" Margin="0 20">Let's get started in the next step.</TextBlock>
</StackPanel>
<Grid Grid.Row="1" Background="#EFEFEF">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Button x:Name="cmdSubmit" HorizontalAlignment="Center" Grid.Column="1" Width="120" Margin="5" Content="Next"/>
<Button x:Name="cmdReset" HorizontalAlignment="Center" Grid.Column="2" Width="120" Margin="5" Content="Cancel"/>
</Grid>
</Grid>
</Window>
Change your first Grid from Top to Stretch.
<Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
Put a Grid.RowDefinitions there...
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
Your second Grid, point it to Grid.Row=1
<Grid Background="#EFEFEF" Grid.Row="1" VerticalAlignment="Bottom" HorizontalAlignment="Stretch" Margin="0,0,0,0">
To find out more about RowDefinitions, Here

MaterialDesignInXAML TextBox Font Color is white (Background Color)

I have the following code:
<Window x:Class="App.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:App"
xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
TextElement.Foreground="{DynamicResource MaterialDesignBody}"
mc:Ignorable="d"
Background="{DynamicResource MaterialDesignPaper}"
FontFamily="{DynamicResource MaterialDesignFont}"
Title="e-Sura" Height="376.316" Width="525">
<Grid Margin="0,0,0,-7">
<Grid.RowDefinitions>
<RowDefinition Height="120"></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<materialDesign:Card Padding="32" Margin="16" Grid.Row="0">
<TextBlock TextAlignment="Center" Style="{DynamicResource MaterialDesignTitleTextBlock}">e-Sura Login</TextBlock>
</materialDesign:Card>
<materialDesign:Card Padding="12" Margin="16" Grid.Row="1" Height="180">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1.2*"></ColumnDefinition>
<ColumnDefinition Width="3*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<TextBlock Style="{DynamicResource MaterialDesignTitleTextBlock}" Grid.Row="0" Grid.Column="0" HorizontalAlignment="Right" >User Name :</TextBlock>
<TextBox Grid.Row="0" Grid.Column="1" Name="UserName" Padding="8,8,8,8" Margin="8,8,8,8" Text="KLPD"></TextBox>
<TextBlock Style="{DynamicResource MaterialDesignTitleTextBlock}" Grid.Row="1" Grid.Column="0" HorizontalAlignment="Right">Password :</TextBlock>
<PasswordBox Grid.Row="1" Grid.Column="1" Name="Password" Padding="8,8,8,8" Margin="8,8,8,8" Foreground="Black"></PasswordBox>
<StackPanel Grid.Column="1" Grid.Row="2" Orientation="Horizontal">
<Button Padding="8,8,8,8" Margin="8,8,8,8" Width="100">Login</Button>
<Button Padding="8,8,8,8" Margin="8,8,8,8" Background="#FFE2D122" BorderBrush="#FFE6D52E" Width="100">Cancel</Button>
</StackPanel>
</Grid>
</materialDesign:Card>
</Grid>
The TextBox named "UserName" when run always has a font color that is similar to the control background - i.e. in my case white.
I even tried to set the ForeColor="Black" on the specific control but it did not work.
What am I doing wrong here?
I think you are not using styles correctly. With your posted code I wasn't able to see textbox and passwordbox reason being Padding and Margin value you added on those controls.
Check out following code which is working fine without any issues:
<Window
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:WpfApplicationTest"
x:Class="WpfApplicationTest.MainWindow"
xmlns:materialDesign="http://materialdesigninxaml.net/winfx/xaml/themes"
x:Name="win"
WindowStartupLocation="CenterOwner"
TextElement.Foreground="{DynamicResource MaterialDesignBody}"
mc:Ignorable="d"
Background="{DynamicResource MaterialDesignPaper}"
FontFamily="{DynamicResource MaterialDesignFont}"
Title="e-Sura" Height="376.316" Width="525" FontSize="16">
<Window.Resources>
<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.DeepPurple.xaml" />
<ResourceDictionary Source="pack://application:,,,/MaterialDesignColors;component/Themes/Recommended/Accent/MaterialDesignColor.Lime.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
<Grid Margin="0,0,0,-7">
<Grid.RowDefinitions>
<RowDefinition Height="120"></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<materialDesign:Card Padding="32" Margin="16" Grid.Row="0">
<TextBlock TextAlignment="Center" Style="{DynamicResource MaterialDesignTitleTextBlock}">e-Sura Login</TextBlock>
</materialDesign:Card>
<materialDesign:Card Padding="12" Margin="16" Grid.Row="1" Height="180">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1.2*"></ColumnDefinition>
<ColumnDefinition Width="3*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="auto" />
<RowDefinition Height="auto" />
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Grid.Column="0" Margin="0, 10"
HorizontalAlignment="Right" Text="User Name :"/>
<TextBox Grid.Row="0" Grid.Column="1" Name="UserName" Text="KLPD"
Margin="8, 0" FontSize="20"
Style="{DynamicResource MaterialDesignTextBox}"/>
<TextBlock Grid.Row="1" Grid.Column="0" Margin="0, 10"
HorizontalAlignment="Right" Text="Password :"/>
<PasswordBox Grid.Row="1" Grid.Column="1"
Style="{DynamicResource MaterialDesignPasswordBox}"
Margin="8, 0" FontSize="20"
Name="Password" />
<StackPanel Grid.Column="1" Grid.Row="2" Orientation="Horizontal">
<Button Padding="8" Margin="8" Width="100">Login</Button>
<Button Padding="8" Margin="8" Background="#FFE2D122" BorderBrush="#FFE6D52E" Width="100">Cancel</Button>
</StackPanel>
</Grid>
</materialDesign:Card>
</Grid>
</Window>

Simpliest cross-resolution apps and adaptive UI building. Can't make that in WPF

Currently trying to build simpliest cross-resolution app (in other words an adaptive UI). The Apps itself is intended to start at min res:1024x768 and max res: 1920x1080.
However I have no success in doing of that.
this is 1024x768 window, where everything looks good.
this is 1920x1080 window, where controls "swam". However pic adapted itself to resolution.
<Window x:Class="WpfApplication2.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:WpfApplication2"
mc:Ignorable="d"
Title="MainWindow" Height="768" Width="1024" MinHeight="768" MinWidth="1024" MaxHeight="1080" MaxWidth="1920">
<Grid ShowGridLines="True">
<Grid.RowDefinitions>
<RowDefinition Height="80*"/>
<RowDefinition Height="512*"/>
<RowDefinition Height="160*"/>
</Grid.RowDefinitions>
<GroupBox x:Name="groupBox_Copy" Header="Truck2" Height="148" VerticalAlignment="Top" Margin="430,503.6,468.6,0" Grid.Row="1" Grid.RowSpan="2">
<Button x:Name="button_Copy" Content="Start" HorizontalAlignment="Left" Margin="20,13,0,0" VerticalAlignment="Top" Width="75" RenderTransformOrigin="0.245,-0.667"/>
</GroupBox>
<GroupBox x:Name="groupBox_Copy1" Header="Truck3" Height="148" VerticalAlignment="Top" Margin="752,503.6,146.6,0" Grid.Row="1" Grid.RowSpan="2">
<Button x:Name="button_Copy1" Content="Start" HorizontalAlignment="Left" Margin="20,13,0,0" VerticalAlignment="Top" Width="75" RenderTransformOrigin="0.245,-0.667"/>
</GroupBox>
<GroupBox x:Name="groupBox_Copy2" Header="Truck1" Height="148" VerticalAlignment="Top" Margin="148,503.6,750.6,0" Grid.Row="1" Grid.RowSpan="2">
<Button x:Name="button" Content="Start" HorizontalAlignment="Left" Margin="20,13,0,0" VerticalAlignment="Top" Width="75" RenderTransformOrigin="0.245,-0.667"/>
</GroupBox>
<Image x:Name="image" Grid.Row="1" Source="Resources/truck.png"/>
</Grid>
Layout via fixed Margins in not adaptive. There is nothing wrong in using nested Panels:
UniformGrid can arrange equal space for each child element (GroupBox).
<Grid ShowGridLines="True">
<Grid.RowDefinitions>
<RowDefinition Height="80*"/>
<RowDefinition Height="512*"/>
<RowDefinition Height="160*"/>
</Grid.RowDefinitions>
<UniformGrid Rows="1" Grid.Row="2">
<GroupBox x:Name="groupBox_Copy" Header="Truck2" Height="148" VerticalAlignment="Top">
<Button x:Name="button_Copy" Content="Start" HorizontalAlignment="Left" Margin="20,13,0,0" VerticalAlignment="Top" Width="75"/>
</GroupBox>
<GroupBox x:Name="groupBox_Copy1" Header="Truck3" Height="148" VerticalAlignment="Top">
<Button x:Name="button_Copy1" Content="Start" HorizontalAlignment="Left" Margin="20,13,0,0" VerticalAlignment="Top" Width="75"/>
</GroupBox>
<GroupBox x:Name="groupBox_Copy2" Header="Truck1" Height="148" VerticalAlignment="Top">
<Button x:Name="button" Content="Start" HorizontalAlignment="Left" Margin="20,13,0,0" VerticalAlignment="Top" Width="75"/>
</GroupBox>
</UniformGrid>
<Image x:Name="image" Grid.Row="1" Source="Resources/truck.png"/>
</Grid>
1024x768.
1920x1080.
Looks a little better. However, the controls "swam" to left direction. As can be seen.
<Window x:Class="WpfApplication2.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:WpfApplication2"
mc:Ignorable="d"
Title="MainWindow" Height="768" Width="1024" MinHeight="768" MinWidth="1024" MaxHeight="1080" MaxWidth="1920">
<Grid ShowGridLines="True">
<Grid.RowDefinitions>
<RowDefinition Height="80*"/>
<RowDefinition Height="512*"/>
<RowDefinition Height="160*"/>
</Grid.RowDefinitions>
<Image x:Name="image" Grid.Row="1" Source="Resources/truck.png"/>
<Grid HorizontalAlignment="Left" Height="138" Margin="10,9.6,0,0" Grid.Row="2" VerticalAlignment="Top" Width="998">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="125*"/>
<ColumnDefinition Width="143*"/>
<ColumnDefinition Width="147*"/>
<ColumnDefinition Width="143*"/>
<ColumnDefinition Width="171*"/>
<ColumnDefinition Width="143*"/>
<ColumnDefinition Width="120*"/>
</Grid.ColumnDefinitions>
<GroupBox x:Name="GroupBox1" Grid.Column="1" Header="Truck1" Background="SeaShell" Grid.ColumnSpan="2" Margin="0.4,0,147.6,0">
<Button x:Name="button_Copy2" Content="Start" HorizontalAlignment="Left" Margin="59,23,-2,0" VerticalAlignment="Top" Width="75" RenderTransformOrigin="-1.211,-0.299"/>
</GroupBox>
<GroupBox x:Name="GroupBox2" Grid.Column="3" Header="Truck2" Background="SeaShell" Grid.ColumnSpan="2" Margin="0.4,0,171.6,0">
<Button x:Name="button_Copy" Content="Start" HorizontalAlignment="Left" Margin="59,23,-2,0" VerticalAlignment="Top" Width="75" RenderTransformOrigin="-1.211,-0.299"/>
</GroupBox>
<GroupBox x:Name="GroupBox3" Grid.Column="5" Header="Truck3" Background="SeaShell" Grid.ColumnSpan="2" Margin="0.4,0,120.4,0">
<Button x:Name="button_Copy1" Content="Start" HorizontalAlignment="Left" Margin="59,23,-2,0" VerticalAlignment="Top" Width="75"/>
</GroupBox>
</Grid>
</Grid>

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

WPF designer fail to load because of System.Web Exception !!

My wpf designer fails to load because it says it cannot find assembly System.web and I don't have any idea what wpf has to do with System.web
Any Idea ?
Here is one of the XAML Pages :
<UserControl x:Class="RadinFarazJamAutomationSystem.UserControls.ctrlPriceManagement"
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" Height="200" Loaded="UserControl_Loaded" Width="300" FlowDirection="RightToLeft" d:DesignWidth="300">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="1*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="165*" />
</Grid.RowDefinitions>
<Button Content="ثبت" Grid.Row="3" Height="23" HorizontalAlignment="Left" Margin="5" Name="btnSave" VerticalAlignment="Center" Width="80" Click="btnSave_Click" Grid.Column="1" />
<Label Content="نرخ دلار" HorizontalAlignment="Left" Margin="5" VerticalAlignment="Center" />
<Label Content="درصد سود مشتری" Grid.Row="1" Height="28" HorizontalAlignment="Left" Margin="5" VerticalAlignment="Center" />
<Label Content="درصد سود همکار" Grid.Row="2" Margin="5" VerticalAlignment="Center" />
<TextBox Grid.Column="1" HorizontalAlignment="Stretch" Margin="5" Name="txtDollarPrice" VerticalAlignment="Center" />
<TextBox Grid.Column="1" Grid.Row="1" HorizontalAlignment="Stretch" Margin="5" Name="txtCustomerProfit" VerticalAlignment="Top" />
<TextBox Grid.Column="1" Grid.Row="2" Height="23" HorizontalAlignment="Stretch" Margin="5" Name="txtColleagueProfit" VerticalAlignment="Top" />
</Grid>
but this is not related to xaml because every page has the same error . Everything was fine when one day I see this error in every page and I don't know what did i do that might caused this error.
Just a guess but could it be that your project is targeting the client profile of the .Net Framework? If you are attempting to use types that are not included there then you would probably see an error similar to this.
http://msdn.microsoft.com/en-us/library/cc656912.aspx

Resources