Alessandro Del Sole's Blog

/* A programming space about Microsoft® .NET® */
posts - 159, comments - 0, trackbacks - 0

My Links


Your host

This is me! This space is about Microsoft® .NET® and Microsoft® Visual Basic development. Enjoy! :-)

These postings are provided 'AS IS' for entertainment purposes only with absolutely no warranty expressed or implied and confer no rights.

Microsoft MVP

My MVP Profile

I'm a VB!

Watch my interview in Seattle

My new book on VB 2015!

Pre-order VB 2015 Unleashed Pre-order my new book "Visual Basic 2015 Unleashed". Click for more info!

My new book on LightSwitch!

Visual Studio LightSwitch Unleashed My book "Visual Studio LightSwitch Unleashed" is available. Click the cover!

Your visits

Follow me on Twitter!

CodePlex download Download my open-source projects from CodePlex!

Article Categories


Post Categories

.NET Framework


Help Authoring

Microsoft & MSDN

Setup & Deployment

Visual Basic 2005/2008/2010

WPF: sizing controls from other controls via databinding

During the last days inside the Visual Basic Tips & Tricks community forums we discussed about sizing Windows Presentation Foundation controls starting from other controls' size, using data-binding and XAML.

Particularly an user asked how he could dinamically assign the width of a ProgressBar starting from the width of a Label, so that both controls could always have the same width.

In this post I want to show you the solution I proposed and I'll demonstrate also how controls' width is updated at runtime with Visual Basic code. So we're talking about a WPF project in Visual Basic 2008.

We have a simple grid:







inside the grid we have a simple Label, a button that we'll click at runtime, a ProgressBar that will autosize:

            <Label Grid.Row="0" Height="30" Name="Label1" Content="Hello WPF!" HorizontalAlignment="Center"/>

            <Button Grid.Row="1" Height="30" Name="WidthButton" Width="150">Click to dinamically resize</Button>

            <ProgressBar Grid.Row="2" Height="15" MaxWidth="{Binding Path=ActualWidth, ElementName=Label1}"/> 

In the above XAML we have to first consider that we did not specify a Width property for our Label, this will allow the control to adapt itself to the panel where it is stored. In the line of code that declares the ProgressBar, we used databinding writing a XAML markup extension ({Binding Path.. ElementName.. }) so that its width derives from the Label's one. It is important to underline the usage of the ActualWidth property, since this one returns the effective width of a control at any time.

Now we can switch to the Visual Basic code and handle the button's Click event. The following code is not the best code you've ever seen in your life, but we just need something practical:

    Private Sub WidthButton_Click(ByVal sender As System.Object, _

                                  ByVal e As System.Windows.RoutedEventArgs) Handles WidthButton.Click


        'Assignment is done to the Width property

        'encreasing the value of the effective Width

        Label1.Width = Label1.ActualWidth + 50

    End Sub 


Now try to run the application and click the button. You will see that the ProgressBar will be automatically resized when the Width property of the Label is updated, as shown in the following picture:

Obviously this is a very and very small example of WPF databinding that is really and really powerful especially when used in data-centric applications. I hope this helps!


Print | posted on mercoledì 7 gennaio 2009 01:29 | Filed Under [ Visual Basic Windows Presentation Foundation ]


No comments posted yet.

Post Comment

Please add 3 and 7 and type the answer here:

Powered by:
Powered By Subtext Powered By ASP.NET