What is the difference between Width and ActualWidth in WPF?

Question

I am currently working with Panel in WPF, and I noticed that with respect to the Width and Height properties, there are two more properties called ActualWidth and ActualHeight .

ActualWidth

Gets the display width of this element. This is a dependency property. (Inherited from FrameworkElement.)

Width

Gets or sets the width of the element. This is a dependency property. (Inherited from FrameworkElement.)

Link: MSDN

Is it possible to indicate the differences between them and when to use one of them?

Answer 1

Width / Height is the size requested or layout . If you set the value to "Auto", then when accessing the property in the code, double.NaN will be double.NaN .

ActualWidth / ActualHeight - size rendered . If you need / need the actual size of the element, use this attribute.

Answer 2

I find ActualWidth most useful when I want to snap the width or height of one element to another.

In this simple example, I have two buttons next to each other, and below it is a comment, which is limited by the width of the StackPanel containing two buttons.

 <StackPanel> <StackPanel Margin="0,12,0,0" Orientation="Horizontal" Name="buttonPanel" HorizontalAlignment="Left" > <Button Content="Yes - Arm the missile" FontWeight="Bold" HorizontalAlignment="Left"/> <Button Content="No - Save the world" HorizontalAlignment="Left" Margin="7,0,0,0"/> </StackPanel> <TextBlock Text="Please choose whether you want to arm the missile and kill everybody, or save the world by deactivating the missile." Width="{Binding Path=ActualWidth,ElementName=buttonPanel}" Margin="0,5,0,0" HorizontalAlignment="Left" TextWrapping="Wrap"/> </StackPanel> 

Answer 3

ActualWidth takes into account the padding in the value, so at any time you need to know this number, which you can call ActualWidth instead of the width and avoid the calculation.

edit: removed Margin b / c is not part of ActualWidth.

Answer 4

ActualWidth set by the rendering system and may vary depending on the width of other elements and size restrictions. As a result, it cannot be changed. Width is a property that can be changed and should be used to increase or decrease the width of the element.

From MSDN :

This property is a calculated value based on other width inputs and layout system. The value is set by the layout itself, based on the actual rendering pass, and therefore may lag slightly behind the set value of properties, such as Width , which are the basis for changing the input.

Answer 5

There is a very good reason not to use ActualWidth for snapping (obviously ActualHeight respectively). When you set the Width element to ActualWidth another, you can break the layout chain .

In the best case, your element / control needs to be analyzed after the completion of the linking process of the parent (binding source). This means extra time. If it is at the same hierarchy level as the parent, the layout process requires two runs (at least) to calculate the final size.

For example, I had a control that had a size property overridden in a style that would set it to TemplatedParent (do not) :

 <Rectangle DockPanel.Dock="Top" Width="{TemplateBinding ActualWidth}" Height="1" Fill="#000000"/> 

If you resize the window contained in it, the control will prevent the container from being reduced in size and layout inhibited. Setting it to Width will solve the (do) problem:

 <Rectangle DockPanel.Dock="Top" Width="{TemplateBinding Width}" Height="1" Fill="#000000"/> 

If you need to use ActualWidth , something is wrong with your xaml. It’s better to fix this, instead of messing up the final dimensions of the layout.

Answer 6

This is exactly the width of the render! = Layout breadth. One of them is for layout, the other is for rendering. As with WinForms, the Size and ClientSize properties existed, they are slightly different, and you should use the Atual / Client rendering size and width / height for the layout.

Answer 7

You can set the Width property, but not the ActualWidth property.

The Width property is used to determine how the panel is displayed, and then ActualWidth sets the actual width that was used. This may not be the same value as the width, depending on the size of its children and the narrowing of its parent.

ActualWidth not set immediately when setting the Width property, but will be updated (one or more times) during rendering.