How to track the changes of UserControl size

Question

Dear all,

I have a UserControl where its size is unknown until it receive its content.
The user control has a grid with 2 colomns.

First columns will receive a picture
Second column will show information of that picture.

The picture is always visible and shown
Information of column 1 are shown on demand

In order to have a nice visual effect, by default the column 1 width is set to 0, then on a user action and with help of a storyboard the with of the column 1 gets increased until its final size.

So as you can see the user control has a dynamic size during runtime depending if picture information is shown or not.

The reason for that is that I need to bind the host Width and Height property of to its Content.ActualWidth and Content.ActualHeight  of my user control.

To bind the host I have used a in a style following setter :

 <Setter Property="Width" Value="{Binding Path=Content.ActualWidth, RelativeSource={RelativeSource Self}, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>
        <Setter Property="Height" Value="{Binding Path=Content.ActualHeight, RelativeSource={RelativeSource Self}, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>

By this I was expecting that when the colomn1 with of my user control change, it will affect the host but it is not working.

What I try to reach, is track all size change value of the user control , how can I do that ?

My user control is as follow:

<UserControl x:Class="Knauf.Views.PhotoView"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:s="http://schemas.microsoft.com/surface/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:converters="clr-namespace:Knauf.Converters"
             xmlns:props="clr-namespace:KnaufProduct.Properties"
             xmlns:Helpers="clr-namespace:Solatys.Helpers"
             xmlns:controls="clr-namespace:Knauf.Controls"
             xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"
             xmlns:views="clr-namespace:Knauf.Views"
             DataContext="{Binding}"
             mc:Ignorable="d" 
             Width="Auto" 
             Loaded="UserControl_Loaded">
    
    <UserControl.Resources>
        <ResourceDictionary>
                <ResourceDictionary.MergedDictionaries>
                    <ResourceDictionary Source="../Resources/Resources.xaml" />
                    <ResourceDictionary Source="../Resources/KnaufButtons.xaml"/>
                </ResourceDictionary.MergedDictionaries>
            <converters:VisibilityConverter x:Key="VisibilityToBooleanConverter"/>
            <!-- Story board definition dor grid length animation-->
            <Storyboard x:Key="gridColin">
                <Helpers:GridLengthAnimation BeginTime="0:0:0" Duration="0:0:0.5" Storyboard.TargetName="ColInfo"
                                             Storyboard.TargetProperty="Width" From="350" To="0"/>
            </Storyboard>
            <Storyboard x:Key="gridColout">
                <Helpers:GridLengthAnimation BeginTime="0:0:0" Duration="0:0:0.5" Storyboard.TargetName="ColInfo"
                                             Storyboard.TargetProperty="Width" From="0" To="350"/>
            </Storyboard>
            <!-- Story board definition -->
            <Storyboard x:Key="CloseInfoTitle">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="_InfoPanel">
                    <EasingDoubleKeyFrame KeyTime="0:0:0.4" Value="40"/>
                    <EasingDoubleKeyFrame KeyTime="0:0:1.2" Value="0"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
            <Storyboard x:Key="OpenInfoTitle">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Width)" Storyboard.TargetName="_InfoPanel">
                    <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="340"/>
                    <EasingDoubleKeyFrame KeyTime="0:0:1" Value="350"/>
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
            <Storyboard x:Key="OpenInfo">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="_InfoPanel">
                    <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="250"/>
                    <!--<EasingDoubleKeyFrame KeyTime="0:0:1.2" Value="300"/>-->
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
            <Storyboard x:Key="CloseInfo">
                <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(FrameworkElement.Height)" Storyboard.TargetName="_InfoPanel">
                    <EasingDoubleKeyFrame KeyTime="0:0:0.5" Value="50"/>
                    <!--<EasingDoubleKeyFrame KeyTime="0:0:1.2" Value="50"/>-->
                </DoubleAnimationUsingKeyFrames>
            </Storyboard>
        </ResourceDictionary>
        
    </UserControl.Resources>
    
    <Grid x:Name="_LayoutRoot" >
        
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="Auto" x:Name="ColInfo"/>
        </Grid.ColumnDefinitions>
        <StackPanel x:Name="_InfoPanel" Orientation="Vertical" VerticalAlignment="Top" Grid.Column="1" Width="0" Height="0">
            <Border  Margin="5"  Background="{DynamicResource KnaufCyanBrush}">
                <TextBlock x:Name="_Title" Foreground="White" 
                       Style="{StaticResource DefaultTextBlock}" 
                       Text="THis is a title header"
                       Margin="10"
                       TextWrapping="Wrap"
                       TextAlignment="Justify" 
                       VerticalAlignment="Center"/>
            </Border>
            <Border  Margin="5" BorderThickness="3"  BorderBrush="{DynamicResource KnaufCyanBrush}" CornerRadius="2">
                <TextBlock x:Name="_Info"  Opacity="1" Width="300" HorizontalAlignment="Left"
                   FontSize="12"              
                   FontFamily="{StaticResource MainFont}" 
                   Text="fdsfdsfdsfd  fds f fsdf f fdsfsdfsdfsdfdsf fdsfdsfdsfsdf fdfdsfsdfsdfsd fdfsdfdsfdsfd fdfdsfdsfdsfd fdsfdsfsdf fdsfdsfsdfdsfsd fdsf dsf ds."
                   Margin="5"
                   TextWrapping="Wrap"
                   TextAlignment="Left"/>
            </Border>
            
            <!--</s:SurfaceScrollViewer>-->
        </StackPanel>
        
        <Image Source="{Binding originalUri}" Stretch="UniformToFill" Grid.Column="0"/>
       
        <!--<controls:PhotoControl x:Name="_photoControl" Grid.Column="0"/>
        <controls:PhotoInfoControl x:Name="_InfoControl" Grid.Column="1" VerticalAlignment="Top" HorizontalAlignment="Left" Width="0" Margin="5,0,0,0"   DataContext="{Binding}"/>-->
        
    </Grid>
</UserControl>

I have try to register the the Layout change event and check the width of my control but it all time reporting 350, which is wrong as it shold be bigger if column1 is shown

Any idea how to do ?

regards

serge

---

Your knowledge is enhanced by that of others.

Answer 1

Have you tried SizeChanged event?

http://msdn.microsoft.com/en-us/library/system.windows.frameworkelement.sizechanged.aspx
http://blogs.msdn.com/b/devdave/archive/2008/05/27/layout-events-sizechanged-and-layoutupdated.aspx

---

Gaurav Khanna | Microsoft VB.NET MVP

Answer 2

Hello I have tried but have strange thing.

I have the initila size of my control which is set to 91 pix width.
When when clciking on  button, I change increase the width of my user control by 350 pix.

So at the end, I should get a User control width to be 91 +350.

For some reason I do not get that, instead my UserControl width goes far above that..

Here is what I do in the SizeChange event :

 if (e.PreviousSize.Width != e.NewSize.Width)
            {
                this.Width =this.ActualWidth + e.NewSize.Width;
                            log.Debug("Modified new size Width : " + e.NewSize.Width.ToString() + ", Content Width : " + this.ActualWidth);
                            break;
                

NOthing special here but here below the log of new size value and Content.Width value. You will notice that Content.Width goes much over the end value of e.NewSize.Width :

2012-08-19 21:19:17,993 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 91,2766666666667
Extra
2012-08-19 21:19:17,993 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 11,313976, Content Width : 91,2766666666667
Extra
2012-08-19 21:19:18,011 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 102,590642666667
Extra
2012-08-19 21:19:18,012 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 22,695544, Content Width : 102,590642666667
Extra
2012-08-19 21:19:18,028 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 125,286186666667
Extra
2012-08-19 21:19:18,029 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 34,026928, Content Width : 125,286186666667
Extra
2012-08-19 21:19:18,042 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 159,313114666667
Extra
2012-08-19 21:19:18,042 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 45,34852, Content Width : 159,313114666667
Extra
2012-08-19 21:19:18,058 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 204,661634666667
Extra
2012-08-19 21:19:18,058 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 56,69262, Content Width : 204,661634666667
Extra
2012-08-19 21:19:18,075 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 261,354254666667
Extra
2012-08-19 21:19:18,075 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 68,025908, Content Width : 261,354254666667
Extra
2012-08-19 21:19:18,091 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 329,380162666667
Extra
2012-08-19 21:19:18,091 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 79,339884, Content Width : 329,380162666667
Extra
2012-08-19 21:19:18,108 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 408,720046666667
Extra
2012-08-19 21:19:18,108 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 90,651956, Content Width : 408,720046666667
Extra
2012-08-19 21:19:18,124 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 499,372002666667
Extra
2012-08-19 21:19:18,124 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 101,967224, Content Width : 499,372002666667
Extra
2012-08-19 21:19:18,140 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 601,339226666667
Extra
2012-08-19 21:19:18,141 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 113,31894, Content Width : 601,339226666667
Extra
2012-08-19 21:19:18,162 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 714,658166666667
Extra
2012-08-19 21:19:18,162 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 124,652228, Content Width : 714,658166666667
Extra
2012-08-19 21:19:18,178 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 839,310394666667
Extra
2012-08-19 21:19:18,178 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 135,985516, Content Width : 839,310394666667
Extra
2012-08-19 21:19:18,198 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 975,295910666667
Extra
2012-08-19 21:19:18,198 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 147,318804, Content Width : 975,295910666667
Extra
2012-08-19 21:19:18,215 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 1122,61471466667
Extra
2012-08-19 21:19:18,215 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 158,652092, Content Width : 1122,61471466667
Extra
2012-08-19 21:19:18,227 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 1281,26680666667
Extra
2012-08-19 21:19:18,227 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 169,98538, Content Width : 1281,26680666667
Extra
2012-08-19 21:19:18,245 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 1451,25218666667
Extra
2012-08-19 21:19:18,245 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 181,318668, Content Width : 1451,25218666667
Extra
2012-08-19 21:19:18,264 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 1632,57085466667
Extra
2012-08-19 21:19:18,264 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 192,651956, Content Width : 1632,57085466667
Extra
2012-08-19 21:19:18,275 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 1825,22281066667
Extra
2012-08-19 21:19:18,275 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 203,985244, Content Width : 1825,22281066667
Extra
2012-08-19 21:19:18,303 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 2029,20805466667
Extra
2012-08-19 21:19:18,304 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 215,318532, Content Width : 2029,20805466667
Extra
2012-08-19 21:19:18,319 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 2244,52658666667
Extra
2012-08-19 21:19:18,319 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 226,65182, Content Width : 2244,52658666667
Extra
2012-08-19 21:19:18,339 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 2471,17840666667
Extra
2012-08-19 21:19:18,339 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 237,985108, Content Width : 2471,17840666667
Extra
2012-08-19 21:19:18,358 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 2709,16351466667
Extra
2012-08-19 21:19:18,358 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 260,651684, Content Width : 2709,16351466667
Extra
2012-08-19 21:19:18,386 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 2969,81519866667
Extra
2012-08-19 21:19:18,386 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 271,984972, Content Width : 2969,81519866667
Extra
2012-08-19 21:19:18,405 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 3241,80017066667
Extra
2012-08-19 21:19:18,406 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 283,31826, Content Width : 3241,80017066667
Extra
2012-08-19 21:19:18,432 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 3525,11843066667
Extra
2012-08-19 21:19:18,432 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 305,984836, Content Width : 3525,11843066667
Extra
2012-08-19 21:19:18,452 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 3831,10326666667
Extra
2012-08-19 21:19:18,452 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 317,318124, Content Width : 3831,10326666667
Extra
2012-08-19 21:19:18,461 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 4148,42139066667
Extra
2012-08-19 21:19:18,461 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 328,651412, Content Width : 4148,42139066667
Extra
2012-08-19 21:19:18,480 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 4477,07280266667
Extra
2012-08-19 21:19:18,480 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 339,9847, Content Width : 4477,07280266667
Extra
2012-08-19 21:19:18,507 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 4817,05750266667
Extra
2012-08-19 21:19:18,507 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 340,332882, Content Width : 4817,05750266667
Extra
2012-08-19 21:19:18,542 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 5157,39038466667
Extra
2012-08-19 21:19:18,542 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 341,332878, Content Width : 5157,39038466667
Extra
2012-08-19 21:19:18,572 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 5498,72326266667
Extra
2012-08-19 21:19:18,572 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 341,66621, Content Width : 5498,72326266667
Extra
2012-08-19 21:19:18,600 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 5840,38947266667
Extra
2012-08-19 21:19:18,600 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 342,332874, Content Width : 5840,38947266667
Extra
2012-08-19 21:19:18,622 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 6182,72234666667
Extra
2012-08-19 21:19:18,622 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 342,666206, Content Width : 6182,72234666667
Extra
2012-08-19 21:19:18,646 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 6525,38855266667
Extra
2012-08-19 21:19:18,646 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 343,33287, Content Width : 6525,38855266667
Extra
2012-08-19 21:19:18,661 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 6868,72142266667
Extra
2012-08-19 21:19:18,661 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 343,666202, Content Width : 6868,72142266667
Extra
2012-08-19 21:19:18,680 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 7212,38762466667
Extra
2012-08-19 21:19:18,680 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 343,999534, Content Width : 7212,38762466667
Extra
2012-08-19 21:19:18,695 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 7556,38715866667
Extra
2012-08-19 21:19:18,695 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 344,332866, Content Width : 7556,38715866667
Extra
2012-08-19 21:19:18,711 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 7900,72002466667
Extra
2012-08-19 21:19:18,711 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 344,666198, Content Width : 7900,72002466667
Extra
2012-08-19 21:19:18,727 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 8245,38622266667
Extra
2012-08-19 21:19:18,727 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 344,99953, Content Width : 8245,38622266667
Extra
2012-08-19 21:19:18,742 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 8590,38575266667
Extra
2012-08-19 21:19:18,742 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 345,332862, Content Width : 8590,38575266667
Extra
2012-08-19 21:19:18,760 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 8935,71861466667
Extra
2012-08-19 21:19:18,761 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 345,666194, Content Width : 8935,71861466667
Extra
2012-08-19 21:19:18,775 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 9281,38480866667
Extra
2012-08-19 21:19:18,775 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 345,999526, Content Width : 9281,38480866667
Extra
2012-08-19 21:19:18,803 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 9627,38433466667
Extra
2012-08-19 21:19:18,803 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 346,332858, Content Width : 9627,38433466667
Extra
2012-08-19 21:19:18,819 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 9973,71719266667
Extra
2012-08-19 21:19:18,819 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 346,66619, Content Width : 9973,71719266667
Extra
2012-08-19 21:19:18,835 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 10320,3833826667
Extra
2012-08-19 21:19:18,835 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 346,999522, Content Width : 10320,3833826667
Extra
2012-08-19 21:19:18,850 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 10667,3829046667
Extra
2012-08-19 21:19:18,850 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 347,332854, Content Width : 10667,3829046667
Extra
2012-08-19 21:19:18,868 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 11014,7157586667
Extra
2012-08-19 21:19:18,868 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 347,666186, Content Width : 11014,7157586667
Extra
2012-08-19 21:19:18,882 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 11362,3819446667
Extra
2012-08-19 21:19:18,882 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 347,999518, Content Width : 11362,3819446667
Extra
2012-08-19 21:19:18,896 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 11710,3814626667
Extra
2012-08-19 21:19:18,896 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 348,33285, Content Width : 11710,3814626667
Extra
2012-08-19 21:19:18,912 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 12058,7143126667
Extra
2012-08-19 21:19:18,912 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 348,666182, Content Width : 12058,7143126667
Extra
2012-08-19 21:19:18,925 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 12407,3804946667
Extra
2012-08-19 21:19:18,926 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 349,00031, Content Width : 12407,3804946667
Extra
2012-08-19 21:19:18,943 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 12756,3808046667
Extra
2012-08-19 21:19:18,943 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 349,332514, Content Width : 12756,3808046667
Extra
2012-08-19 21:19:18,962 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 13105,7133186667
Extra
2012-08-19 21:19:18,962 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 349,665846, Content Width : 13105,7133186667
Extra
2012-08-19 21:19:18,978 [9] DEBUG Knauf.Views.PhotoView - Initial Content control Width : 13455,3791646667
Extra
2012-08-19 21:19:18,978 [9] DEBUG Knauf.Views.PhotoView - Modified new size Width : 350, Content Width : 13455,3791646667
Extra

What is wrong, or what is the reason that Content.Width do not match e.NewSize.Width ?

Thnaks for help
regards
serge

---

Your knowledge is enhanced by that of others.

Answer 3

Reason is that you are adding new Width to ActualWidth. Try following code.

if (e.PreviousSize.Width != e.NewSize.Width)
            {
                this.Width = e.NewSize.Width;

---

Gaurav Khanna | Microsoft VB.NET MVP

Answer 4

Hi Serge Caldrara,

<Setter Property="Width" Value="{Binding Path=Content.ActualWidth, RelativeSource={RelativeSource Self}, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>
<Setter Property="Height" Value="{Binding Path=Content.ActualHeight, RelativeSource={RelativeSource Self}, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>

I think this is a correct direction, however, I suggest you bind to a UIElement, based on my understanding, your scenario is two part in Grid control in two colum, when the second colum is resized, you need outer control(container) can be resize as well.

1) you have to define your Grid column as "Auto",

<ColumnDefinition Width="Auto"/>

2) put a Control inside this column:

 <Rectangle x:Name="Column0WidthRect" Grid.Column="1"/>

3) get this Rect's ActualWidth:

"{Binding ElementName=Column0WidthRect, Path=ActualWidth}"

and then when you resize this column, Rect's ActualWidth will be changed, this binding will work and provide you correct value, if you need multi value, you could use MultiBinding.

If you want to use another value based on this ActualWidth, you could add a Binding converter.

Best regards,

---

Sheldon _Xiao[MSFT]
MSDN Community Support | Feedback to us
Microsoft
Please remember to mark the replies as answers if they help and unmark them if they provide no help.

Answer 5

Hello Sheldon_Xiao,

Thnaks for your reply

I do not understand where should I put the bindoing to the rectangle you explain.

Doe it meand I have to replace :

<Setter Property="Width" Value="{Binding Path=Content.ActualWidth, RelativeSource={RelativeSource Self}, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"/>

with

<Setter Property="Width" Value="{Binding ElementName=Column0WidthRect, Path=ActualWidth}"/>

???

---

Your knowledge is enhanced by that of others.

Answer 6

yes, you could pass value there, however, maybe you can not use "ElementName" to set binding source, you could try to pass value by other data source.

---

Sheldon _Xiao[MSFT]
MSDN Community Support | Feedback to us
Microsoft
Please remember to mark the replies as answers if they help and unmark them if they provide no help.