I want to bind data to a grid in xaml. This is the code I am using for binding it:
<Grid x:Name="Example" Grid.Column="1" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
<ContentPresenter Content="{Binding ExampleImage}" />
</Grid>
Now when I bind it using fixed width and height it will display the grid at set dimensions.
Code:
private Grid _exampleImage;
public Grid ExampleImage
{
get
{
if (SelectedSectie != null)
{
var convertFromString = System.Windows.Media.ColorConverter.ConvertFromString("#CCCCCC");
if (convertFromString != null)
{
DropShadowEffect dse = new DropShadowEffect
{
BlurRadius = 5,
ShadowDepth = 1,
Direction = 270,
Color =
(System.Windows.Media.Color)
convertFromString
};
_exampleImage = new Grid
{
Background =
new SolidColorBrush(SingleIcons.Helpers.ColorConverter.ToMediaColor(SelectedSectie.Color.ColorValue)),
VerticalAlignment = VerticalAlignment.Stretch,
Width = SelectedIconSize.Width,
Height = SelectedIconSize.Height,
MaxWidth = SelectedIconSize.Width,
MaxHeight = SelectedIconSize.Height,
HorizontalAlignment = System.Windows.HorizontalAlignment.Stretch,
Effect = dse,
RowDefinitions =
{
new RowDefinition {Height = new GridLength(46, GridUnitType.Star)},
new RowDefinition {Height = new GridLength(3, GridUnitType.Star)}
}
};
}
TextBlock afbeeldingTextBlock = new TextBlock
{
Text = _selectedSectie.Sectie,
TextWrapping = TextWrapping.Wrap,
TextAlignment = TextAlignment.Center,
Width = _exampleImage.Width,
FontSize = Global.Fontsize,
FontFamily = new System.Windows.Media.FontFamily(Global.Family.Name),
VerticalAlignment = VerticalAlignment.Center,
Foreground =
new SolidColorBrush(
SingleIcons.Helpers.ColorConverter.ToMediaColor(SelectedSectie.Color.TextColorValue)),
};
TextOptions.SetTextFormattingMode(afbeeldingTextBlock, TextFormattingMode.Display);
TextOptions.SetTextRenderingMode(afbeeldingTextBlock, TextRenderingMode.ClearType);
Canvas bottomCanvas = new Canvas
{
Background = (SolidColorBrush) (new BrushConverter().ConvertFrom("#26000000"))
};
Grid.SetRow(afbeeldingTextBlock, 0);
Grid.SetRow(bottomCanvas, 1);
_exampleImage.Children.Add(afbeeldingTextBlock);
_exampleImage.Children.Add(bottomCanvas);
_exampleImage.Measure(new System.Windows.Size(_exampleImage.Width,
_exampleImage.Height));
_exampleImage.Arrange(
new Rect(new System.Windows.Size(_exampleImage.Width, _exampleImage.Height)));
return _exampleImage;
}
else
{
return null;
}
}
}
Now what I would like to do is to keep the grid at set dimensions but allow the GUI to scale the grid,
because when I make the window smaller the grid stays at these dimensions and it hurts the scaling of the application.
The reason I am using a databound grid is because I have another function which exports this grid to a .png.
Putting it inside a Viewbox and setting StretchDirection to DownOnly was the result i wanted.
<Grid x:Name="Example" Grid.Column="1" Grid.Row="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
<Viewbox StretchDirection="DownOnly" >
<ContentPresenter Content="{Binding ExampleImage}" />
</Viewbox>
</Grid>
Related
I develop one-page app. This is XAML of MainPage
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition/>
</Grid.RowDefinitions>
<StackPanel Orientation="Vertical" Grid.Row="0">
<AppBar x:Name="MenuAppBar" IsOpen="True">
<StackPanel Orientation="Horizontal">
<AppBarButton Icon="Add" Label="Добавить лексемы" Name="AddLexemesFromFolder" Click="OpenFolderAndGetLexemes_Click" HorizontalAlignment="Left"/>
<AppBarButton Icon="Save" Label="Сохранить лексемы" Name="SaveLexemes" Click="SaveLexemes_Click" HorizontalAlignment="Left"/>
</StackPanel>
</AppBar>
</StackPanel>
<ScrollViewer Grid.Row="1" VerticalScrollBarVisibility="Auto" VerticalScrollMode="Enabled">
<Grid x:Name="GridLexemesViewer" HorizontalAlignment="Stretch"/>
</ScrollViewer>
</Grid>
When I pressed "AddLexemesFromFolder" button more than two times, GridLexemesViewer is getting smaller over and over.
This is OpenFolderAndGetLexemes code
private async void OpenFolderAndGetLexemes_Click(object sender, RoutedEventArgs routedEventArgs)
{
await StartSaveLexemes();
var folderPicker = new Windows.Storage.Pickers.FolderPicker();
folderPicker.FileTypeFilter.Add("*");
Windows.Storage.StorageFolder folder = await folderPicker.PickSingleFolderAsync();
if (folder != null)
{
StorageApplicationPermissions.FutureAccessList.AddOrReplace("PickedFolderToken", folder);
await Task.Run(() => StartNewSessionForGetLexemes(folder.Path));
InitializeGrid();
}
}
I use "InitializeGrid" method for clear Children in GridLexemesViewer, use CreateRowsAndColumns and put TextBox with content to GridLexemesViewer.
This is code of InitializeGrid and CreateRowsAndColumns()
private void InitializeGrid()
{
GridLexemesViewer.Children.Clear();
CreateRowsAndColumns();
int index = 1;
foreach (var lexem in CurrentSession.Lexemes)
{
foreach (var item in lexem.Value)
{
Binding binding = new Binding
{
Source = item,
Path = new PropertyPath("Value"),
Mode = BindingMode.TwoWay,
UpdateSourceTrigger = UpdateSourceTrigger.PropertyChanged
};
TextBox textBox = new TextBox { TextWrapping = TextWrapping.Wrap };
BindingOperations.SetBinding(textBox, TextBox.TextProperty, binding);
GridLexemesViewer.Children.Add(textBox);
Grid.SetColumn(textBox, CurrentSession.Languages.IndexOf(item.Language) + 1);
Grid.SetRow(textBox, index);
}
index++;
}
}
private void CreateRowsAndColumns()
{
int indexRow = 1;
int indexColumn = 1;
RowDefinition firstRowDefinition = new RowDefinition();
ColumnDefinition firstColumnDefinition = new ColumnDefinition { Width = GridLength.Auto };
GridLexemesViewer.ColumnDefinitions.Add(firstColumnDefinition);
GridLexemesViewer.RowDefinitions.Add(firstRowDefinition);
foreach (var key in CurrentSession.Lexemes.Keys)
{
RowDefinition rowDefinition = new RowDefinition();
GridLexemesViewer.RowDefinitions.Add(rowDefinition);
TextBlock textBlock = new TextBlock{Text = key};
GridLexemesViewer.Children.Add(textBlock);
Grid.SetRow(textBlock, indexRow);
indexRow++;
}
foreach (var language in CurrentSession.Languages)
{
ColumnDefinition columnDefinition = new ColumnDefinition { Width = new GridLength(1.0, GridUnitType.Star)};
GridLexemesViewer.ColumnDefinitions.Add(columnDefinition);
TextBlock textBlock = new TextBlock {Text = language};
GridLexemesViewer.Children.Add(textBlock);
Grid.SetRow(textBlock, 0);
Grid.SetColumn(textBlock, indexColumn);
indexColumn++;
}
}
This GIF shows how to reproduce bug
The problem is that you are calling CreateRowsAndColumns() each time but not removing the Rows and Columns from previous run. Using Grid.Clear() only deletes the children controls in the Grid, but the Grid.RowDefinitions and Grid.ColumnDefinitions stay intact.
To fix this, clear both definitions at the start of CreateRowsAndColumns():
GridLexemesViewer.RowDefinitions.Clear();
GridLexemesViewer.ColumnDefinitions.Clear();
However, definitely consider using the DataGrid control from the Windows Community Toolkit as it should have all the features you need and has better maintainability and performance then a custom Grid, especially for bigger data.
I created a border and a label by code in c# wpf
I want to create a data binding for Background and BorderBrush of border with
the Background of the label
Here is the code
void creatlbl()
{
Border b = new Border();
b.Name = "b11";
b.Margin = new Thickness(300,17,0,419);
b.Height = 32;
b.CornerRadius = new CornerRadius(5);
b.Width = 181;
b.BorderThickness = new Thickness(2);
b.HorizontalAlignment = HorizontalAlignment.Left;
lgingrd.Children.Add(b); //
Label l = new Label();
l.Name = "l111";
l.Content = "l111";
l.Height = 28;
l.Width = 177;
l.Foreground = (Brush)bc.ConvertFrom("#FF346D80");
l.FontSize = 20;
l.Background = (Brush)bc.ConvertFrom("#FF9AB426");
l.HorizontalContentAlignment = HorizontalAlignment.Center;
l.Padding = new Thickness(0,0,0,0);
l.Visibility = Visibility.Visible;
b.Child = l;
// here i want to set binding for border
// the background and borderbrush of border equal to the background of label
}
same thing i did for a button in XAML like that
<Border x:Name="brdbt" Margin="120,58,0,378"
BorderBrush="{Binding Background, ElementName=bt}" <!--this is the binding which i want-->
Height="32"
CornerRadius="5"
Width="181"
BorderThickness="2"
HorizontalAlignment="Left" Background="{Binding Background, ElementName=bt}">
<Button x:Name="bt" Content="btntxt" HorizontalAlignment="Left" VerticalAlignment="Top" Height="28" Width="177" Click="bt_click" BorderBrush="{x:Null}" Foreground="#FFE8EEF0" FontSize="20" Padding="1,-1,1,1" MouseEnter="bt_mcentr" MouseLeave="bt_mclv" Background="#FFE62828"/>
</Border>
Is there any way to do above xaml type binding in c# code for border and label I mentioned above in c# code?
create Binding object with path "Background" which uses label l as source (new Binding("Background") { Source = l }) and assign that binding to target properties: Border.Background and Border.BorderBrush
BindingOperations.SetBinding(b, BackgroundProperty, new Binding("Background") { Source = l });
BindingOperations.SetBinding(b, BorderBrushProperty, new Binding("Background") { Source = l });
You know it would be simpler to create this entire block of code in xaml.
Just wrap it in DataTemplate with key.
In your code, create a ContentPresenter, give it your data as content,
And give it your DataTemplate as it's ContentTemplate value:
ContentPresenter cp = new ContentPresenter();
cp.Content = (?)
cp.ContentTemplate = Application.Current.Resources.Find("DataTemplateKey") as DataTemplate;
Ihave some Problems to attach Textblocks in my Grid.
I cant use SetRow(Frameworkelement,index);
The ErrorMessage is something like that I cant access the MemberFunction with an instance reference.
Instead i should use a TypeName, but how?
private FrameworkElement CreateGrid(int i)
{
double w = 775;
double l = 1105;
TextBlock header = CreateHeader("someRndStuffHeader");
RowDefinition headerRowDefinition = new RowDefinition
{
MinHeight = header.ActualHeight,
MaxHeight = header.ActualHeight,
};
TextBlock footer = CreateFooter("someRndStuffFooter");
RowDefinition footerRowDefinition = new RowDefinition
{
MinHeight = footer.ActualHeight,
MaxHeight = footer.ActualHeight
};
double contentHeight = l- header.ActualHeight - footer.ActualHeight;
RowDefinition contentRowDefinition = new RowDefinition
{
MinHeight = contentHeight,
MaxHeight = contentHeight,
};
ColumnDefinition gridColumnDefinition = new ColumnDefinition()
{
MaxWidth = w,
MinWidth = w,
};
Grid page = new Grid();
string name = "printPage" + i.ToString();
page.Name = name;
page.RowDefinitions.Add(headerRowDefinition);
page.RowDefinitions.Add(contentRowDefinition);
page.RowDefinitions.Add(footerRowDefinition);
page.ColumnDefinitions.Add(gridColumnDefinition);
// I CANT USE THIS
page.SetRow(header, 1);
return page;
}
SetRow(FrameworkElement framework,int value) is a static method. Instance members cannot use it.
Use like this :-
Grid.SetRow(header,1);
However, before you can achieve that, you have to make header and footer TextBlocks children of the newly formed grid because SetRow method sets the row of framework element only when it is a child of any grid.
So you will have to add these two statements :-
page.Children.Add(header);
page.Children.Add(footer);
Further, here the new grid i.e page, it has to be also assigned a parent grid. When you create a new AppPage (BlankPage.xaml) then by default a parent grid is already rendered by the system. Name this parent grid as say x:Name="Layout" and then add grid 'page' to this 'Layout' grid. I am giving here full code, both xaml and .cs. I have created a button and then when i press the button, new grid is created
In XAMl :-
<Grid x:Name="layout" Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Button Content="Button" HorizontalAlignment="Left" Margin="587,475,0,0" VerticalAlignment="Top" Click="Button_Click"/>
</Grid>
In .cs :-
private FrameworkElement CreateGrid(int i)
{
double w = 775;
double l = 1105;
TextBlock header = CreateHeader("someRndStuffHeader");
RowDefinition headerRowDefinition = new RowDefinition
{
MinHeight = header.ActualHeight,
MaxHeight = header.ActualHeight,
};
TextBlock footer = CreateFooter("someRndStuffFooter");
RowDefinition footerRowDefinition = new RowDefinition
{
MinHeight = footer.ActualHeight,
MaxHeight = footer.ActualHeight
};
double contentHeight = l - header.ActualHeight - footer.ActualHeight;
RowDefinition contentRowDefinition = new RowDefinition
{
MinHeight = contentHeight,
MaxHeight = contentHeight,
};
ColumnDefinition gridColumnDefinition = new ColumnDefinition()
{
MaxWidth = w,
MinWidth = w,
};
Grid page = new Grid();
string name = "printPage" + i.ToString();
page.Name = name;
page.RowDefinitions.Add(headerRowDefinition);
page.RowDefinitions.Add(contentRowDefinition);
page.RowDefinitions.Add(footerRowDefinition);
page.ColumnDefinitions.Add(gridColumnDefinition);
**Grid.SetRow(header, 1);
page.Children.Add(header);
page.Children.Add(footer);**
return page;
}
private TextBlock CreateFooter(string p)
{
return new TextBlock() { Width=300,Height=300,Text=p};
}
private TextBlock CreateHeader(string p)
{
return new TextBlock() { Width = 300, Height = 300, Text = p };
}
private void Button_Click(object sender, RoutedEventArgs e)
{
layout.Children.Add(CreateGrid(1));
}
I have some problems with new Metro design in Windows 8. I'm building simple e-reader app, and want to use two-column pages. So, my choice is FlipView and RichTextBlock with overflows. But after adding two pages, overflow doesn't have overflow content! So I have only three pages. But text is very large.
I have such code:
private async void CreatePages()
{
_pages = new List<UIElement>();
_pageCount = 1;
_lastOverflow = AddOnePage(null, _pageCount);
while (_lastOverflow.HasOverflowContent) //It's here!!
{
_pageCount++;
_lastOverflow = AddOnePage(_lastOverflow, _pageCount);
View.UpdateLayout();
}
for (var i = 1; i <= _pageCount; i++)
{
var scrollViewer = new ScrollViewer
{
Margin = new Thickness(10, 30, 10, 30),
HorizontalContentAlignment = HorizontalAlignment.Stretch,
ZoomMode = ZoomMode.Enabled,
VerticalScrollMode = ScrollMode.Enabled,
HorizontalScrollMode = ScrollMode.Disabled,
Name = "Scroll" + i
};
var snappedBlock = new RichTextBlock
{
VerticalAlignment = VerticalAlignment.Center,
HorizontalAlignment = HorizontalAlignment.Center,
TextWrapping = TextWrapping.Wrap,
IsTextSelectionEnabled = true
};
foreach (var text in new string[0])
{
var paragraph = new Paragraph();
paragraph.Inlines.Add(new Run { Text = text });
snappedBlock.Blocks.Add(paragraph);
}
scrollViewer.Content = snappedBlock;
SnappedView.Items.Add(scrollViewer);
}
}
private RichTextBlockOverflow AddOnePage(RichTextBlockOverflow lastOverflow, int pageNumber)
{
// Create a grid which represents the page
var grid = new Grid
{
Name = "Grid" + pageNumber
};
grid.ColumnDefinitions.Add(new ColumnDefinition
{
Width = new GridLength(1, GridUnitType.Star)
});
grid.ColumnDefinitions.Add(new ColumnDefinition
{
Width = new GridLength(1, GridUnitType.Star)
});
var grid1 = new Grid
{
Name = "Grid1_" + pageNumber
};
var grid2 = new Grid
{
Name = "Grid2_" + pageNumber
};
grid1.SetValue(Grid.ColumnProperty, 0);
grid2.SetValue(Grid.ColumnProperty, 1);
grid.Children.Add(grid1);
grid.Children.Add(grid2);
View.Items.Add(grid);
// If lastRTBOAdded is null then we know we are creating the first page.
var isFirstPage = lastOverflow == null;
RichTextBlockOverflow richTextBlockOverflow = null;
if (isFirstPage)
{
var overflow = new RichTextBlockOverflow
{
Margin = new Thickness(20, 30, 70, 30),
Name = "SecondBlock" + pageNumber,
OverflowContentTarget = new RichTextBlockOverflow(),
VerticalAlignment = VerticalAlignment.Center,
HorizontalAlignment = HorizontalAlignment.Center
};
overflow.SetValue(Grid.ColumnProperty, 1);
_textBlock = new RichTextBlock
{
VerticalAlignment = VerticalAlignment.Center,
HorizontalAlignment = HorizontalAlignment.Center,
Margin = new Thickness(70, 30, 20, 30),
TextWrapping = TextWrapping.Wrap,
IsTextSelectionEnabled = true,
Name = "FirstBlock" + pageNumber,
OverflowContentTarget = overflow
};
_textBlock.SetValue(Grid.ColumnProperty, 0);
foreach (var text in _content.Trim('\n', ' ', '\t').Split('\n'))
{
var paragraph = new Paragraph();
paragraph.Inlines.Add(new Run { Text = text });
_textBlock.Blocks.Add(paragraph);
}
grid1.Children.Add(_textBlock);
grid2.Children.Add(overflow);
_textBlock.Measure(grid1.RenderSize);
overflow.Measure(grid2.RenderSize);
_pages.Add(grid);
richTextBlockOverflow = overflow;
}
else
{
// This is not the first page so the first element on this page has to be a
// RichTextBoxOverflow that links to the last RichTextBlockOverflow added to
// the previous page.
if (lastOverflow.HasOverflowContent)
{
var overflowSecond = new RichTextBlockOverflow
{
VerticalAlignment = VerticalAlignment.Center,
HorizontalAlignment = HorizontalAlignment.Center,
Margin = new Thickness(20, 30, 70, 30),
Name = "SecondBlock" + pageNumber
};
overflowSecond.SetValue(Grid.ColumnProperty, 1);
var overflowFirst = new RichTextBlockOverflow
{
VerticalAlignment = VerticalAlignment.Center,
HorizontalAlignment = HorizontalAlignment.Center,
Margin = new Thickness(70, 30, 20, 30),
Name = "FirstBlock" + pageNumber,
OverflowContentTarget = overflowSecond
};
overflowFirst.SetValue(Grid.ColumnProperty, 0);
lastOverflow.OverflowContentTarget = overflowFirst;
grid1.Children.Add(overflowFirst);
grid2.Children.Add(overflowSecond);
overflowFirst.Measure(grid1.RenderSize);
overflowSecond.Measure(grid2.RenderSize);
_pages.Add(overflowFirst);
_pages.Add(overflowSecond);
richTextBlockOverflow = overflowSecond;
}
}
_pages.Clear();
LayoutRoot.UpdateLayout();
return richTextBlockOverflow;
}
In LoadState() I call CreatePages() method.
My XAML:
<Grid x:Name="LayoutRoot" Style="{StaticResource LayoutRootStyle}" Background="#FFDEDEDE">
<FlipView x:Name="View" HorizontalAlignment="Stretch" VerticalAlignment="Center" Foreground="Black" SelectionChanged="ViewOnSelectionChanged" FontSize="18" >
</FlipView>
<FlipView x:Name="SnappedView" HorizontalAlignment="Stretch" VerticalAlignment="Top" Foreground="Black" SelectionChanged="SnappedViewOnSelectionChanged" FontSize="12" Visibility="Collapsed">
</FlipView>
<ProgressBar x:Name="LoadProgressBar" HorizontalAlignment="Stretch" VerticalAlignment="Top" IsIndeterminate="True" Foreground="#007ACC"/>
</Grid>
Thanks to all! I hope, that someone knows, how to solve this problem..
In my earlier example of Input Box, I have a window variable. I created some controls(Textbox, Label, Buttons). Parent of these controls is canvas. Parent of canvas is a ViewBox (because ViewBox can only contain one child) and parent of ViewBox is the window.
So hierarchy is like Window->Viewbox->Canvas-> Controls. All these control creation and parenting is done dynamically.
winInputDialog = new Window();
lblPrompt = new Label();
btnOK = new Button();
btnCancel = new Button();
txtInput = new TextBox();
cvContainer = new Canvas();
VB = new Viewbox();
//
// lblPrompt
//
lblPrompt.Background = new SolidColorBrush(SystemColors.ControlColor);
lblPrompt.FontFamily = new FontFamily("Microsoft Sans Serif");
lblPrompt.FontSize = 12;
lblPrompt.Background = new SolidColorBrush(Colors.Transparent);
lblPrompt.FontStyle = FontStyles.Normal;
lblPrompt.Margin = new Thickness(8, 9, 0, 0);
lblPrompt.Name = "lblPrompt";
lblPrompt.Width = 302;
lblPrompt.Height = 82;
lblPrompt.TabIndex = 3;
//
// btnOK
//
btnOK.Margin = new Thickness(322, 8, 0, 0);
btnOK.Name = "btnOK";
btnOK.Width = 64;
btnOK.Height = 24;
btnOK.TabIndex = 1;
btnOK.Content = "OK";
btnOK.Click += new RoutedEventHandler(btnOK_Click);
//
// btnCancel
//
btnCancel.Margin = new Thickness(322, 40, 0, 0);
btnCancel.Name = "btnCancel";
btnCancel.Width = 64;
btnCancel.Height = 24;
btnCancel.TabIndex = 2;
btnCancel.Content = "Cancel";
btnCancel.Click += new RoutedEventHandler(btnCancel_Click);
//
// txtInput
//
txtInput.Margin = new Thickness(8, 70, 0, 0);
txtInput.Name = "txtInput";
txtInput.Width = 379;
txtInput.Height = 25;
txtInput.TabIndex = 0;
//
//Canvas
//
double width = System.Windows.SystemParameters.PrimaryScreenWidth / 3, height = System.Windows.SystemParameters.PrimaryScreenHeight / 4;
cvContainer.Height = height;
cvContainer.Width = width;
cvContainer.Children.Add(txtInput);
cvContainer.Children.Add(btnCancel);
cvContainer.Children.Add(btnOK);
cvContainer.Children.Add(lblPrompt);
cvContainer.ClipToBounds = true;
//
//ViewBox
//
VB.Stretch = Stretch.Fill;
VB.Child = cvContainer;
//
// InputBoxDialog
//
winInputDialog.Width = width;
winInputDialog.Height = height;
winInputDialog.Content = VB;
winInputDialog.Icon = new System.Windows.Media.Imaging.BitmapImage(new System.Uri(System.IO.Directory.GetCurrentDirectory() + #"\drop-box-icon.png"));
winInputDialog.WindowStartupLocation = WindowStartupLocation.CenterScreen;
//winInputDialog.WindowStyle = WindowStyle.SingleBorderWindow;
winInputDialog.ResizeMode = ResizeMode.CanResizeWithGrip;
winInputDialog.Name = "InputBoxDialog";
I have set the width and height property of canvas equal to window. But why my screen look like this:
Why is there space between controls and window borders even though they are in viewbox. I even tried Cliptobounds but still the same.
If i set Viewbox height and width it does not stretch and behave unlike a Viewbox.
i want to set this screen dynamically. How?
Sample Project is at http://122.160.24.172/download/customer_data/InputBox_New.rar.
If you want your window to have a dynamic layout, why won't you use a dynamic container unlike Canvas which is static?
You could use a Grid like this -
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.8*"/>
<ColumnDefinition Width ="0.2*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<TextBlock Text="Hello"/>
<Button Grid.Column="1" Content="Ok"/>
<Button Grid.Row="1" Grid.Column="1" Content="Cancel"/>
<TextBox Grid.Row="2" Grid.ColumnSpan="2" Text="Hello"/>
</Grid>
This way your window will layout itself when its size is changed.
You can still adjust the button size and margin if you'd like.
Don't use a Canvas unless you really need support for exact pixel coordination positioning layout.
Also: Why are you layouting your window programatically and not in XAML?