Nikhil Agrawal Nikhil Agrawal - 1 month ago 17
C# Question

Dynamic Viewbox not Stretching

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:

screen

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
.

Answer

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?

Comments