在 WinRT 中获取 UIElement 的大小
Get Size of UIElement in WinRT
我有一个canvas。当我单击它时,我得到了鼠标的坐标,向上(添加一个 child)在那里有自定义控件(一个带有简单圆圈的拇指)。
在屏幕上,逻辑上,添加时以左上角为参考。我希望将拇指中心准确地放在我单击的位置(见图。红星 = 我单击的位置)。
要做什么,我需要获取拇指的实际宽度和高度,然后计算准确的坐标以将拇指的中心放置在用户单击的位置。有没有更好的办法 ?
在 WPF 中,我使用了这段代码,但它在 WinRT 中不起作用。
//Circle in thumb
Ellipse Bdr = this.GetTemplateChild("Forme") as Ellipse;
DependencyObject dobj = VisualTreeHelper.GetParent(Bdr);
Vector ParentPosition = VisualTreeHelper.GetOffset((Visual)VisualTreeHelper.GetParent(dobj));
Vector BdrPosition = VisualTreeHelper.GetOffset((Visual)dobj);
return new Point((Position.X+BdrPosition.X) + Bdr.ActualWidth /2,(Position.Y+ ParentPosition.Y) + Bdr.ActualHeight / 2);
你能帮帮我吗?谢谢!
ActualHeight
和 ActualWidth
属性在未加载 FrameworkElement
之前保持为 0。另一方面,如果您在 ControlTemplate
中调整了 Ellipse
的大小,则可以在 OnApplyTemplate()
中获取它的大小。您可以使用委托将高度和宽度传递给容器 Page
。即
ThumbControl
public class ThumbControl : Control
{
public IThumbSize thumbSize;
public ThumbControl()
{
this.DefaultStyleKey = typeof(ThumbControl);
}
protected override void OnApplyTemplate()
{
base.OnApplyTemplate();
Ellipse child = this.GetTemplateChild("circle") as Ellipse;
if (thumbSize != null)
thumbSize.SizeMeasured(child.Width, child.Height);
}
}
ThumbControl 的样式
<Style TargetType="local:ThumbControl">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="local:ThumbControl">
<Ellipse x:Name="circle"
Fill="Blue"
Height="50"
Width="50"></Ellipse>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
IThumb 界面
public interface IThumbSize
{
void SizeMeasured(double width, double height);
}
ContainerPage.xaml
<Grid Background="Black">
<Canvas x:Name="rootCanvas"
Background="Transparent"
PointerReleased="rootCanvas_PointerReleased"></Canvas>
</Grid>
ContainerPage.xaml.cs
public sealed partial class ContainerPage: Page, IThumbSize
{
ThumbControl thumbControl = new ThumbControl();
Point touchPoint = new Point();
public ContainerPage()
{
this.InitializeComponent();
thumbControl.thumbSize = this;
}
private void rootCanvas_PointerReleased(object sender, PointerRoutedEventArgs e)
{
PointerPoint pt = e.GetCurrentPoint(rootCanvas);
touchPoint.X = pt.Position.X;
touchPoint.Y = pt.Position.Y;
if (!rootCanvas.Children.Contains(thumbControl))
rootCanvas.Children.Add(thumbControl);
Canvas.SetLeft(thumbControl, touchPoint.X - (thumbControl.ActualWidth / 2));
Canvas.SetTop(thumbControl, touchPoint.Y - (thumbControl.ActualHeight / 2));
}
public void SizeMeasured(double width, double height)
{
Canvas.SetLeft(thumbControl, touchPoint.X - (width / 2));
Canvas.SetTop(thumbControl, touchPoint.Y - (height / 2));
}
}
希望对您有所帮助。
我有一个canvas。当我单击它时,我得到了鼠标的坐标,向上(添加一个 child)在那里有自定义控件(一个带有简单圆圈的拇指)。 在屏幕上,逻辑上,添加时以左上角为参考。我希望将拇指中心准确地放在我单击的位置(见图。红星 = 我单击的位置)。
要做什么,我需要获取拇指的实际宽度和高度,然后计算准确的坐标以将拇指的中心放置在用户单击的位置。有没有更好的办法 ? 在 WPF 中,我使用了这段代码,但它在 WinRT 中不起作用。
//Circle in thumb
Ellipse Bdr = this.GetTemplateChild("Forme") as Ellipse;
DependencyObject dobj = VisualTreeHelper.GetParent(Bdr);
Vector ParentPosition = VisualTreeHelper.GetOffset((Visual)VisualTreeHelper.GetParent(dobj));
Vector BdrPosition = VisualTreeHelper.GetOffset((Visual)dobj);
return new Point((Position.X+BdrPosition.X) + Bdr.ActualWidth /2,(Position.Y+ ParentPosition.Y) + Bdr.ActualHeight / 2);
你能帮帮我吗?谢谢!
ActualHeight
和 ActualWidth
属性在未加载 FrameworkElement
之前保持为 0。另一方面,如果您在 ControlTemplate
中调整了 Ellipse
的大小,则可以在 OnApplyTemplate()
中获取它的大小。您可以使用委托将高度和宽度传递给容器 Page
。即
ThumbControl
public class ThumbControl : Control
{
public IThumbSize thumbSize;
public ThumbControl()
{
this.DefaultStyleKey = typeof(ThumbControl);
}
protected override void OnApplyTemplate()
{
base.OnApplyTemplate();
Ellipse child = this.GetTemplateChild("circle") as Ellipse;
if (thumbSize != null)
thumbSize.SizeMeasured(child.Width, child.Height);
}
}
ThumbControl 的样式
<Style TargetType="local:ThumbControl">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="local:ThumbControl">
<Ellipse x:Name="circle"
Fill="Blue"
Height="50"
Width="50"></Ellipse>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
IThumb 界面
public interface IThumbSize
{
void SizeMeasured(double width, double height);
}
ContainerPage.xaml
<Grid Background="Black">
<Canvas x:Name="rootCanvas"
Background="Transparent"
PointerReleased="rootCanvas_PointerReleased"></Canvas>
</Grid>
ContainerPage.xaml.cs
public sealed partial class ContainerPage: Page, IThumbSize
{
ThumbControl thumbControl = new ThumbControl();
Point touchPoint = new Point();
public ContainerPage()
{
this.InitializeComponent();
thumbControl.thumbSize = this;
}
private void rootCanvas_PointerReleased(object sender, PointerRoutedEventArgs e)
{
PointerPoint pt = e.GetCurrentPoint(rootCanvas);
touchPoint.X = pt.Position.X;
touchPoint.Y = pt.Position.Y;
if (!rootCanvas.Children.Contains(thumbControl))
rootCanvas.Children.Add(thumbControl);
Canvas.SetLeft(thumbControl, touchPoint.X - (thumbControl.ActualWidth / 2));
Canvas.SetTop(thumbControl, touchPoint.Y - (thumbControl.ActualHeight / 2));
}
public void SizeMeasured(double width, double height)
{
Canvas.SetLeft(thumbControl, touchPoint.X - (width / 2));
Canvas.SetTop(thumbControl, touchPoint.Y - (height / 2));
}
}
希望对您有所帮助。