如何访问XAML DataTemplate中的控件?

时间:2013-05-04 14:30:09

标签: c# windows-8 windows-store-apps winrt-xaml flipview

我有这个翻转视图:

<FlipView x:Name="models_list" SelectionChanged="selectionChanged">
 <FlipView.ItemTemplate>
          <DataTemplate>
                <Grid x:Name="cv">
                        <Image x:Name="img1" Source = "{Binding ModelImage}" Stretch="Fill" Tag="{Binding ModelTag}"/>
                </Grid>
           </DataTemplate>
  </FlipView.ItemTemplate>

我想找到当前所选索引的img1。在搜索时我在这里的一些帖子中找到了这个方法:

private DependencyObject FindChildControl<T>(DependencyObject control, string ctrlName)
    {
        int childNumber = VisualTreeHelper.GetChildrenCount(control);
        for (int i = 0; i < childNumber; i++)
        {
            DependencyObject child = VisualTreeHelper.GetChild(control, i);
            FrameworkElement fe = child as FrameworkElement;
            // Not a framework element or is null
            if (fe == null) return null;

            if (child is T && fe.Name== ctrlName)
            {
                // Found the control so return
                return child;
            }
            else
            {
                // Not found it - search children
                DependencyObject nextLevel = FindChildControl<T>(child, ctrlName);
                if (nextLevel != null)
                    return nextLevel;
            }
        }
        return null;
    }

它返回我在flipview的第一个索引上的图像,但我需要当前所选索引上的一个..我试图编辑此方法但我无法找到所需的控件。任何人都可以帮助我吗?

6 个答案:

答案 0 :(得分:51)

您遇到的问题是DataTemplate正在重复,而FlipView正在生成内容。 Name未公开,因为它会与之前生成的兄弟(或下一个将要生成的兄弟)冲突。

因此,要在DataTemplate中获取命名元素,您必须首先获取生成的项目,然后在该生成的项目内搜索所需的元素。请记住,XAML中的逻辑树是您按名称访问事物的方式。生成的项目不在逻辑树中。相反,它们位于Visual Tree中(所有控件都在Visual Tree中)。这意味着它必须在Visual Tree中搜索您要引用的控件。 VisualTreeHelper允许您执行此操作。

现在,怎么做?

我写了一篇关于此的文章,因为它是一个反复出现的问题:http://blog.jerrynixon.com/2012/09/how-to-access-named-control-inside-xaml.html但是解决方案的核心是一个看起来像这样的递归方法:

public void TestFirstName()
{
    foreach (var item in MyFlipView.Items)
    {
        var _Container = MyFlipView.ItemContainerGenerator
            .ContainerFromItem(item);
        var _Children = AllChildren(_Container);

        var _FirstName = _Children
            // only interested in TextBoxes
            .OfType<TextBox>()
            // only interested in FirstName
            .First(x => x.Name.Equals("FirstName"));

        // test & set color
        _FirstName.Background = 
            (string.IsNullOrWhiteSpace(_FirstName.Text))
            ? new SolidColorBrush(Colors.Red)
            : new SolidColorBrush(Colors.White);
    }
}

public List<Control> AllChildren(DependencyObject parent)
{
    var _List = new List<Control>();
    for (int i = 0; i < VisualTreeHelper.GetChildrenCount(parent); i++)
    {
        var _Child = VisualTreeHelper.GetChild(parent, i);
        if (_Child is Control)
            _List.Add(_Child as Control);
        _List.AddRange(AllChildren(_Child));
    }
    return _List;
}

这里的关键问题是这样的方法会获取所有子项,然后在结果的子控件列表中,您可以搜索所需的特定控件。有意义吗?

现在回答你的问题!

因为您特别想要当前选择的项目,所以您只需更新代码:

if (MyFlipView.SelectedItem == null)
    return;
var _Container = MyFlipView.ItemContainerGenerator
    .ContainerFromItem(MyFlipView.SelectedItem);
// then the same as above...

答案 1 :(得分:12)

也许更通用的方法可能是这样的:

private List<Control> AllChildren(DependencyObject parent)
{
    var _List = new List<Control>();
    for (int i = 0; i < VisualTreeHelper.GetChildrenCount(parent); i++)
    {
       var _Child = VisualTreeHelper.GetChild(parent, i);
       if (_Child is Control)
       {
        _List.Add(_Child as Control);
       }
      _List.AddRange(AllChildren(_Child));
    }
    return _List;
 } 


private T FindControl<T> (DependencyObject parentContainer, string controlName)
{            
        var childControls = AllChildren(parentContainer);
        var control = childControls.OfType<Control>().Where(x => x.Name.Equals(controlName)).Cast<T>().First();           
        return control;
}

您可以像这样调用FindControl:

var parentContainer = this.flipView.ItemContainerGenerator.ContainerFromItem(this.flipView.SelectedItem);
var myImage = FindControl<Image>(parentContainer, "img1");

//suppose you want to change the visibility
myImage.Visibility = Windows.UI.Xaml.Visibility.Collapsed;         

答案 2 :(得分:3)

访问DataTemplate中元素的简单解决方案是将DataTemplate的内容包装在UserControl中,您可以在其中访问ItemsControl项中的所有UI元素。我认为FlipView通常虚拟化它的项目,所以即使你有100个项目绑定到它 - 只有2-3个实际上可能在UI中有一个当前表示(其中1-2个隐藏),所以你必须记住,当你想要替换任何东西,只在项目加载到控件中时才实际进行更改。

如果您确实需要识别表示ItemsSource中项目的项容器 - 您可以检查FlipView的ItemContainerGenerator属性及其ContainerFromItem()方法。

要获取项目的坐标,可以使用WinRT XAML Toolkit中的GetBoundingRect()扩展方法。

总的来说,根据您的评论,最佳方法可能实际上完全不同。如果要将FlipView绑定到源 - 通常可以通过更改绑定源集合项的属性来控制显示或覆盖的图像。

答案 3 :(得分:0)

如果您只想点击项目上的屏幕坐标...您可以在图像上注册一个点击处理程序,然后使用senderimg.transform tovisual(null)这将为您提供一个generaltransforn,您可以从中获取当前点坐标。 / p>

答案 4 :(得分:0)

我整天都在苦苦挣扎,似乎控件必须加载(渲染)才能从DataTemplate获取它的子控件。这意味着您无法在窗口加载,初始化时使用此代码或任何代码(用于相同目的)... 您可以在控件初始化后使用它,例如在SelectedItem上。

我建议使用转换器并在转换器中定义请求的操作,而不是直接控制访问。

答案 5 :(得分:0)

因此,如果您通过绑定分配了Source,为什么不对rest执行相同的操作: <FlipView SelectedIndex="{Binding SIndex}" SelectedItem="{Binding SItem}" SelectedValue="{Binding SValue}"/>

您必须先准备此房产的地点。它可能是一个派生自INotifyPropertyChanged的类。

雇用 MVVM 为你工作,在XAML中做得最多。当然,在开始时它似乎更多的工作,但与MVVM更复杂的项目将是连贯和灵活的。