Chess Board in Metro Style apps - c#

I am just playing around with the Metro style apps. I wanted to create a simple chess board using the UniformGrid from Wpf but it seems like that it is not supported in Metro style apps. Are there any alternative ways in Metro Style apps to create a chess board?


Can't you just use an 8x8 Grid? Eight RowDefinitions and Eight ColumnDefinitions should get it.
Here's a very brute force method of doing this. As long as the grid's height and width make it square, the resultant items will be the appropriate proportions. You could also set the Height of each RowDefinition and the Width of each ColumnDefinition to the same arbitrary value and get it proportional.
For something like this, I might choose to add the controls in the codebehind, versus in the XAML, but that's a choice I leave up to you.
<Grid x:Name="LayoutRoot" Background="White" Width="400" Height="400" >
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
<RowDefinition />
<RowDefinition />
<RowDefinition />
<RowDefinition />
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Border Background="Black" Grid.Row="0" Grid.Column="0"/>
<Border Background="Ivory" Grid.Row="0" Grid.Column="1"/>
<Border Background="Black" Grid.Row="0" Grid.Column="2"/>
<Border Background="Ivory" Grid.Row="0" Grid.Column="3"/>
<Border Background="Black" Grid.Row="0" Grid.Column="4"/>
<Border Background="Ivory" Grid.Row="0" Grid.Column="5"/>
<Border Background="Black" Grid.Row="0" Grid.Column="6"/>
<Border Background="Ivory" Grid.Row="0" Grid.Column="7"/>
<Border Background="Black" Grid.Row="2" Grid.Column="0"/>
<Border Background="Ivory" Grid.Row="2" Grid.Column="1"/>
<Border Background="Black" Grid.Row="2" Grid.Column="2"/>
<Border Background="Ivory" Grid.Row="2" Grid.Column="3"/>
<Border Background="Black" Grid.Row="2" Grid.Column="4"/>
<Border Background="Ivory" Grid.Row="2" Grid.Column="5"/>
<Border Background="Black" Grid.Row="2" Grid.Column="6"/>
<Border Background="Ivory" Grid.Row="2" Grid.Column="7"/>
<Border Background="Black" Grid.Row="4" Grid.Column="0"/>
<Border Background="Ivory" Grid.Row="4" Grid.Column="1"/>
<Border Background="Black" Grid.Row="4" Grid.Column="2"/>
<Border Background="Ivory" Grid.Row="4" Grid.Column="3"/>
<Border Background="Black" Grid.Row="4" Grid.Column="4"/>
<Border Background="Ivory" Grid.Row="4" Grid.Column="5"/>
<Border Background="Black" Grid.Row="4" Grid.Column="6"/>
<Border Background="Ivory" Grid.Row="4" Grid.Column="7"/>
<Border Background="Black" Grid.Row="6" Grid.Column="0"/>
<Border Background="Ivory" Grid.Row="6" Grid.Column="1"/>
<Border Background="Black" Grid.Row="6" Grid.Column="2"/>
<Border Background="Ivory" Grid.Row="6" Grid.Column="3"/>
<Border Background="Black" Grid.Row="6" Grid.Column="4"/>
<Border Background="Ivory" Grid.Row="6" Grid.Column="5"/>
<Border Background="Black" Grid.Row="6" Grid.Column="6"/>
<Border Background="Ivory" Grid.Row="6" Grid.Column="7"/>
<Border Background="Ivory" Grid.Row="1" Grid.Column="0"/>
<Border Background="Black" Grid.Row="1" Grid.Column="1"/>
<Border Background="Ivory" Grid.Row="1" Grid.Column="2"/>
<Border Background="Black" Grid.Row="1" Grid.Column="3"/>
<Border Background="Ivory" Grid.Row="1" Grid.Column="4"/>
<Border Background="Black" Grid.Row="1" Grid.Column="5"/>
<Border Background="Ivory" Grid.Row="1" Grid.Column="6"/>
<Border Background="Black" Grid.Row="1" Grid.Column="7"/>
<Border Background="Ivory" Grid.Row="3" Grid.Column="0"/>
<Border Background="Black" Grid.Row="3" Grid.Column="1"/>
<Border Background="Ivory" Grid.Row="3" Grid.Column="2"/>
<Border Background="Black" Grid.Row="3" Grid.Column="3"/>
<Border Background="Ivory" Grid.Row="3" Grid.Column="4"/>
<Border Background="Black" Grid.Row="3" Grid.Column="5"/>
<Border Background="Ivory" Grid.Row="3" Grid.Column="6"/>
<Border Background="Black" Grid.Row="3" Grid.Column="7"/>
<Border Background="Ivory" Grid.Row="5" Grid.Column="0"/>
<Border Background="Black" Grid.Row="5" Grid.Column="1"/>
<Border Background="Ivory" Grid.Row="5" Grid.Column="2"/>
<Border Background="Black" Grid.Row="5" Grid.Column="3"/>
<Border Background="Ivory" Grid.Row="5" Grid.Column="4"/>
<Border Background="Black" Grid.Row="5" Grid.Column="5"/>
<Border Background="Ivory" Grid.Row="5" Grid.Column="6"/>
<Border Background="Black" Grid.Row="5" Grid.Column="7"/>
<Border Background="Ivory" Grid.Row="7" Grid.Column="0"/>
<Border Background="Black" Grid.Row="7" Grid.Column="1"/>
<Border Background="Ivory" Grid.Row="7" Grid.Column="2"/>
<Border Background="Black" Grid.Row="7" Grid.Column="3"/>
<Border Background="Ivory" Grid.Row="7" Grid.Column="4"/>
<Border Background="Black" Grid.Row="7" Grid.Column="5"/>
<Border Background="Ivory" Grid.Row="7" Grid.Column="6"/>
<Border Background="Black" Grid.Row="7" Grid.Column="7"/>
<Border Background="Ivory" Grid.Row="1" Grid.Column="0"/>
<Border Background="Black" Grid.Row="1" Grid.Column="1"/>
<Border Background="Ivory" Grid.Row="1" Grid.Column="2"/>
<Border Background="Black" Grid.Row="1" Grid.Column="3"/>
<Border Background="Ivory" Grid.Row="1" Grid.Column="4"/>
<Border Background="Black" Grid.Row="1" Grid.Column="5"/>
<Border Background="Ivory" Grid.Row="1" Grid.Column="6"/>
<Border Background="Black" Grid.Row="1" Grid.Column="7"/>
<Border Background="Ivory" Grid.Row="1" Grid.Column="0"/>
<Border Background="Black" Grid.Row="1" Grid.Column="1"/>
<Border Background="Ivory" Grid.Row="1" Grid.Column="2"/>
<Border Background="Black" Grid.Row="1" Grid.Column="3"/>
<Border Background="Ivory" Grid.Row="1" Grid.Column="4"/>
<Border Background="Black" Grid.Row="1" Grid.Column="5"/>
<Border Background="Ivory" Grid.Row="1" Grid.Column="6"/>
<Border Background="Black" Grid.Row="1" Grid.Column="7"/>
</Grid>


If you plan on using databinding you can use a WrapGrid with the MaximumRowsOrColumns property set to 8. Then bind to a collection of 64 items that contain the state of the board.
WrapGrid API Reference


UniformGrid isn't necessary with ViewBox:
<Window
x:Class="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:ChessGUI"
mc:Ignorable="d"
Title="Chess GUI"
Height="640"
Width="640" Background="PaleGreen"
>
<Viewbox Stretch="Uniform" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="16" >
<Grid Background="White" Width="256" Height="256">
<Grid.RowDefinitions>
<RowDefinition Height="0" />
<RowDefinition Height="*" />
<RowDefinition Height="0" />
<RowDefinition Height="*" />
<RowDefinition Height="0" />
<RowDefinition Height="*" />
<RowDefinition Height="0" />
<RowDefinition Height="*" />
<RowDefinition Height="0" />
<RowDefinition Height="*" />
<RowDefinition Height="0" />
<RowDefinition Height="*" />
<RowDefinition Height="0" />
<RowDefinition Height="*" />
<RowDefinition Height="0" />
<RowDefinition Height="*" />
<RowDefinition Height="0" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="0" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="0" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="0" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="0" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="0" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="0" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="0" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="0" />
</Grid.ColumnDefinitions>
<Rectangle Grid.Row="1" Grid.Column="1" Fill="LightGray" />
<Rectangle Grid.Row="1" Grid.Column="3" Fill="DarkGray" />
<Rectangle Grid.Row="1" Grid.Column="5" Fill="LightGray" />
<Rectangle Grid.Row="1" Grid.Column="7" Fill="DarkGray" />
<Rectangle Grid.Row="1" Grid.Column="9" Fill="LightGray" />
<Rectangle Grid.Row="1" Grid.Column="11" Fill="DarkGray" />
<Rectangle Grid.Row="1" Grid.Column="13" Fill="LightGray" />
<Rectangle Grid.Row="1" Grid.Column="15" Fill="DarkGray" />
<Rectangle Grid.Row="3" Grid.Column="1" Fill="DarkGray" />
<Rectangle Grid.Row="3" Grid.Column="3" Fill="LightGray" />
<Rectangle Grid.Row="3" Grid.Column="5" Fill="DarkGray" />
<Rectangle Grid.Row="3" Grid.Column="7" Fill="LightGray" />
<Rectangle Grid.Row="3" Grid.Column="9" Fill="DarkGray" />
<Rectangle Grid.Row="3" Grid.Column="11" Fill="LightGray" />
<Rectangle Grid.Row="3" Grid.Column="13" Fill="DarkGray" />
<Rectangle Grid.Row="3" Grid.Column="15" Fill="LightGray" />
<Rectangle Grid.Row="5" Grid.Column="1" Fill="LightGray" />
<Rectangle Grid.Row="5" Grid.Column="3" Fill="DarkGray" />
<Rectangle Grid.Row="5" Grid.Column="5" Fill="LightGray" />
<Rectangle Grid.Row="5" Grid.Column="7" Fill="DarkGray" />
<Rectangle Grid.Row="5" Grid.Column="9" Fill="LightGray" />
<Rectangle Grid.Row="5" Grid.Column="11" Fill="DarkGray" />
<Rectangle Grid.Row="5" Grid.Column="13" Fill="LightGray" />
<Rectangle Grid.Row="5" Grid.Column="15" Fill="DarkGray" />
<Rectangle Grid.Row="7" Grid.Column="1" Fill="DarkGray" />
<Rectangle Grid.Row="7" Grid.Column="3" Fill="LightGray" />
<Rectangle Grid.Row="7" Grid.Column="5" Fill="DarkGray" />
<Rectangle Grid.Row="7" Grid.Column="7" Fill="LightGray" />
<Rectangle Grid.Row="7" Grid.Column="9" Fill="DarkGray" />
<Rectangle Grid.Row="7" Grid.Column="11" Fill="LightGray" />
<Rectangle Grid.Row="7" Grid.Column="13" Fill="DarkGray" />
<Rectangle Grid.Row="7" Grid.Column="15" Fill="LightGray" />
<Rectangle Grid.Row="9" Grid.Column="1" Fill="LightGray" />
<Rectangle Grid.Row="9" Grid.Column="3" Fill="DarkGray" />
<Rectangle Grid.Row="9" Grid.Column="5" Fill="LightGray" />
<Rectangle Grid.Row="9" Grid.Column="7" Fill="DarkGray" />
<Rectangle Grid.Row="9" Grid.Column="9" Fill="LightGray" />
<Rectangle Grid.Row="9" Grid.Column="11" Fill="DarkGray" />
<Rectangle Grid.Row="9" Grid.Column="13" Fill="LightGray" />
<Rectangle Grid.Row="9" Grid.Column="15" Fill="DarkGray" />
<Rectangle Grid.Row="11" Grid.Column="1" Fill="DarkGray" />
<Rectangle Grid.Row="11" Grid.Column="3" Fill="LightGray" />
<Rectangle Grid.Row="11" Grid.Column="5" Fill="DarkGray" />
<Rectangle Grid.Row="11" Grid.Column="7" Fill="LightGray" />
<Rectangle Grid.Row="11" Grid.Column="9" Fill="DarkGray" />
<Rectangle Grid.Row="11" Grid.Column="11" Fill="LightGray" />
<Rectangle Grid.Row="11" Grid.Column="13" Fill="DarkGray" />
<Rectangle Grid.Row="11" Grid.Column="15" Fill="LightGray" />
<Rectangle Grid.Row="13" Grid.Column="1" Fill="LightGray" />
<Rectangle Grid.Row="13" Grid.Column="3" Fill="DarkGray" />
<Rectangle Grid.Row="13" Grid.Column="5" Fill="LightGray" />
<Rectangle Grid.Row="13" Grid.Column="7" Fill="DarkGray" />
<Rectangle Grid.Row="13" Grid.Column="9" Fill="LightGray" />
<Rectangle Grid.Row="13" Grid.Column="11" Fill="DarkGray" />
<Rectangle Grid.Row="13" Grid.Column="13" Fill="LightGray" />
<Rectangle Grid.Row="13" Grid.Column="15" Fill="DarkGray" />
<Rectangle Grid.Row="15" Grid.Column="1" Fill="DarkGray" />
<Rectangle Grid.Row="15" Grid.Column="3" Fill="LightGray" />
<Rectangle Grid.Row="15" Grid.Column="5" Fill="DarkGray" />
<Rectangle Grid.Row="15" Grid.Column="7" Fill="LightGray" />
<Rectangle Grid.Row="15" Grid.Column="9" Fill="DarkGray" />
<Rectangle Grid.Row="15" Grid.Column="11" Fill="LightGray" />
<Rectangle Grid.Row="15" Grid.Column="13" Fill="DarkGray" />
<Rectangle Grid.Row="15" Grid.Column="15" Fill="LightGray" />
</Grid>
</Viewbox>
</Window>

Related

Getting an error called 'Windows.UI.Xaml.Markup.XamlParseException' [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
Closed 3 years ago.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
This question was caused by a typo or a problem that can no longer be reproduced. While similar questions may be on-topic here, this one was resolved in a way less likely to help future readers.
Improve this question
I'm getting this error while trying to develop my app, the compilator said that it could not find an error code. So I don't have more information. I know that the error is generated while trying to initializeComponent.
Here is the code of my page:
<RelativePanel Padding="40">
<Image x:Name="logo" Source="ms-appx:///Assets/UPSA.jpg" Width="150" Height="200"/>
<Border RelativePanel.RightOf="logo" Height="200" RelativePanel.AlignRightWithPanel="True" Background="Orange" UseLayoutRounding="True" CornerRadius="40,40,40,40" Margin="30,0,0,0" />
<TextBlock Text="Universidad Pontifica de Salamanca" FontSize="72" RelativePanel.RightOf="logo" RelativePanel.AlignRightWithPanel="True" HorizontalAlignment="Center" FontFamily="Cooper Black" RelativePanel.AlignVerticalCenterWith="logo"/>
<Grid Margin="30" x:Name="mainGridL" RelativePanel.Below="logo" Height="500" RelativePanel.AlignRightWithPanel="True" RelativePanel.AlignLeftWithPanel="True">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1.3*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<RelativePanel Grid.Column="0" >
<TextBlock x:Name="textPersonal" Text="Datos Personales" FontSize="60" VerticalAlignment="Top" HorizontalAlignment="Center" Foreground="Orange"/>
<Line x:Name="lineBText" Stroke="Black" RelativePanel.Below="textPersonal" Width="770" StrokeThickness="20" X1="0" X2="770"/>
<Line x:Name="lineMid" Stroke="Black" RelativePanel.Below="textPersonal" Width="770" StrokeThickness="20" X1="770" X2="770" Y1="0" Y2="420" />
<Grid RelativePanel.Below="lineBText" Margin="0,20,0,0" RelativePanel.AlignBottomWithPanel="True" RelativePanel.AlignRightWithPanel="True" RelativePanel.AlignLeftWithPanel="True">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="0.5*"/>
<RowDefinition Height="0.5*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Row="0" Grid.Column="0" x:Name="textDni" Text="Dni" FontSize="35" VerticalAlignment="Center" Margin="30,0,0,0"/>
<TextBlock Grid.Row="0" Grid.Column="1" x:Name="textEmail" Text="Email" FontSize="35" VerticalAlignment="Center" Margin="30,0,0,0" />
<TextBox Grid.Row="1" Grid.Column=" 0" x:Name="nifBox" PlaceholderText="DNI..." FontSize="20" Background="Gray" VerticalAlignment="Center" Margin="29,0,30,0" />
<TextBox x:Name="emailBox" Grid.Row="1" Grid.Column="1" PlaceholderText="Email..." FontSize="20" Background="Gray" VerticalAlignment="Center" Margin="30,0,30,0" />
<TextBlock Grid.Row="2" Grid.Column="0" Text="Nombre" FontSize="35" VerticalAlignment="Center" Margin="30,0,0,0"/>
<TextBlock Grid.Row="2" Grid.Column="1" Text="Apellidos" FontSize="35" VerticalAlignment="Center" Margin="30,0,0,0"/>
<TextBox x:Name="nameBox" Grid.Row="3" Grid.Column=" 0" PlaceholderText="Nombre..." FontSize="20" Background="Gray" VerticalAlignment="Center" Margin="30,0,30,0" />
<TextBox x:Name="surnameBox" Grid.Row="3" Grid.Column="1" PlaceholderText="Apellido..." FontSize="20" Background="Gray" VerticalAlignment="Center" Margin="30,0,30,0" />
<TextBlock Grid.Row="4" Grid.Column="0" Text="Genero" FontSize="35" Grid.ColumnSpan="2" VerticalAlignment="Center" HorizontalAlignment="Center"/>
<RadioButton Grid.Row="5" Grid.Column="0" x:Name="genderMale" Content="Hombre" FontSize="20" HorizontalAlignment="Center" Grid.ColumnSpan="2"/>
<RadioButton Grid.Row="6" Grid.Column="0" x:Name="genderFemale" Content="Mujer" FontSize="20" HorizontalAlignment="Center" Grid.ColumnSpan="2"/>
</Grid>
</RelativePanel>
<RelativePanel Grid.Column="1">
<TextBlock x:Name="textIns" Text="Datos Inscripcion" FontSize="60" VerticalAlignment="Top" HorizontalAlignment="Center" Foreground="Orange"/>
<Line x:Name="lineBTextIns" Stroke="Black" RelativePanel.Below="textIns" Width="770" StrokeThickness="20" X1="0" X2="770"/>
<StackPanel RelativePanel.Below="lineBTextIns" Orientation="Vertical" RelativePanel.AlignLeftWithPanel="True" RelativePanel.AlignRightWithPanel="True" RelativePanel.AlignBottomWithPanel="True" VerticalAlignment="Center" HorizontalAlignment="Center">
<TextBlock Text="Titulacion cursada" FontSize="40" Margin="0,0,0,30"/>
<ComboBox x:Name="degreeName" PlaceholderText="Esoge tu titulacion" HorizontalAlignment="Center">
<x:String>ADET</x:String>
<x:String>Ing.Informatica</x:String>
<x:String>ADET + Ing.Informatica</x:String>
<x:String>Ing.Informatica + ADET</x:String>
</ComboBox>
<TextBlock Text="Escoge una charla" FontSize="40" Margin="0,0,0,30"/>
<ComboBox x:Name="activities" PlaceholderText="Escoge una charla" HorizontalAlignment="Center" ItemsSource="{Binding Name}"/>
</StackPanel>
</RelativePanel>
</Grid>
<Button RelativePanel.Below="mainGridL" Content="Enviar" FontSize="40" Margin="0,21,0,0" RelativePanel.AlignHorizontalCenterWithPanel="True" />
</RelativePanel>
After a long time of trying and error, I found where is the issue located. In the deepest Grid, the error is generated while trying to create TextBox, don't know why because if you just delete textBox it works properly.
Here is the error...
<Grid RelativePanel.Below="lineBText" Margin="0,20,0,0" RelativePanel.AlignBottomWithPanel="True" RelativePanel.AlignRightWithPanel="True" RelativePanel.AlignLeftWithPanel="True">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="0.5*"/>
<RowDefinition Height="0.5*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<TextBlock Grid.Row="0" Grid.Column="0" x:Name="textDni" Text="Dni" FontSize="35" VerticalAlignment="Center" Margin="30,0,0,0"/>
<TextBlock Grid.Row="0" Grid.Column="1" x:Name="textEmail" Text="Email" FontSize="35" VerticalAlignment="Center" Margin="30,0,0,0" />
<TextBox Grid.Row="1" Grid.Column=" 0" x:Name="nifBox" PlaceholderText="DNI..." FontSize="20" Background="Gray" VerticalAlignment="Center" Margin="29,0,30,0" />
<TextBox x:Name="emailBox" Grid.Row="1" Grid.Column="1" PlaceholderText="Email..." FontSize="20" Background="Gray" VerticalAlignment="Center" Margin="30,0,30,0" />
<TextBlock Grid.Row="2" Grid.Column="0" Text="Nombre" FontSize="35" VerticalAlignment="Center" Margin="30,0,0,0"/>
<TextBlock Grid.Row="2" Grid.Column="1" Text="Apellidos" FontSize="35" VerticalAlignment="Center" Margin="30,0,0,0"/>
<TextBox x:Name="nameBox" Grid.Row="3" Grid.Column=" 0" PlaceholderText="Nombre..." FontSize="20" Background="Gray" VerticalAlignment="Center" Margin="30,0,30,0" />
<TextBox x:Name="surnameBox" Grid.Row="3" Grid.Column="1" PlaceholderText="Apellido..." FontSize="20" Background="Gray" VerticalAlignment="Center" Margin="30,0,30,0" />
<TextBlock Grid.Row="4" Grid.Column="0" Text="Genero" FontSize="35" Grid.ColumnSpan="2" VerticalAlignment="Center" HorizontalAlignment="Center"/>
<RadioButton Grid.Row="5" Grid.Column="0" x:Name="genderMale" Content="Hombre" FontSize="20" HorizontalAlignment="Center" Grid.ColumnSpan="2"/>
<RadioButton Grid.Row="6" Grid.Column="0" x:Name="genderFemale" Content="Mujer" FontSize="20" HorizontalAlignment="Center" Grid.ColumnSpan="2"/>
</Grid>
Thanks for helping.

Pay attention to this two lines:
<TextBox Grid.Row="1" Grid.Column=" 0" x:Name="nifBox" PlaceholderText="DNI..." FontSize="20" Background="Gray" VerticalAlignment="Center" Margin="29,0,30,0" />
<TextBox x:Name="nameBox" Grid.Row="3" Grid.Column=" 0" PlaceholderText="Nombre..." FontSize="20" Background="Gray" VerticalAlignment="Center" Margin="30,0,30,0" />
You have an extra space before 0 value in the Grid.Column. You need to pass "0" instead of " 0".

How to create expandable(dropdown) table in xaml?

I am working on a project which displays a table. I am using a grid to present the table. Now, I want to add "+" button next to each row. This "+" button click will display a subtable under that row. This is a part of code without that feature implemented:
<Grid Name="ContentName" Grid.Row="1" Background="#FFFBFBFB" Margin="10,10,10,10" ScrollViewer.CanContentScroll="True" ScrollViewer.HorizontalScrollBarVisibility="Auto">
<Grid.Effect>
<DropShadowEffect BlurRadius="20" Color="#FF858585" RenderingBias="Quality" ShadowDepth="1"/>
</Grid.Effect>
<Grid Name ="Tables" Margin="30">
<Grid.RowDefinitions>
<RowDefinition Height="80"/>
<RowDefinition Height="60"/>
<RowDefinition Height="60"/>
<RowDefinition Height="60"/>
<RowDefinition Height="60"/>
<RowDefinition Height="60"/>
<RowDefinition Height="60"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="170"></ColumnDefinition>
<ColumnDefinition Width="120"></ColumnDefinition>
<ColumnDefinition Width="60"></ColumnDefinition>
<ColumnDefinition Width="100"></ColumnDefinition>
<ColumnDefinition Width="100"></ColumnDefinition>
<ColumnDefinition Width="100"></ColumnDefinition>
<ColumnDefinition Width="100"></ColumnDefinition>
<ColumnDefinition Width="100"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Border Grid.Row="0" Grid.Column="0" BorderBrush="Black" BorderThickness="1,1,1,1" />
<TextBlock Grid.Row="0" Grid.Column="0" HorizontalAlignment="Center" VerticalAlignment="Center">
Expand each section to answer <LineBreak/>
each Risk Attribute Statement <LineBreak/>
[i.e. activity, service or product]
</TextBlock>
<Border Grid.Row="0" Grid.Column="1" BorderBrush="Black" BorderThickness="0,1,1,1" />
<TextBlock Grid.Row="0" Grid.Column="1" HorizontalAlignment="Center" VerticalAlignment="Center">
Category Inherent <LineBreak/>
Risk
</TextBlock>
<Border Grid.Row="0" Grid.Column="2" Background="Coral"/>
<TextBlock Grid.Row="0" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Center">
Select <LineBreak/>
Risk <LineBreak/>
Level
</TextBlock>
<Border Grid.Row="0" Grid.Column="3" Background="#FFDCE6F1" />
<TextBlock Grid.Row="0" Grid.Column="3" HorizontalAlignment="Center" VerticalAlignment="Center">
Least(1)
</TextBlock>
<Border Grid.Row="0" Grid.Column="4" Background="#FFB8CCE4" />
<TextBlock Grid.Row="0" Grid.Column="4" HorizontalAlignment="Center" VerticalAlignment="Center">
Minimal(2)
</TextBlock>
<Border Grid.Row="0" Grid.Column="5" Background="#FF95B3D7" />
<TextBlock Grid.Row="0" Grid.Column="5" HorizontalAlignment="Center" VerticalAlignment="Center">
Moderate(3)
</TextBlock>
<Border Grid.Row="0" Grid.Column="6" Background="#FF366092" />
<TextBlock Grid.Row="0" Grid.Column="6" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="White">
Significant(4)
</TextBlock>
<Border Grid.Row="0" Grid.Column="7" Background="#FF244062" />
<TextBlock Grid.Row="0" Grid.Column="7" HorizontalAlignment="Center" VerticalAlignment="Center" Foreground="White">
Most(5)
</TextBlock>
<Border Grid.Row="1" Grid.Column="0" BorderBrush="Black" BorderThickness="1,0,1,1" />
<TextBlock Grid.Row="1" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="10,0,0,0">
Category 1:
Technologies and <LineBreak/>
Connection Types
</TextBlock>
<Border Grid.Row="2" Grid.Column="0" BorderBrush="Black" BorderThickness="1,0,1,1" />
<TextBlock Grid.Row="2" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="10,0,0,0">
Category 2:
Delivery Channels
</TextBlock>
<Border Grid.Row="3" Grid.Column="0" BorderBrush="Black" BorderThickness="1,0,1,1" />
<TextBlock Grid.Row="3" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Center" Margin ="10,0,0,0">
Category 3: <LineBreak/>
Online/Mobile Products <LineBreak/>
and Technology Services
</TextBlock>
<Border Grid.Row="4" Grid.Column="0" BorderBrush="Black" BorderThickness="1,0,1,1" />
<TextBlock Grid.Row="4" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="10,0,0,0">
Category 4: <LineBreak/>
Organizational Characteristics
</TextBlock>
<Border Grid.Row="5" Grid.Column="0" BorderBrush="Black" BorderThickness="1,0,1,1" />
<TextBlock Grid.Row="5" Grid.Column="0" HorizontalAlignment="Left" VerticalAlignment="Center" Margin="10,0,0,0">
Category 5: External Threats
</TextBlock>
<Border Grid.Row="1" Grid.Column="1" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="2" Grid.Column="1" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="3" Grid.Column="1" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="4" Grid.Column="1" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="5" Grid.Column="1" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="1" Grid.Column="2" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="2" Grid.Column="2" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="3" Grid.Column="2" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="4" Grid.Column="2" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="5" Grid.Column="2" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="1" Grid.Column="3" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="2" Grid.Column="3" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="3" Grid.Column="3" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="4" Grid.Column="3" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="5" Grid.Column="3" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="1" Grid.Column="4" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="2" Grid.Column="4" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="3" Grid.Column="4" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="4" Grid.Column="4" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="5" Grid.Column="4" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="1" Grid.Column="5" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="2" Grid.Column="5" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="3" Grid.Column="5" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="4" Grid.Column="5" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="5" Grid.Column="5" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="1" Grid.Column="6" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="2" Grid.Column="6" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="3" Grid.Column="6" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="4" Grid.Column="6" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="5" Grid.Column="6" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="1" Grid.Column="7" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="2" Grid.Column="7" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="3" Grid.Column="7" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="4" Grid.Column="7" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Border Grid.Row="5" Grid.Column="7" BorderBrush="Black" BorderThickness="0,0,1,1" />
<Expander Grid.Row="6" Grid.Column="0" Header="More Options">
<StackPanel Margin="10,4,0,0">
<ScrollBar Orientation="Vertical"
Minimum="1" Maximum="100"
Value="10"
/>
<CheckBox Margin="4" Content="Option 1" />
<CheckBox Margin="4" Content="Option 2" />
<CheckBox Margin="4" Content="Option 3" />
</StackPanel>
</Expander>
</Grid>
</Grid>
The output is:
Screenshot
How can I implement this feature? Is there a preferable way to display a table?

XAML Ellipse relative size

I want to make the size of an ellipse relative to its holding grids Column and Row size.
So, the size of the ellipses should change relative to the size of the page (device) of the given hardware..
Something like 'Inherit' from css.
Is this possible?
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="1*" />
<RowDefinition Height="10*" />
<RowDefinition Height="10*" />
<RowDefinition Height="1*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="3*" />
<ColumnDefinition Width="4*" />
<ColumnDefinition Width="4*" />
<ColumnDefinition Width="3*" />
</Grid.ColumnDefinitions>
<Ellipse Fill="DarkGray" Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="2" Stroke="Black" VerticalAlignment="Center" HorizontalAlignment="Center" Width="200" Height="200" />
<Ellipse Fill="DarkGray" Height="200" Width="200" Grid.Row="2" Grid.Column="1" Stroke="Black" VerticalAlignment="Center" HorizontalAlignment="Center" />
<Ellipse Fill="DarkGray" Height="200" Width="200" Grid.Row="2" Grid.Column="2" Stroke="Black" VerticalAlignment="Center" HorizontalAlignment="Center" />
<TextBlock Grid.Column="1" Grid.Row="1" Grid.ColumnSpan="2" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Center" HorizontalAlignment="Center"/>
<TextBlock Grid.Column="1" Grid.Row="2" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Center" HorizontalAlignment="Center"/>
<TextBlock Grid.Column="2" Grid.Row="2" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Center" HorizontalAlignment="Center"/>
</Grid>

Use ViewBox for this purpose. For example, replace the 3rd Ellipse with the following code. It will grows/shrinks with the containing Grid.
<Viewbox Grid.Row="2" Grid.Column="2">
<Ellipse Fill="DarkGray" Height="200" Width="200" Stroke="Black" VerticalAlignment="Center" HorizontalAlignment="Center" />
</Viewbox>

Event not being called on Grid

Problematic code
<Canvas x:Name="CanvaContainer" Margin="0,0,0,0" Background="Transparent" Height="360" Width="540" MouseMove="CanvaContainer_MouseMove" MouseLeftButtonDown="CanvaContainer_MouseLeftButtonDown" MouseRightButtonDown="CanvaContainer_MouseRightButtonDown">
<Grid x:Name="GridContainer" Background="Transparent" Height="360" Width="540">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Rectangle Grid.Column="0" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="1" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="2" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="3" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="4" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="5" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="6" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="7" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="8" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="9" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="10" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="11" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
</Grid>
</Canvas>
Whole code
<Grid Name="GraphGrid" Background="Transparent" Margin="140,30,0,0" Width="582" Height="620" HorizontalAlignment="Left" VerticalAlignment="Top">
<Border x:Name="CanvasBorder" BorderThickness="1" BorderBrush="Black" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="40,230,0,0" >
<Canvas x:Name="CanvaContainer" Margin="0,0,0,0" Background="Transparent" Height="360" Width="540" MouseMove="CanvaContainer_MouseMove" MouseLeftButtonDown="CanvaContainer_MouseLeftButtonDown" MouseRightButtonDown="CanvaContainer_MouseRightButtonDown">
<Grid x:Name="GridContainer" Background="Transparent" Height="360" Width="540">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Rectangle Grid.Column="0" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="1" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="2" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="3" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="4" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="5" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="6" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="7" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="8" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="9" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="10" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
<Rectangle Grid.Column="11" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"/>
</Grid>
</Canvas>
</Border>
<Border HorizontalAlignment="Left" Height="18" Margin="40,0,0,0" VerticalAlignment="Top" Width="542" BorderBrush="Black" >
<Grid x:Name="gridMonth">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="45" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="45" />
<ColumnDefinition Width="45" />
</Grid.ColumnDefinitions>
<Border Grid.Column="0" BorderBrush="Black" BorderThickness="1,1,1,0" CornerRadius="1" >
<TextBlock Text="{Binding sSep, Source={StaticResource Resources}}" HorizontalAlignment="Center"/>
</Border>
<Border Grid.Column="1" BorderBrush="Black" BorderThickness="1,1,1,0" CornerRadius="1" >
<TextBlock Text="{Binding sOct, Source={StaticResource Resources}}" HorizontalAlignment="Center"/>
</Border>
<Border Grid.Column="2" BorderBrush="Black" BorderThickness="1,1,1,0" CornerRadius="1" >
<TextBlock Text="{Binding sNov, Source={StaticResource Resources}}" HorizontalAlignment="Center"/>
</Border>
<Border Grid.Column="3" BorderBrush="Black" BorderThickness="1,1,1,0" CornerRadius="1" >
<TextBlock Text="{Binding sDec, Source={StaticResource Resources}}" HorizontalAlignment="Center"/>
</Border>
<Border Grid.Column="4" BorderBrush="Black" BorderThickness="1,1,1,0" CornerRadius="1" >
<TextBlock Text="{Binding sJan, Source={StaticResource Resources}}" HorizontalAlignment="Center"/>
</Border>
<Border Grid.Column="5" BorderBrush="Black" BorderThickness="1,1,1,0" CornerRadius="1" >
<TextBlock Text="{Binding sFeb, Source={StaticResource Resources}}" HorizontalAlignment="Center"/>
</Border>
<Border Grid.Column="6" BorderBrush="Black" BorderThickness="1,1,1,0" CornerRadius="1" >
<TextBlock Text="{Binding sMar, Source={StaticResource Resources}}" HorizontalAlignment="Center"/>
</Border>
<Border Grid.Column="7" BorderBrush="Black" BorderThickness="1,1,1,0" CornerRadius="1" >
<TextBlock Text="{Binding sApr, Source={StaticResource Resources}}" HorizontalAlignment="Center"/>
</Border>
<Border Grid.Column="8" BorderBrush="Black" BorderThickness="1,1,1,0" CornerRadius="1" >
<TextBlock Text="{Binding sMay, Source={StaticResource Resources}}" HorizontalAlignment="Center"/>
</Border>
<Border Grid.Column="9" BorderBrush="Black" BorderThickness="1,1,1,0" CornerRadius="1" >
<TextBlock Text="{Binding sJune, Source={StaticResource Resources}}" HorizontalAlignment="Center"/>
</Border>
<Border Grid.Column="10" BorderBrush="Black" BorderThickness="1,1,1,0" CornerRadius="1" >
<TextBlock Text="{Binding sJul, Source={StaticResource Resources}}" HorizontalAlignment="Center"/>
</Border>
<Border Grid.Column="11" BorderBrush="Black" BorderThickness="1,1,1,0" CornerRadius="1" >
<TextBlock Text="{Binding sAug, Source={StaticResource Resources}}" HorizontalAlignment="Center"/>
</Border>
</Grid>
</Border>
<Border BorderBrush="Black" BorderThickness="0" HorizontalAlignment="Left" Height="480" Margin="0,230,0,0" VerticalAlignment="Top" Width="40">
<Grid x:Name="depthLeader">
<Grid.RowDefinitions>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
<RowDefinition Height="30"/>
</Grid.RowDefinitions>
<Border Grid.Row="0" BorderBrush="Black" BorderThickness="1,1,0,1" CornerRadius="3">
<TextBlock Name="depth0" Text="-0,25m" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<Border Grid.Row="1" BorderBrush="Black" BorderThickness="1,1,0,1" CornerRadius="3">
<TextBlock Name="depth1" Text="-0,5m" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<Border Grid.Row="2" BorderBrush="Black" BorderThickness="1,1,0,1" CornerRadius="3">
<TextBlock Name="depth2" Text="-0,75m" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<Border Grid.Row="3" BorderBrush="Black" BorderThickness="1,1,0,1" CornerRadius="3">
<TextBlock Name="depth3" Text="-1m" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<Border Grid.Row="4" BorderBrush="Black" BorderThickness="1,1,0,1" CornerRadius="3">
<TextBlock Name="depth4" Text="-1,5m" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<Border Grid.Row="5" BorderBrush="Black" BorderThickness="1,1,0,1" CornerRadius="3">
<TextBlock Name="depth5" Text="-2m" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<Border Grid.Row="6" BorderBrush="Black" BorderThickness="1,1,0,1" CornerRadius="3">
<TextBlock Name="depth6" Text="-2,5m" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<Border Grid.Row="7" BorderBrush="Black" BorderThickness="1,1,0,1" CornerRadius="3">
<TextBlock Name="depth7" Text="-3m" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<Border Grid.Row="8" BorderBrush="Black" BorderThickness="1,1,0,1" CornerRadius="3">
<TextBlock Name="depth8" Text="-3,5m" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<Border Grid.Row="9" BorderBrush="Black" BorderThickness="1,1,0,1" CornerRadius="3">
<TextBlock Name="depth9" Text="-4m" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<Border Grid.Row="10" BorderBrush="Black" BorderThickness="1,1,0,1" CornerRadius="3">
<TextBlock Name="depth10" Text="-4,5m" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
<Border Grid.Row="11" BorderBrush="Black" BorderThickness="1,0,0,1" CornerRadius="3">
<TextBlock Name="depth11" Text="-5m" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
</Grid>
</Border>
<Button Margin="20,-10,542,590" Name="nextMonth" Content=">" Background="LightGray" Width="20" Height="20" Click="nextMonth_Click"/>
<Button Margin="0,-10,562,590" Name="previousMonth" Content="<" Background="LightGray" Width="20" Height="20" Click="previousMonth_Click"/>
<Grid x:Name="AirTempGd" Background="Transparent" HorizontalAlignment="Left" Height="175" Margin="10,20,0,0" VerticalAlignment="Top" Width="572"/>
</Grid>
That would be the code I'm working one, I gave it to you all so you will get the context better. So my problem is the mouse enter event is not being called I,ve tried with breakpoint to console output and it's never getting called I don't know why I've also tried other event like MouseDown or MouseLeave and it's not working yet even with the background being transparent I have no clue where's my problem I could use some help.
EDIT
I may be wrong but I think it because it being in another container but I don't know if it's the problem and if it's I don't know how to fix it except removing container but I need them. But it would be stupid if this is the error so I would be surprised.

Reason is your rectangle is missing content. Simple fix is to fill it with transparent color
<Rectangle Fill="Transparent" Grid.Column="0" Height="{Binding ElementName=CanvaContainer, Path=ActualHeight}" MouseEnter="Rectangle_MouseEnter"

Scrollviewer visibility after debugging

I have a WPF Application. I added a scrollviewer to a window. However I can see the scrollviewer during the design. When I debug the project then the scrollviewer does not seem...
There is the code
</local:WorkControl.DataContext>
<ScrollViewer HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Visible">
<Grid Name="mainGrid" VerticalAlignment="Top">
<Grid.Background>
<ImageBrush Stretch="Fill" TileMode="FlipXY" Viewport="0,0,1479,437" ViewportUnits="Absolute" />
</Grid.Background>
<DockPanel HorizontalAlignment="Stretch" Margin="1,1,1,1" Name="dockPanel1" VerticalAlignment="Top" Width="Auto">
<Grid Name="grid1" Width="Auto" Margin="0" VerticalAlignment="Top" DockPanel.Dock="Top" OpacityMask="Black" ShowGridLines="False" OverridesDefaultStyle="False">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="250" />
<ColumnDefinition Width="310" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="40" />
<RowDefinition Height="123" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Border Grid.ColumnSpan="3" BorderBrush="Silver" BorderThickness="1" HorizontalAlignment="Left" Margin="2" Name="borAdrTopR" VerticalAlignment="Top" CornerRadius="5"
AllowDrop="False">
<Canvas Width="834" Height="40" HorizontalAlignment="Stretch" Margin="0" VerticalAlignment="Stretch" Name="panelTop" ContextMenuOpening="panelTop_ContextMenuOpening">
<TextBlock Name="txAdrID" Canvas.Left="11" Canvas.Top="11" Height="20" Text="AdrID:" Width="44" Foreground="Silver" FontWeight="Bold" />
<TextBox Text="{Binding [AdrID]}" Height="20" HorizontalAlignment="Right" Margin="0,11,602,0" Name="tbAdrID" Width="86" VerticalAlignment="Top" FontWeight="Bold"
VerticalContentAlignment="Top" Foreground="Silver" Canvas.Left="54" Canvas.Top="-1" Padding="1" BorderThickness="0" IsReadOnly="True" Background="{x:Null}" />
<TextBlock Canvas.Left="488" Canvas.Top="11" Height="20" Text="Adresspool:" Width="70" TextAlignment="Right" />
<CheckBox Canvas.Left="570" Canvas.Top="11" Content="MSS" Height="16" Name="chkMSSPool" Checked="chkPool_Checked" Unchecked="chkPool_Checked" />
<CheckBox Canvas.Left="620" Canvas.Top="11" Content="GMM" Height="16" Name="chkGMMPool" Checked="chkPool_Checked" Unchecked="chkPool_Checked" />
<CheckBox Canvas.Left="675" Canvas.Top="11" Content="MZ" Height="16" Name="chkMZPool" Checked="chkPool_Checked" Unchecked="chkPool_Checked" IsEnabled="False" />
<CheckBox Canvas.Left="728" Canvas.Top="11" Content="Sage" Height="16" Name="chkSagePool" Checked="chkPool_Checked" Unchecked="chkPool_Checked" />
<CheckBox Canvas.Left="780" Canvas.Top="11" Content="Web" Height="16" Name="chkMyMalikPool" IsEnabled="False" Checked="chkPool_Checked" Unchecked="chkPool_Checked" />
<TextBox Background="{x:Null}" BorderThickness="0" Canvas.Left="367" Canvas.Top="9" FontWeight="Bold" Foreground="Red" Height="21" IsReadOnly="True" Name="tbSecInfo"
Padding="1" Text="" VerticalContentAlignment="Top" Width="101" />
<Image Canvas.Left="268" Canvas.Top="11" Height="16" Name="imgCRMstatus" Stretch="None" Width="96" MouseLeftButtonUp="imgCRMstatus_MouseClick"
MouseRightButtonUp="imgCRMstatus_MouseClick" />
<Label Canvas.Left="257" Canvas.Top="17" Height="11" Name="lbCRMStatus" Width="9" IsEnabled="False" />
<Image Canvas.Left="466" Canvas.Top="7" Height="24" Name="imgSec" Stretch="None" Width="24" MouseRightButtonUp="imgSec_MouseClick" MouseLeftButtonUp="imgSec_MouseClick"
Visibility="Hidden" />
</Canvas>
</Border>
<Border Grid.Row="1" BorderBrush="Silver" BorderThickness="1" HorizontalAlignment="Left" Name="borAddress" VerticalAlignment="Top" CornerRadius="5" Background="White"
AllowDrop="False">
<FlowDocumentScrollViewer HorizontalAlignment="Left" Name="fdocview" VerticalAlignment="Top" Height="Auto" VerticalScrollBarVisibility="Auto" Background="#FFFFFFF9"
Margin="2" HorizontalContentAlignment="Left" Padding="0" MinHeight="118">
<FlowDocument TextAlignment="Left" FontSize="12" PagePadding="5">
<FlowDocument.Resources>
<Style TargetType="{x:Type Paragraph}">
<Setter Property="FontSize" Value="13" />
<Setter Property="Foreground" Value="DarkBlue" />
<Setter Property="FontFamily" Value="Trebuchet MS" />
<Setter Property="Margin" Value="0,0,0,0" />
</Style>
</FlowDocument.Resources>
<Paragraph>ViewControl...mmm</Paragraph>
</FlowDocument>
</FlowDocumentScrollViewer>
</Border>
<Border Grid.Row="1" Grid.Column="1" BorderBrush="Silver" BorderThickness="1" Padding="3" Name="borAdrInfoLeft" CornerRadius="6" AllowDrop="False">
<Grid VerticalAlignment="Top">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="73" />
<ColumnDefinition />
<ColumnDefinition Width="35" />
<ColumnDefinition Width="45" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="28" />
<RowDefinition Height="28" />
<RowDefinition Height="28" />
<RowDefinition Height="28" />
</Grid.RowDefinitions>
<local:ComboBoxCW Grid.Column="1" Grid.Row="0" Grid.ColumnSpan="2" x:Name="cbAdrTypeID" CWListName="Adresstypen" Background="#FFC8D2E8"
SelectedID="{Binding Path=[AdrTypeID]}" SelectionChanged="cwAdrType_SelectionChanged" Margin="0,0,0,3" />
<local:ComboBoxCW Grid.Column="1" Grid.Row="1" Grid.ColumnSpan="3" x:Name="cbGruppenID" SelectedID="{Binding [GruppenID]}" CWListName="Gruppen" Background="#FFC8D2E8"
CWListArt="withall" CWListFilter="M" Margin="0,0,0,3" />
<TextBlock Grid.Column="3" Grid.Row="0" Name="txtBedeutung" Text="$$" Width="22" TextAlignment="Center" VerticalAlignment="Center" />
<TextBox Grid.Column="1" Grid.Row="2" Name="tbKundenNr" Canvas.Left="83" Text="{Binding [KundenNr]}" BorderBrush="#96000000" MaxLength="30" Margin="0,0,0,3" />
<TextBox Grid.Column="3" Grid.Row="2" Name="tbCRA" Text="{Binding [CRA]}" BorderBrush="#96000000" IsReadOnly="True" Margin="0,0,0,3" />
<local:ComboBoxCW Grid.Column="1" Grid.Row="3" x:Name="cwSprachID" SelectedID="{Binding [SprachID],Mode=TwoWay}" CWListName="Sprachen" CWListArt="withempty"
Margin="0,0,0,3" />
<ComboBox Grid.Column="3" Grid.Row="3" Name="cbBedeutung" Text="{Binding Path=[Bedeutung]}">
<ComboBoxItem Content=" " />
<ComboBoxItem Content="A" />
<ComboBoxItem Content="B" />
<ComboBoxItem Content="C" />
</ComboBox>
<TextBlock Grid.Column="0" Grid.Row="0" Text="Adressart" />
<TextBlock Grid.Column="0" Grid.Row="1" Text="Gruppe" />
<TextBlock Grid.Column="0" Grid.Row="2" Text="Kundennr." />
<TextBlock Grid.Column="2" Grid.Row="2" Text="CRA" TextAlignment="Right" />
<TextBlock Grid.Column="0" Grid.Row="3" Text="Sprache" />
<TextBlock Grid.Column="2" Grid.Row="3" Text="Bed." TextAlignment="Right" />
</Grid>
</Border>
<Border Grid.Row="1" Grid.Column="2" BorderBrush="Silver" BorderThickness="1" Padding="3" Name="borAdrInfoRight" CornerRadius="6" AllowDrop="False">
<Grid VerticalAlignment="Top">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="73" />
<ColumnDefinition />
<ColumnDefinition Width="35" />
<ColumnDefinition Width="30" />
<ColumnDefinition Width="30" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="28" />
<RowDefinition Height="28" />
<RowDefinition Height="28" />
<RowDefinition Height="28" />
</Grid.RowDefinitions>
<local:ComboBoxCW Grid.Row="0" Grid.Column="1" x:Name="cbAdrStatusID" SelectedID="{Binding [AdrStatusID]}" CWListName="Adressstati" Margin="0,0,0,3"
Background="#FFC8D2E8" />
<TextBox Grid.Row="0" Grid.Column="3" Grid.ColumnSpan="2" Name="tbMZunitID"
Text="{Binding [MZunitID],Mode=OneWay,Converter={StaticResource codetextfromid}, ConverterParameter=MZunits}" Margin="0,0,0,3" BorderBrush="#96000000"
IsReadOnly="True" />
<local:ComboBoxCW Grid.Row="1" Grid.Column="1" Grid.ColumnSpan="3" x:Name="cbBetreuerID" Text="" Background="#FFC8D2E8" CWListName="Mitarbeiter" Margin="0,0,0,3"
SelectedID="{Binding Path=[BetreuerID]}" CWListArt="withall" />
<ListBox Grid.Row="2" Grid.Column="1" Name="listBetreuers" BorderBrush="#96000000" SelectionChanged="listBetreuers_SelectionChanged" Grid.ColumnSpan="3"
Grid.RowSpan="2" Margin="0,0,0,3" />
<Popup Grid.Row="2" Grid.Column="1" Grid.ColumnSpan="3" OpacityMask="#00000000" Name="popAdd" StaysOpen="False" PlacementTarget="{Binding ElementName=listBetreuers}"
Placement="Bottom" HorizontalOffset="-40" VerticalOffset="-20">
<ListBox Height="160" Width="270" HorizontalAlignment="Left" Name="listAdd" VerticalAlignment="Top" SelectionChanged="listAdd_SelectionChanged" />
</Popup>
<Button Grid.Row="3" Grid.Column="4" Content="-" Height="22" Width="22" Name="btnBetreuerDel" Click="btnBetreuerDel_Click" HorizontalAlignment="Right" />
<Button Grid.Row="2" Grid.Column="4" Content="+" Height="22" Width="22" Name="btnBetreuerAdd" Click="btnBetreuerAdd_Click" HorizontalAlignment="Right" />
<Button Grid.Row="1" Grid.Column="4" Content="H" Height="22" Width="22" Name="btnBetreuerHaupt" Click="btnBetreuerHaupt_Click" HorizontalAlignment="Right" />
<TextBlock Grid.Row="0" Grid.Column="0" Text="Status" />
<TextBlock Grid.Row="0" Grid.Column="2" Text="Unit" TextAlignment="Right" Margin="2" />
<TextBlock Name="lbHauptbetrP" Visibility="Visible" Grid.Row="1" Grid.Column="0" Text="Hauptbetr." />
<TextBlock Name="lbHauptbetrF" Visibility="Hidden" Grid.Row="1" Grid.Column="0" Text="Account-Mgr." />
<TextBlock Grid.Row="2" Grid.Column="0" Text="weitere Betreuer" TextWrapping="Wrap" />
</Grid>
</Border>
<!-- ====TAB Firma start -->
<TabControl Grid.Row="2" Grid.ColumnSpan="3" Name="tabReg" Margin="0" SelectionChanged="tabReg_SelectionChanged" VerticalAlignment="Stretch" Padding="2,2">
<TabItem Header="Firma" Name="regFirma" local:HelpProvider.HelpParameter="AddressControl;Firma">
<Grid VerticalAlignment="Top">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition />
</Grid.RowDefinitions>
<!-- ====Firmen-Felder linke Seite -->
<Border Grid.Row="0" Grid.Column="0" BorderBrush="Silver" BorderThickness="1" Padding="3" Name="borFeed0" CornerRadius="6" AllowDrop="False">
<Grid Margin="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="95" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="35" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="50" />
<RowDefinition Height="28" />
<RowDefinition Height="28" />
<RowDefinition Height="28" />
<RowDefinition Height="28" />
<RowDefinition Height="28" />
<RowDefinition Height="38" />
<RowDefinition Height="28" />
<RowDefinition Height="28" />
<RowDefinition Height="28" />
<RowDefinition Height="28" />
<RowDefinition Height="28" />
</Grid.RowDefinitions>
<TextBlock Grid.Column="0" Grid.Row="0" Text="Firma" />
<Button Name="btnLinkFirma" Height="23" Width="23" ToolTip="Mit Firma verknüpfen..." Click="btnLinkFirma_Click" Grid.Column="0" Grid.Row="0"
HorizontalAlignment="Right" VerticalAlignment="Top" Margin="0,0,5,0">
<Button.Content>
<Image Source="Images/Verknuepfung_32.png" />
</Button.Content>
</Button>
<TextBox Name="tbFirma" Grid.Column="1" Grid.Row="0" Grid.ColumnSpan="2" Margin="0,0,0,3" Text="{Binding Path=[Firma]}" BorderBrush="#96000000"
MouseDoubleClick="tbFirma_MouseDoubleClick" MaxLength="80" AcceptsReturn="True" />
<TextBox x:Name="tbFirmazusatz" Grid.Column="1" Grid.Row="1" Grid.ColumnSpan="2" Margin="0,0,0,3" Text="{Binding Path=[Firmazusatz]}" BorderBrush="#96000000"
MaxLength="50" />
There are more codes

Adding to Aghilas's answer
If you have set HorizontalScrollBarVisibility, VerticalScrollBarVisibility properties to 'Auto', try setting them to Visible.

Categories