Good day!
Strange square appears on mouse hover on text boxes, buttons, etc (something like hint) in a silverlight navigation application - how can I remove it?
A print screen
http://i34.photobucket.com/albums/d126/durick/bug.jpg
I've colored the square at a picture. It appears when the mouse hover.
an example .xaml page:
<Code:BasePage x:Class="CAP.Views.Main"
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"
mc:Ignorable="d"
xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
xmlns:Code="clr-namespace:CAP.Code"
d:DesignWidth="640" d:DesignHeight="480"
Title="Личный кабинет клиентов ООО АУРИТ">
<Grid x:Name="LayoutRoot">
<Grid.RowDefinitions>
<RowDefinition Height="103*" />
<RowDefinition Height="377*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="120*" />
<ColumnDefinition Width="520*" />
</Grid.ColumnDefinitions>
<Image Height="85" HorizontalAlignment="Left" Name="image1" Stretch="Fill" VerticalAlignment="Top" Width="84" Margin="12,0,0,0" ImageFailed="image1_ImageFailed" Source="/CAP;component/Images/My-Computer.png" />
<TextBlock Grid.Column="1" Height="Auto" TextWrapping="Wrap" HorizontalAlignment="Left" Margin="0,12,0,0" Name="textBlock1" Text="Good day!" VerticalAlignment="Top" FontFamily="Verdana" FontSize="16" Width="345" FontWeight="Bold" />
<TextBlock Grid.Column="1" Grid.Row="1" TextWrapping="Wrap" Height="299" HorizontalAlignment="Left" Name="textBlock2" VerticalAlignment="Top" FontFamily="Verdana" FontSize="14" Width="441" >
<Run Text="Some text "/><LineBreak/><LineBreak/><Run Text="and so on"/>
<LineBreak/>
</TextBlock>
</Grid>
.cs:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Windows.Navigation;
using CAP.Code;
namespace CAP.Views
{
public partial class Main : BasePage
{
public Main() : base()
{
InitializeComponent();
MapBuilder.AddToMap(new SiteMapUnit() { Caption = "Главная", RelativeUrl = "Main" },true);
((App)Application.Current).Mainpage.tvMainMenu.SelectedItems.Clear();
}
// Executes when the user navigates to this page.
protected override void OnNavigatedTo(NavigationEventArgs e)
{
}
private void image1_ImageFailed(object sender, ExceptionRoutedEventArgs e)
{
}
protected override string[] NeededPermission()
{
return new string[0];
}
}
}
MainPage.xaml
<UserControl
x:Class="CAP.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:Code="clr-namespace:CAP.Code"
xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
xmlns:uriMapper="clr-namespace:System.Windows.Navigation;assembly=System.Windows.Controls.Navigation"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls"
xmlns:telerikNavigation="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation"
mc:Ignorable="d" Margin="0,0,0,0" Width="auto" Height="auto" xmlns:dataInput="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data.Input">
<ScrollViewer Width="auto" Height="auto" BorderBrush="White" BorderThickness="0" Margin="0,0,0,0" x:Name="sV" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" >
<ScrollViewer.Content>
<Grid Width="auto" Height="auto" x:Name="LayoutRoot" Style="{StaticResource LayoutRootGridStyle}" Margin="0,0,0,0">
<StackPanel Width="auto" Height="auto" Orientation="Vertical" Margin="250,0,0,50">
<Border x:Name="ContentBorder2" Margin="0,0,0,0" >
<!--<navigation:Frame Margin="0,0,0,0" Width="auto" Height="auto" x:Name="AnotherFrame" VerticalAlignment="Top" Style="{StaticResource ContentFrameStyle}" Source="/Views/Menu.xaml" NavigationFailed="ContentFrame_NavigationFailed" JournalOwnership="OwnsJournal" Loaded="AnotherFrame_Loaded">
</navigation:Frame>-->
<StackPanel Orientation="Vertical" Height="82" Width="Auto" HorizontalAlignment="Right" Margin="0,0,0,0" DataContext="{Binding}">
<TextBlock HorizontalAlignment="Right" Foreground="White" x:Name="ApplicationNameTextBlock4" Style="{StaticResource ApplicationNameStyle}" FontSize="20"
Text="Личный кабинет" Margin="20,16,20,0"/>
<StackPanel Orientation="Horizontal" HorizontalAlignment="Right">
<Image x:Name="imDoor" Visibility="Collapsed" MouseEnter="imDoor_MouseEnter" MouseLeave="imDoor_MouseLeave" Height="24" Stretch="Fill" Width="25" Margin="10,0,10,0" Source="/CAP;component/Images/sm_white_doors.png" MouseLeftButtonDown="bTest_Click" />
<TextBlock x:Name="bLogout" MouseEnter="bLogout_MouseEnter" MouseLeave="bLogout_MouseLeave" TextDecorations="Underline" Margin="0,6,20,4" Height="23" Text="Выйти" HorizontalAlignment="Right" Visibility="Collapsed" MouseLeftButtonDown="bTest_Click" FontFamily="Verdana" FontSize="13" FontWeight="Normal" Foreground="#FF1C1C92" />
</StackPanel>
</StackPanel>
</Border>
<Border x:Name="bSiteMap" Margin="0,0,0,0" >
<StackPanel x:Name="spSiteMap" Orientation="Horizontal" Height="20" Width="Auto" HorizontalAlignment="Left" Margin="0,0,0,0" DataContext="{Binding}">
<!-- <TextBlock Visibility="Visible" TextDecorations="Underline" Height="23" HorizontalAlignment="Left" x:Name="ar" Text="1" VerticalAlignment="Top" Foreground="Blue" FontFamily="Verdana" FontSize="13" />
<TextBlock Visibility="Visible" Height="23" HorizontalAlignment="Left" x:Name="Map" Text="->" VerticalAlignment="Top" Foreground="Blue" FontFamily="Verdana" FontSize="13" />
<TextBlock Visibility="Visible" TextDecorations="Underline" Height="23" HorizontalAlignment="Left" x:Name="ar1" Text="2" VerticalAlignment="Top" Foreground="Blue" FontFamily="Verdana" FontSize="13" />
<TextBlock Visibility="Visible" Height="23" HorizontalAlignment="Left" x:Name="Map1" Text="->" VerticalAlignment="Top" Foreground="Blue" FontFamily="Verdana" FontSize="13" />
<TextBlock Visibility="Visible" TextDecorations="Underline" Height="23" HorizontalAlignment="Left" x:Name="ar2" Text="3" VerticalAlignment="Top" Foreground="Blue" FontFamily="Verdana" FontSize="13" />-->
</StackPanel>
</Border>
<Border Width="auto" Height="auto" x:Name="ContentBorder" Margin="0,0,0,0" >
<navigation:Frame x:Name="ContentFrame" Style="{StaticResource ContentFrameStyle}"
Source="Main" Navigated="ContentFrame_Navigated" NavigationFailed="ContentFrame_NavigationFailed" ToolTipService.ToolTip=" " Margin="0,0,0,0">
<navigation:Frame.UriMapper>
<uriMapper:UriMapper>
<!--Client-->
<uriMapper:UriMapping Uri="RegistrateClient" MappedUri="/Views/Client/RegistrateClient.xaml"/>
<!--So on-->
</uriMapper:UriMapper>
</navigation:Frame.UriMapper>
</navigation:Frame>
</Border>
</StackPanel>
<Grid x:Name="NavigationGrid" Style="{StaticResource NavigationGridStyle}" Margin="0,0,0,0" Background="{x:Null}" >
<StackPanel Orientation="Vertical" Height="Auto" Width="250" HorizontalAlignment="Center" Margin="0,0,0,50" DataContext="{Binding}">
<Image Width="150" Height="90" HorizontalAlignment="Center" VerticalAlignment="Top" Source="/CAP;component/Images/logo__au.png" Margin="0,20,0,70"/>
<Border x:Name="BrandingBorder" MinHeight="222" Width="250" Style="{StaticResource BrandingBorderStyle3}" HorizontalAlignment="Center" Opacity="60" Margin="0,0,0,0">
<Border.Background>
<ImageBrush ImageSource="/CAP;component/Images/papka.png"/>
</Border.Background>
<Grid Width="250" x:Name="LichniyCabinet" Margin="0,10,0,0" HorizontalAlignment="Center" Height="211">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="19*" />
<ColumnDefinition Width="62*" />
<ColumnDefinition Width="151*" />
<ColumnDefinition Width="18*" />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="13" />
<RowDefinition Height="24" />
<RowDefinition Height="35" />
<RowDefinition Height="35" />
<RowDefinition Height="43" />
<RowDefinition Height="28" />
<RowDefinition Height="32*" />
</Grid.RowDefinitions>
<TextBlock Visibility="Visible" Grid.Row="2" Height="23" HorizontalAlignment="Left" x:Name="tLogin" Text="Логин" VerticalAlignment="Top" FontFamily="Verdana" FontSize="13" Foreground="White" Margin="1,0,0,0" Grid.Column="1" />
<TextBlock Visibility="Visible" FontFamily="Verdana" FontSize="13" Foreground="White" Height="23" HorizontalAlignment="Left" x:Name="tPassw" Text="Пароль" VerticalAlignment="Top" Grid.Row="3" Grid.Column="1" />
<TextBox Visibility="Visible" Grid.Column="2" Grid.Row="2" Height="24" HorizontalAlignment="Left" x:Name="logLogin" VerticalAlignment="Top" Width="150" />
<PasswordBox Visibility="Visible" Code:DefaultButtonService.DefaultButton="{Binding ElementName=bLogin}" PasswordChar="*" Height="24" HorizontalAlignment="Left" x:Name="logPassword" VerticalAlignment="Top" Width="150" Grid.Column="2" Grid.Row="3" />
<Button x:Name="bLogin" MouseEnter="bLogin_MouseEnter" MouseLeave="bLogin_MouseLeave" Visibility="Visible" Content="Войти" Grid.Column="2" Grid.Row="4" Click="Button_Click" Height="23" HorizontalAlignment="Left" Margin="81,0,0,0" VerticalAlignment="Top" Width="70" />
<TextBlock MouseLeftButtonDown="ForgotPassword_MouseLeftButtonDown" MouseEnter="ForgotPassword_MouseEnter" MouseLeave="ForgotPassword_MouseLeave" Visibility="Visible" TextDecorations="Underline" Grid.ColumnSpan="2" Grid.Row="4" Height="23" HorizontalAlignment="Left" x:Name="ForgotPassword" Text="Забыли пароль?" VerticalAlignment="Top" Foreground="White" FontFamily="Verdana" FontSize="13" Grid.Column="1" />
<TextBlock MouseEnter="tbRegistration_MouseEnter" MouseLeave="tbRegistration_MouseLeave" MouseLeftButtonDown="tbRegistration_MouseLeftButtonDown" Grid.Column="2" Grid.Row="6" Height="23" x:Name="tbRegistration" TextDecorations="Underline" Text="Регистрация" VerticalAlignment="Top" FontFamily="Verdana" FontSize="13" TextAlignment="Center" HorizontalAlignment="Center" Foreground="#FF1C1C92" FontWeight="Normal" Margin="0,0,57,0" />
<TextBlock Cursor="Arrow" Height="23" HorizontalAlignment="Left" Margin="11,-3,0,0" Text="Личный кабинет" VerticalAlignment="Top" Grid.ColumnSpan="3" Grid.RowSpan="2" FontFamily="Verdana" FontSize="13" FontWeight="Bold" Foreground="White" />
<Image Visibility="Collapsed" Height="70" x:Name="imUser" Stretch="Fill" Width="70" Grid.ColumnSpan="2" Margin="11,0,0,0" Grid.Row="2" Grid.RowSpan="2" Source="/CAP;component/Images/user2.png" />
<TextBlock x:Name="tbHello" Grid.Column="2" Visibility="Collapsed" Grid.Row="2" Height="auto" TextWrapping="Wrap" HorizontalAlignment="Left" Margin="6,0,0,0" Text="" VerticalAlignment="Top" FontFamily="Verdana" FontSize="13" Foreground="White" Width="145" />
</Grid>
</Border>
<Border x:Name="MenuBorder" Margin="0,0,0,50" Width="250" Visibility="Collapsed">
<StackPanel x:Name="spMenu" Width="240" HorizontalAlignment="Left">
<telerikNavigation:RadTreeView x:Name="tvMainMenu"
Width="240"
Selected="TreeView1_Selected"
SelectedValuePath="Text"
telerik:Theming.Theme="Windows7"
FontFamily="Verdana"
FontSize="12"/>
</StackPanel>
</Border>
</StackPanel>
</Grid>
<Border x:Name="FooterBorder" VerticalAlignment="Bottom" Width="auto" Height="76">
<Border.Background>
<ImageBrush ImageSource="/CAP;component/Images/footer2.png" />
</Border.Background>
<TextBlock x:Name="tbFooter" Height="24" Width="auto" Margin="0,20,0,0" TextAlignment="Center" HorizontalAlignment="Stretch" VerticalAlignment="Center" Foreground="White" FontFamily="Verdana" FontSize="11">
</TextBlock>
</Border>
</Grid>
</ScrollViewer.Content>
</ScrollViewer>
</UserControl>
MainPage.xaml.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Navigation;
using CAP.Code;
using CAP.Registrator;
using System.Windows.Input;
using System.ComponentModel.DataAnnotations;
using System.Windows.Browser;
using Telerik.Windows.Controls;
using System.Net;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Navigation;
using System.Windows.Shapes;
namespace CAP
{
public partial class MainPage
{
public App Appvars = Application.Current as App;
private readonly RegistratorClient registrator;
public SiteMapBuilder builder;
public MainPage()
{
InitializeComponent();
sV.SetIsMouseWheelScrollingEnabled(true);
builder = new SiteMapBuilder(spSiteMap);
try
{
//working with service
}
catch
{
this.ContentFrame.Navigate(new Uri(String.Format("ErrorPage"), UriKind.RelativeOrAbsolute));
}
}
/// Recursive method to update the correct scrollviewer (if exists)
private ScrollViewer CheckParent(FrameworkElement element)
{
ScrollViewer _result = element as ScrollViewer;
if (element != null && _result == null)
{
FrameworkElement _temp = element.Parent as FrameworkElement;
_result = CheckParent(_temp);
}
return _result;
}
// If an error occurs during navigation, show an error window
private void ContentFrame_NavigationFailed(object sender, NavigationFailedEventArgs e)
{
e.Handled = true;
ChildWindow errorWin = new ErrorWindow(e.Uri);
errorWin.Show();
}
}
}
here it is a screen shot
http://i34.photobucket.com/albums/d126/durick/1-1.gif
i've solved the problem!!!
it was only a property ToolTipService.ToolTip=" " of Navigation:Frame
!!!!!!!!!!!!!!!!!!!!!!
Related
I am working on small wpf application and I can say this is my first wpf application
from the beginning.
I have problem here because I want to glue two labels together (see image below), because when I run app on smaller or bigger monitor they will be too much away from each other, and what I Want to do is to keep them together all the time and verticaly centered, so thats reason why I created grid and why I put stack panel inside, so maybe I could apply verticalalignment = 'center' to stack panel and content would be centered or whatever?
I am not sure is this code ok, so please guys comment it, I want to improve my skills about
WPF, so be free to tell me another solutions or whatever, maybe I wrote too much code or smth?
Anyway, how could I glue up this two labes to keep them near each other all the time and to keep them also centered all the time on different size of monitors.
Thanks a lot guys,
Cheers!
MY CODE:
<Window x:Class="xTouchPOS.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525" WindowStartupLocation="CenterScreen" WindowState="Maximized" WindowStyle="None">
<Grid>
<!-- Definition of my Grid which contains 2 columns and 3 rows. -->
<Grid.ColumnDefinitions>
<ColumnDefinition Width="3.5*"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" MinHeight="65"/>
<RowDefinition Height="*"/>
<RowDefinition Height="0.143*" />
</Grid.RowDefinitions>
<!-- Added this rectangle to colour header of my Grid. -->
<Rectangle Grid.ColumnSpan="3">
<Rectangle.Fill>
<SolidColorBrush Color="#0091EA"></SolidColorBrush>
</Rectangle.Fill>
</Rectangle>
<!-- Added this grid and stackpanel inside this grid to place date and time, but how to glue them together text and value -->
<Grid Grid.Column="1" Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0" Orientation="Vertical">
<Label x:Name="lblTimeText" Content="Time" Margin="0,0,0,0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" VerticalAlignment="Bottom" />
<Label x:Name="lblTime" Content="labelTime" Grid.Column="0" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
<StackPanel Grid.Column="1" Orientation="Vertical">
<Label Name="lblDateText" Content="Date" Margin="0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
<Label Name="lblDate" Content="labelaDate" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
</Grid>
</Grid>
</Window>
CODE BEHIND:
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
lblDate.Content = DateTime.Now.Date.ToString("MM/dd/yyyy");
lblTime.Content = DateTime.Now.ToString("HH:mm:ss");
}
}
If you change your Labels to TextBlocks, I think you will get what you are looking for. You will need to change the column definition.
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<!-- Definition of my Grid which contains 2 columns and 3 rows. -->
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1.75*"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" MinHeight="65"/>
<RowDefinition Height="*"/>
<RowDefinition Height="0.143*" />
</Grid.RowDefinitions>
<!-- Added this rectangle to colour header of my Grid. -->
<Rectangle Grid.ColumnSpan="3">
<Rectangle.Fill>
<SolidColorBrush Color="#0091EA"></SolidColorBrush>
</Rectangle.Fill>
</Rectangle>
<!-- Added this grid and stackpanel inside this grid to place date and time, but how to glue them together text and value -->
<Grid Grid.Column="1" Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0" Orientation="Vertical" VerticalAlignment="Center">
<TextBlock x:Name="lblTimeText" Text="Time" Margin="0,0,0,0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" VerticalAlignment="Bottom" />
<TextBlock x:Name="lblTime" Text="labelTime" Grid.Column="0" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
<StackPanel Grid.Column="1" Orientation="Vertical" VerticalAlignment="Center">
<TextBlock Name="lblDateText" Text="Date" Margin="0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
<TextBlock Name="lblDate" Text="labelaDate" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
</Grid>
</Grid>
</Window>
Alternative
If you want to slim down your XAML, this will give the same result. It will also lock the two stack panels to the top right. Replace your Second Grid with this block
<DockPanel Grid.Row="0" Grid.ColumnSpan="2">
<StackPanel Orientation="Vertical" VerticalAlignment="Center" HorizontalAlignment="Right" DockPanel.Dock="Right" Margin="5,0">
<TextBlock Name="lblDateText" Text="Date" Margin="0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
<TextBlock Name="lblDate" Text="labelaDate" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
<StackPanel Orientation="Vertical" VerticalAlignment="Center" HorizontalAlignment="Right" DockPanel.Dock="Right" Margin="5,0">
<TextBlock x:Name="lblTimeText" Text="Time" Margin="0,0,0,0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" VerticalAlignment="Bottom" />
<TextBlock x:Name="lblTime" Text="labelTime" Grid.Column="0" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
</DockPanel>
Add other stackPanel with Orientation="Horizontal"
<StackPanel Grid.Column="0" Orientation="Horizontal" >
<StackPanel Orientation="Vertical">
<Label x:Name="lblTimeText" Content="Time" Margin="0,0,0,0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" VerticalAlignment="Bottom" />
<Label x:Name="lblTime" Content="labelTime" Grid.Column="0" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
<StackPanel Orientation="Vertical">
<Label Name="lblDateText" Content="Date" Margin="0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
<Label Name="lblDate" Content="labelaDate" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
Other solution:you can use run
<TextBlock Grid.Column="1">
<TextBlock TextWrapping="Wrap" >
<Run x:Name="lblTimeText" />
<Run x:Name="lblTime"/>
</TextBlock>
</TextBlock>
I have a XAML window that the layout is done using a main grid. The problem is when the browser is resized the controls in the second and third columns move to the right and the window's layout is no longer correct. I have pasted the XAML below. I think the layout of a WPF window should be grid based with all controls residing in the window's master grid. Is this the proper layout design for WPF or is there a different recommended layout pattern?
<Window x:Class="MasterPage.Intake1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:v="clr-namespace:MasterPage.View"
Title="Intake 1" Height="900" Width="1000" Background="#FFD9DDE8" >
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="35*"/>
<RowDefinition Height="45*"/>
<RowDefinition Height="190*"/>
<RowDefinition Height="275*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="500*"/>
<ColumnDefinition Width="300*"/>
<ColumnDefinition Width="250*"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0" Grid.ColumnSpan="3" Grid.Row="0">
<Image Source="Images\header.jpg" Height="47" Margin="0,0,0,0" />
</StackPanel>
<StackPanel HorizontalAlignment="Left" Grid.Column="0" Height="80" Width="350" Grid.ColumnSpan="1" Grid.Row="1" Margin="0,-23,0,0">
<Image Source="Images\DSPASS_logo.png" Stretch="Fill" DockPanel.Dock="Top" Height="70" />
</StackPanel>
<StackPanel Grid.Column="4" Grid.Row="1" Grid.ColumnSpan="1" Margin="0,0,0,0">
<TextBlock FontSize="15" Margin="0,0,0,0" Height="25" Width="300" TextWrapping="WrapWithOverflow">
<Label FontSize="10" Name="Namelabel" Width="250" FontWeight="Bold" Foreground="#1664A1" Content="Welcome to DS PASS:"/>
</TextBlock>
</StackPanel>
<StackPanel Grid.Column="0" Grid.Row="2" HorizontalAlignment="Left" Margin="10,10,0,0" Height="290" Width="975" VerticalAlignment="Top" Grid.ColumnSpan="3" Grid.RowSpan="1">
<Label Height="36" FontSize="16" Content="Post Identification" Background="#FF014E7E" FontWeight="Bold" Foreground="White" Margin="-5,0,-18,0"/>
<StackPanel x:Name="_wordLength" Orientation="Horizontal" Margin="235,0,200,0">
<TextBlock Height="20" x:Name="ApplicantType_TextBlock" Text="Applicant Type" Width="110" Margin="5" TextAlignment="Right"/>
<ComboBox Height="25" x:Name="textBoxWordLength" Width="400" Margin="10,5"/>
</StackPanel>
<StackPanel x:Name="_integerWordLength" Orientation="Horizontal" Margin="235,0,200,0">
<TextBlock Height="20" x:Name="textBlockIntegerWordLength" Text="Person Type" Width="110" Margin="5" TextAlignment="Right"/>
<ComboBox Height="25" x:Name="textBoxIntegerWordLength" Width="400" Margin="10,5"/>
</StackPanel>
<StackPanel x:Name="_Post" Orientation="Horizontal" Margin="235,0,200,20">
<TextBlock Height="20" x:Name="Post_TextBlock" Text="Post" Width="110" Margin="5" TextAlignment="Right"/>
<ComboBox Height="25" x:Name="Post_TextBox" Width="400" Margin="10,5"/>
</StackPanel>
</StackPanel>
<StackPanel Grid.Column="0" Grid.Row="3" HorizontalAlignment="Left" Height="130" Margin="15,-120,0,0" VerticalAlignment="Top" Grid.ColumnSpan="3" >
<Label Height="36" FontSize="16" Content="Applicant Employment" Background="#FF004A78" FontWeight="Bold" Foreground="White" Margin="-5,0,-18,0"/>
<StackPanel x:Name="_max1" Orientation="Vertical" Margin="1,0,355,0">
<TextBlock Height="20" x:Name="maxTextBlock1" Text="Employee ID" Width="100" Foreground="Black" Margin="0,15,459,5" TextAlignment="Right"/>
<TextBox Height="25" x:Name="maxTextBox1" Width="400" Margin="0,-5,90,25"/>
</StackPanel>
</StackPanel>
<StackPanel Grid.Column="0" Grid.Row="4" Grid.ColumnSpan="3" Orientation="Vertical" HorizontalAlignment="Left" Height="330" Margin="0,10,0,0" VerticalAlignment="Top" Width="965" Grid.RowSpan="2">
<Label Height="36" FontSize="16" Content="English Version of Name" Background="#FF005183" Grid.Row="4" FontWeight="Bold" Margin="10,10,0,0" Foreground="White" Padding="4,5,5,5"/>
<StackPanel x:Name="_LastName" Orientation="Vertical">
<TextBlock Height="20" x:Name="LastName_TextBlock" Text="Last Name/Surname" Margin="55,5,459,5" TextAlignment="Left"/>
<TextBox Height="25" x:Name="LastName_TextBox" Width="500" Margin="55,5,459,5"/>
</StackPanel>
<StackPanel x:Name="_FirstName" Orientation="Vertical">
<TextBlock Height="20" x:Name="FirstName_TextBlock" Text="First Name" Margin="55,0,459,0" TextAlignment="Left"/>
<TextBox Height="25" x:Name="FirstName_TextBox" Width="500" Margin="55,0,459,0"/>
</StackPanel>
<StackPanel x:Name="_MiddleName" Orientation="Vertical">
<TextBlock Height="20" x:Name="MiddleName_TextBlock" Text="Middle Name" Margin="55,5,459,5" TextAlignment="Left"/>
<TextBox Height="25" x:Name="MiddleName_TextBox" Width="500" Margin="55,5,459,5"/>
</StackPanel>
<StackPanel x:Name="_ExtendedName" Orientation="Vertical">
<TextBlock Height="20" x:Name="ExtendedName_TextBlock" Text="Extended name (Tribal, Jr., III, etc.)" Margin="55,5,372,5" TextAlignment="Left"/>
<TextBox Height="25" x:Name="Extended_TextBox" Width="500" Margin="55,5,459,5"/>
</StackPanel>
</StackPanel>
<StackPanel Grid.RowSpan="4" Grid.Column="4" HorizontalAlignment="Left" Height="230" Margin="-250,400,0,0" Width="480" Grid.ColumnSpan="1">
<StackPanel x:Name="_Aliases" Orientation="Vertical" Margin="-15,0,0,0" Height="144">
<TextBlock Height="20" x:Name="Aliases_TextBlock" Text="Aliases" Margin="40,-5,0,5" TextAlignment="Left"/>
<TextBox Height="25" x:Name="Aliases_TextBox" Width="500" Margin="43,5"/>
<TextBox Height="25" x:Name="Aliases_TextBox1" Width="500" Margin="43,5"/>
<TextBox Height="25" x:Name="Aliases_TextBox2" Width="500" Margin="43,5"/>
</StackPanel>
</StackPanel>
<!--<Label HorizontalAlignment="Left" Margin="4,132,0,0" Grid.Row="3" VerticalAlignment="Top" Background="#FF72C772" Grid.ColumnSpan="3" Width="1242" Height="36"/>
<Button Content="Continue" Grid.Column="2" HorizontalAlignment="Left" Margin="16,139,0,0" Grid.Row="3" VerticalAlignment="Top" Width="125" Click="Page1_Continue_Click"/>
<Button Content="Save Draft" Grid.Column="1" HorizontalAlignment="Left" Margin="336,139,0,0" Grid.Row="3" VerticalAlignment="Top" Width="125"/>-->
<Label HorizontalAlignment="Left" Margin="4,400,0,0" Grid.Row="4" VerticalAlignment="Top" Background="#FF52BB52" Grid.ColumnSpan="3" Width="983" Height="36">
</Label>
<Button Content="Save Draft" Grid.Column="1" HorizontalAlignment="Left" Margin="150,408,0,0" Grid.Row="5" VerticalAlignment="Top" Width="125" />
<Button x:Name="ContinueButton_Page2" Content="Continue" Grid.Column="1" Width="125" Grid.Row="5" VerticalAlignment="Top" Margin="200,408,0,0" Grid.ColumnSpan="2" Click="btnContinue_Click"/>
</Grid>
</Window>
When you want control of the alignment during resizing, think Grid. In more complex situations, think Grids inside a Grid. A picture says it better
You have your MainGrid with only rows, no columns. The blue headers get rows of their own and
the orange containers are Grids themselves (with possibly a margin left and right).
Now you shouldn't try to divide the available space with all "...*" width values.
In this example you could use it for dead space only, e.g. the yellow columns with Width="*".
The blue columns would be Width="Auto" (or pixels).
Topping it off with a MinWidth for the Window corresponding with the width you need for the bottom Grid. Also consider wrapping your MainGrid in a ScrollViewer.
What I needed was to not allow resizing of the web browser. To do this I removed the minimize/maximize buttons To do that I used the following attribute:
ResizeMode="NoResize"
I have this code:
<Grid HorizontalAlignment="Center" VerticalAlignment="Center">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="300*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<Label x:Name="labelMultiplicador" Grid.Row="0" Grid.Column="0" Content="Multiplicador:" FontWeight="Bold" Margin="5" HorizontalAlignment="Left" VerticalAlignment="Center" Width="100" />
<Slider x:Name="sliderMultiplicador" Grid.Row="0" Grid.Column="1" Orientation="Horizontal" SmallChange="1" IsSnapToTickEnabled="True" Minimum="1" VerticalAlignment="Center" Height="1" MinHeight="30" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Center" MinWidth="300" Margin="5" TickPlacement="TopLeft" />
<TextBox x:Name="textBoxMultiplicador" Grid.Row="0" Grid.Column="2" Width="50" Text="{Binding ElementName=sliderMultiplicador,Path=Value}" HorizontalAlignment="Center" VerticalAlignment="Center" Padding="1,0,0,0" Margin="5" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" MinHeight="30" />
<Label x:Name="labelMultiplicando" Grid.Row="1" Grid.Column="0" Content="Multiplicando:" FontWeight="Bold" Margin="5" HorizontalAlignment="Left" VerticalAlignment="Center" Width="100" />
<Slider x:Name="sliderMultiplicando" Grid.Row="1" Grid.Column="1" Orientation="Horizontal" SmallChange="1" IsSnapToTickEnabled="True" Minimum="1" VerticalAlignment="Center" MinHeight="30" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Center" MinWidth="300" Margin="5" Height="1" TickPlacement="TopLeft" />
<TextBox x:Name="textBoxMultiplicando" Grid.Row="1" Grid.Column="2" Width="50" Text="{Binding ElementName=sliderMultiplicando,Path=Value}" HorizontalAlignment="Center" VerticalAlignment="Center" Padding="1,0,0,0" Margin="5" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" MinHeight="30" />
<Label x:Name="labelProduto" Grid.Row="2" Grid.Column="0" Content="Produto:" FontWeight="Bold" Margin="5" HorizontalAlignment="Left" VerticalAlignment="Center" Width="100" />
<TextBox x:Name="textBoxProduto" Grid.Row="2" Grid.Column="2" Width="50" Text="" HorizontalAlignment="Right" VerticalAlignment="Center" Padding="1,0,0,0" Margin="5" HorizontalContentAlignment="Right" VerticalContentAlignment="Center" MinHeight="30" />
</Grid>
I want to calculate the product (textBoxProduto) using the values from textBoxMultiplicador and textBoxMultiplicando.
I'm new to WPF so this might be a "stupid" question!!!
If i try to calculate the product using the textBoxMultiplicador_TextChanged event, for example, e get a "'System.NullReferenceException'".
What is the best approach in this case?
Thanks
Full example here: https://www.dropbox.com/s/e8w9t59vjhnqjbb/tabuada.zip?dl=0
The textbox top and bottom border is not showing.
I have provided the entire XAML code for the main window. I have tried increasing the BorderThickness and also changed the BorderBrush. That did not work.
XAML:
<Window x:Class="WpfApplication6.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:WpfApplication6"
mc:Ignorable="d"
Title="Activation Window" Height="300" Width="518.797">
<Grid>
<TextBox x:Name="txtFirstDigit" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="45" Margin="23,171,0,76" BorderThickness="1" BorderBrush="Black" />
<TextBox x:Name="txtSecondDigit" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="45" Margin="81,171,0,76"/>
<TextBox x:Name="txtThirdDigit" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="45" Margin="138,171,0,76"/>
<TextBox x:Name="txtFourthDigit" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="45" Margin="195,171,0,76"/>
<TextBox x:Name="txtFifthDigit" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="45" Margin="252,171,0,76"/>
<Label x:Name="label" Content="Product key:" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="23,142,0,0"/>
<TextBox x:Name="txtFirstDigit_Copy" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="274" Margin="23,111,0,136" />
<Label x:Name="label_Copy" Content="Email:" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="23,81,0,0"/>
<TextBox x:Name="txtFirstDigit_Copy1" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="130" Margin="23,55,0,192" />
<Label x:Name="label_Copy1" Content="First Name:" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="23,25,0,0"/>
<TextBox x:Name="txtFirstDigit_Copy2" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="130" Margin="167,55,0,192" />
<Button x:Name="button" Content="Next" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Margin="142,220,0,0"/>
<Button x:Name="button1" Content="Cancel" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Margin="222,220,0,0" Click="button1_Click"/>
<TextBlock x:Name="textBlock" HorizontalAlignment="Left" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top" Margin="350,147,0,0"/>
</Grid>
</Window>
I'd try something like this:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="30"></RowDefinition>
<RowDefinition Height="30"></RowDefinition>
<RowDefinition Height="30"></RowDefinition>
<RowDefinition Height="30"></RowDefinition>
<RowDefinition Height="30"></RowDefinition>
<RowDefinition Height="30"></RowDefinition>
<RowDefinition Height="30"></RowDefinition>
</Grid.RowDefinitions>
<Label x:Name="label_Copy1" Grid.Row="0" Content="First Name:" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="23,0,0,0" />
<StackPanel Orientation="Horizontal" Grid.Row="1">
<TextBox x:Name="txtFirstDigit_Copy1" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="130" Margin="23,0,0,0" />
<TextBox x:Name="txtFirstDigit_Copy2" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="130" Margin="11.5,0,0,0" />
</StackPanel>
<Label x:Name="label_Copy" Grid.Row="2" Content="Email:" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="23,0,0,0" />
<TextBox x:Name="txtFirstDigit_Copy" Grid.Row="3" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="270" Margin="23,0,0,0" />
<Label x:Name="label" Grid.Row="4" Content="Product key:" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="23,0,0,0" />
<StackPanel Orientation="Horizontal" Grid.Row="5">
<TextBox x:Name="txtFirstDigit" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="45" Margin="23,0,0,0" BorderThickness="1" />
<TextBox x:Name="txtSecondDigit" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="45" Margin="11.5,0,0,0" />
<TextBox x:Name="txtThirdDigit" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="45" Margin="11.5,0,0,0" />
<TextBox x:Name="txtFourthDigit" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="45" Margin="11.5,0,0,0" />
<TextBox x:Name="txtFifthDigit" HorizontalAlignment="Left" Height="22" TextWrapping="Wrap" VerticalAlignment="Center" Width="45" Margin="11.5,0,0,0" />
</StackPanel>
<StackPanel Orientation="Horizontal" Grid.Row="6">
<Button x:Name="button" Content="Next" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Margin="132,0,0,0" />
<Button x:Name="button1" Content="Cancel" HorizontalAlignment="Left" VerticalAlignment="Top" Width="75" Margin="11.5,0,0,0" />
</StackPanel>
</Grid>
I am new with WPF please keep that in mind. I am trying to Make the Window Responsive to Resize, Is it possible that my controls such as textboxes and buttons are Resized as window grows or shrinks?
<Window x:Class="WPF_Working_Experimenet.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="216.586" Width="459.256">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="156*"/>
<ColumnDefinition Width="295*"/>
</Grid.ColumnDefinitions>
<Label Content="username :" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="66,27,0,0" Height="30" Width="63" FontFamily="B Nazanin" FontSize="15" Grid.Column="1"/>
<Label Content="password :" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="74,63,0,0" Height="30" Width="55" FontFamily="B Nazanin" FontSize="15" Grid.Column="1"/>
<Label x:Name="lblwrong" Content="" HorizontalAlignment="Left" VerticalAlignment="Top" Margin="10,150,0,0" ClipToBounds="True" Grid.Column="1" Height="26" Width="275"/>
<Button x:Name="btnLogin" Content="Login" HorizontalAlignment="Left" VerticalAlignment="Top" Width="60" Grid.Column="1" Margin="211,103,0,0" Height="37" Background="White" Click="btnLogin_Click" BorderBrush="Red" FontFamily="B Nazanin" FontSize="15"/>
<Image HorizontalAlignment="Left" Height="117" Margin="4,23,0,0" VerticalAlignment="Top" Width="178" Source="img/Ticket_5523675581838074942.png" Grid.ColumnSpan="2" RenderTransformOrigin="0.5,0.128"/>
<Button x:Name="btnExit" Content="Exit" HorizontalAlignment="Left" VerticalAlignment="Top" Width="60" Grid.Column="1" Margin="146,103,0,0" Height="37" Background="#FFFDFDFD" BorderBrush="Red" Click="Button_btnExit" FontFamily="B Nazanin" FontSize="15"/>
<TextBox x:Name="txtUsername" HorizontalAlignment="Left" Height="23" TextWrapping="Wrap" VerticalAlignment="Top" Width="125" Grid.Column="1" Margin="146,34,0,0" BorderBrush="#FFF7311E"/>
<PasswordBox x:Name="txtPassword" Grid.Column="1" HorizontalAlignment="Left" Margin="146,70,0,0" VerticalAlignment="Top" Width="125" Height="23" BorderBrush="#FFFD3306"/>
</Grid>
</Window>
Any Reference/hint or Tutorial/link would be lovely. thank you in advance
You have to set Margin / Padding instead of explicit Width / Height if you want your controls to grow / shrink.
Few links to help you :
Layout with Absolute and Dynamic Positioning
How to make all controls resize accordingly proportionally when window is maximized?
Controls do not resize if you set their Width and Height properties explicitly. Try the following, I removed the Width and Height properties and changed the HorizontalAlignment and VerticalAlignment values to Stretch.
<Window x:Class="WPF_Working_Experimenet.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="216.586" Width="459.256">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="156*"/>
<ColumnDefinition Width="295*"/>
</Grid.ColumnDefinitions>
<Label Content="username :"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
FontFamily="B Nazanin"
FontSize="15"
Grid.Column="1"/>
<Label Content="password :"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
FontFamily="B Nazanin"
FontSize="15"
rid.Column="1"/>
<Label x:Name="lblwrong"
Content=""
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
ClipToBounds="True"
Grid.Column="1"/>
<Button x:Name="btnLogin"
Content="Login"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Grid.Column="1"
Background="White"
Click="btnLogin_Click"
BorderBrush="Red"
FontFamily="B Nazanin"
FontSize="15"/>
<Image HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Source="img/Ticket_5523675581838074942.png"
Grid.ColumnSpan="2"
RenderTransformOrigin="0.5,0.128"/>
<Button x:Name="btnExit"
Content="Exit"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Grid.Column="1"
Background="#FFFDFDFD"
BorderBrush="Red"
Click="Button_btnExit"
FontFamily="B Nazanin"
FontSize="15"/>
<TextBox x:Name="txtUsername"
HorizontalAlignment="Stretch"
TextWrapping="Wrap"
VerticalAlignment="Stretch"
Grid.Column="1"
BorderBrush="#FFF7311E"/>
<PasswordBox x:Name="txtPassword"
Grid.Column="1"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
BorderBrush="#FFFD3306"/>
</Grid>
</Window>
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Image Source="View/Images/LoginImg.jpg" Stretch="Fill" Grid.Column="0" Grid.ColumnSpan="3">
<Image.Effect>
<BlurEffect Radius="8"/>
</Image.Effect>
</Image>
<TextBox Grid.Column="0" Grid.ColumnSpan="3" BorderBrush="Transparent" BorderThickness="0" Background="Transparent" Foreground="White" HorizontalAlignment="Center"
Height="78" Margin="122,10,45.6,0" TextWrapping="Wrap" Text="Library Management System " VerticalAlignment="Top" Width="594" FontSize="40" FontWeight="Bold" FontStyle="Normal">
<TextBox.VerticalContentAlignment>Center</TextBox.VerticalContentAlignment>
<TextBox.IsReadOnly>True</TextBox.IsReadOnly>
</TextBox>
<Canvas Grid.Column="1" HorizontalAlignment="Stretch" Width="auto" Height="300" VerticalAlignment="Stretch" RenderTransformOrigin="0.5,0.5" Background="White">
<Canvas.RenderTransform>
<TransformGroup>
<ScaleTransform/>
<SkewTransform/>
<RotateTransform Angle="0.627"/>
<TranslateTransform/>
</TransformGroup>
</Canvas.RenderTransform>
<Label Content="Login" VerticalContentAlignment="Stretch" HorizontalContentAlignment="Stretch" Background="BurlyWood" FontSize="15" Height="52" Width="254">
<Label.FontWeight>Bold</Label.FontWeight>
</Label>
<TextBox Height="24" Canvas.Left="20" TextWrapping="Wrap" Text="User Name" TextAlignment="Center" Canvas.Top="84" Width="120" Foreground="Gray"/>
<PasswordBox Canvas.Left="20" Canvas.Top="136" Height="34" Width="120"/>
</Canvas>
</Grid>
Setting the horizontal and vertical alignment to stretch instead of setting width and height of the widget will do the trick. But still you can set a margin if you want. Tried this out and it ensured that when the window size is changed the widget will adjust respectively.