How to get the position of a control in silverlight? RSS

• 

  sladapter

  All-Star

  43609 Points

  7910 Posts

  • Reply
  •  

  How to get the position of a control in silverlight?

  Mar 20, 2008 01:09 AM | LINK

   Hi,

  Is there a way to get the position (left, top) of a UIElement?

  I know a control has ActualWidth and ActualHeight property. But I did not see any Position property. I'm not using Canvas so I cannot use Canvas.Left/Canvas.Top either. I need to get the absolute position of a control(say a border) at runtime so I can position some HTML element on top of my silverlight control.

   

   

   

  Sally Xu
  Software Engineer
  Aprimo, Inc
  
  Please remember to mark the replies as answers if they answered your question
• 

  crpietschmann

  Member

  242 Points

  76 Posts

  • Reply
  •  

  Re: How to get the position of a control in silverlight?

  Mar 20, 2008 01:23 AM | LINK

  Here's a code snippet that will get the Top/Left coordinates of the element within the application.
  Replace "this" with the object you want to find the position of.

  GeneralTransform gt = this.TransformToVisual(Application.Current.RootVisual as UIElement);
  Point offset = gt.Transform(new Point(0, 0));
  double controlTop = offset.Y;
  double controlLeft = offset.X;

  Microsoft MVP - Windows Live Platform
  Blog: http://pietschsoft.com | Web.Maps.VE - ASP.NET AJAX Bing Maps Control
• 

  sladapter

  All-Star

  43609 Points

  7910 Posts

  • Reply
  •  

  Re: How to get the position of a control in silverlight?

  Mar 20, 2008 01:35 AM | LINK

  crpietschmann,

  Thank you so much! It works.
  

  Sally Xu
  Software Engineer
  Aprimo, Inc
  
  Please remember to mark the replies as answers if they answered your question
• 

  npcomplete

  Member

  6 Points

  4 Posts

  • Reply
  •  

  Re: How to get the position of a control in silverlight?

  Dec 10, 2008 05:13 PM | LINK

    This however doesn't work with object that have had a Transform applied to them. For example, if a RotateTransform has been applied to it, the top/left point returned will actually be in the bottom/right possition. Is there any way to find the position that takes into account the transform?

• 

  Woshiernog

  Member

  4 Points

  2 Posts

  • Reply
  •  

  Re: Re: How to get the position of a control in silverlight?

  May 29, 2009 05:10 PM | LINK

   Man that is harsh. Why cant there be a ActualPosition property or something.
  

• 

  npcomplete

  Member

  6 Points

  4 Posts

  • Reply
  •  

  Re: Re: How to get the position of a control in silverlight?

  May 29, 2009 05:27 PM | LINK

  I know, I wish there were a simpler way.  Here's how to obtain the four points of an element regardless if there has been a transform applied to it:
  

  // Obtain transform information based off root element
  GeneralTransform gt = element.TransformToVisual(Application.Current.RootVisual);
  
  // Find the four corners of the element
  Point topLeft = gt.Transform(new Point(0, 0));
  Point topRight = gt.Transform(new Point(element.RenderSize.Width, 0));
  Point bottomLeft = gt.Transform(new Point(0, element.RenderSize.Height));
  Point bottomRight = gt.Transform(new Point(element.RenderSize.Width, element.RenderSize.Height));

    

   

• 

  mchlSync

  Star

  14968 Points

  2799 Posts

  • Reply
  •  

  Re: How to get the position of a control in silverlight?

  Sep 21, 2009 05:07 AM | LINK

  Hello,

  It does not work for my button. I got this error "Value does not fall within the expected range.".

  Any idea?

  XAML

  <UserControl

  xmlns:control="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"

  xmlns:template="clr-namespace:System.Windows;assembly=System.Windows.Controls"

  xmlns:layoutToolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Layout.Toolkit" xmlns:controlsToolkit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit" xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" x:Class="SilverlightApplication1.MainPage"

  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

  xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

  xmlns:cal="clr-namespace:Microsoft.Practices.Composite.Presentation.Commands;assembly=Microsoft.Practices.Composite.Presentation"

  xmlns:myctl="clr-namespace:SilverlightClassLibrary1;assembly=SilverlightClassLibrary1"

  mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">

  <UserControl.Resources>

  <DataTemplate x:Key="cellTemplate">

  <Button Content="Button" cal:Click.Command="{Binding ElementName=LayoutRoot,Path=DataContext.SaveCommand}"/>

  </DataTemplate>

  </UserControl.Resources>

  <Grid x:Name="LayoutRoot">

  <StackPanel>

  <data:DataGrid x:Name="dg" AutoGenerateColumns="False" ItemsSource="{Binding Source}" >

  <data:DataGrid.Columns>

  <data:DataGridTextColumn Header="Name"

  Binding="{Binding Name}" />

  <data:DataGridTemplateColumn Header="Text"

  CellTemplate="{StaticResource cellTemplate}"

  />

  </data:DataGrid.Columns>

  </data:DataGrid>

  <Button x:Name="saveButton" Content="Click" cal:Click.Command="{Binding ElementName=LayoutRoot,Path=DataContext.SaveCommand}"

  KeyDown="Button_KeyDown"/>

  </StackPanel>

  </Grid>

  </UserControl>

  C#

  public MainPage() {this.DataContext = this;

  InitializeComponent();

   

  GeneralTransform gt = saveButton.TransformToVisual(Application.Current.RootVisual);

  Point offset = gt.Transform(new Point(0, 0));

  double controlTop = offset.Y;

  double controlLeft = offset.X;

  // Find the four corners of the element

  Point topLeft = gt.Transform(new Point(0, 0));

  Point topRight = gt.Transform(new Point(saveButton.RenderSize.Width, 0));

  Point bottomLeft = gt.Transform(new Point(0, saveButton.RenderSize.Height));Point bottomRight = gt.Transform(new Point(saveButton.RenderSize.Width, saveButton.RenderSize.Height));

  }

  I'm getting this error "Value does not fall within the expected range."

  (If this has answered your question, please click on "Mark as Answer" on this post. Thank you!)
  
  Regards,
  Michael Sync
  Silverlight MVP
  
  Blog : http://michaelsync.net
• 

  sladapter

  All-Star

  43609 Points

  7910 Posts

  • Reply
  •  

  Re: How to get the position of a control in silverlight?

  Sep 22, 2009 11:11 AM | LINK

   If you need to get a control's position, you need to wait until the page is loaded. Move your code to the Loaded event handler:

  public MainPage()
          {
              this.DataContext = this;
  
              InitializeComponent();
              this.Loaded += new RoutedEventHandler(MainPage_Loaded);

  }

  void MainPage_Loaded(object sender, RoutedEventArgs e)
          {
              GeneralTransform gt = saveButton.TransformToVisual(Application.Current.RootVisual);

  
                ...

         }
  

  Sally Xu
  Software Engineer
  Aprimo, Inc
  
  Please remember to mark the replies as answers if they answered your question
• 

  jcclick

  Member

  4 Points

  35 Posts

  • Reply
  •  

  Re: How to get the position of a control in silverlight?

  May 18, 2010 07:57 AM | LINK

  ... And how can I set the position of a UIElement?

• 

  sladapter

  All-Star

  43609 Points

  7910 Posts

  • Reply
  •  

  Re: How to get the position of a control in silverlight?

  May 19, 2010 04:44 PM | LINK

  jcclick

  ... And how can I set the position of a UIElement?

   

  If you want to position a control in absolute position, use Canvas as your Layout panel. Set Canvas.Left/Canvas.Right to the control to position it in the Canvas.

   

  Sally Xu
  Software Engineer
  Aprimo, Inc
  
  Please remember to mark the replies as answers if they answered your question