在数据模板中向用户控件传递附加参数

7

这是我正在使用的XAML代码

  <GridView
        Grid.Row="0"
        x:Name="RootGrid"
        SelectionMode="None"
        IsItemClickEnabled="True"
        ItemsSource="{Binding RootListSource}">

        <GridView.ItemTemplate>
            <DataTemplate>
                <UserControl:TreeInfoControl/>
            </DataTemplate>
        </GridView.ItemTemplate>

    </GridView>

在我的用户控件中,它包含另一个GridView,其中保存了不同的IEnumerable集合。我想要实现的是通过代码传递这个集合。我尝试通过向treecontrol添加一个依赖属性来实现,但它并没有起作用。因此,我正在寻找一种解决方案,可以通过xaml(以某种方式通过用户控件)传递集合。我知道可以将该集合添加到我的现有集合中并绑定该集合。但现在我无法使用那种方法。

3
我也在寻找解决这个问题的方法。在WPF中是可能的。 - Stephan Ronald
很遗憾你不能使用有效的技术。 - Jerry Nixon
1个回答

7

以下是操作步骤:

从App.xaml开始,这样我们可以重用演示模板。

<Application.Resources>
    <DataTemplate x:Key="MyContentControl">
        <Grid Height="100" Width="100" Background="Maroon">
            <TextBlock Text="{Binding FallbackValue=0}" Foreground="White" FontSize="40" VerticalAlignment="Center" HorizontalAlignment="Center" />
        </Grid>
    </DataTemplate>
</Application.Resources>

然后我们可以定义您的用户控件。
<d:UserControl.DataContext>
    <local:MyControlViewModel Number="-1" Letter="~K" />
</d:UserControl.DataContext>

<StackPanel Orientation="Horizontal" VerticalAlignment="Top" HorizontalAlignment="Left">
    <ContentControl Content="{Binding Number}" 
                    ContentTemplate="{StaticResource MyContentControl}" />
    <ListView ItemsSource="{Binding Letters}" IsHitTestVisible="False"
              ItemTemplate="{StaticResource MyContentControl}"
              SelectedItem="{Binding Letter, Mode=TwoWay}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <ItemsStackPanel Orientation="Horizontal"/>
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
    </ListView>
</StackPanel>

然后我们可以定义您的MainPage.xaml

<Page.DataContext>
    <local:MainPageViewModel Letter="C" />
</Page.DataContext>

<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="140" />
        <ColumnDefinition />
    </Grid.ColumnDefinitions>
    <ListView x:Name="MyList" ItemsSource="{Binding Letters}" 
              ItemTemplate="{StaticResource MyContentControl}"
              SelectedItem="{Binding Letter, Mode=TwoWay}" />
    <ListView Grid.Column="1" ItemsSource="{Binding Numbers}">
        <ListView.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <StackPanel.Resources>
                        <local:MyControlViewModel 
                            x:Key="MyDataContext" Number="{Binding}" 
                            Letters="{Binding ItemsSource, ElementName=MyList}" 
                            Letter="{Binding SelectedItem, ElementName=MyList}" />
                    </StackPanel.Resources>
                    <local:MyControl DataContext="{StaticResource MyDataContext}" />
                </StackPanel>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>

还没有什么特别的,对吧?等等,我们正在为用户控件创建视图模型,从周围的范围设置视图模型的属性,然后明确将其传递到用户控件的DataContext中。很酷,是吗?如果您仔细考虑,这就足够简单了。想在“<Xaml />”标记内设置这些属性吗?当然你想。但你不能。操作顺序会完全错误。你只能相信我。

现在,您的用户控件没有零代码。但视图模型看起来像这样:

public class MyControlViewModel : BindableBase
{
    public int Number
    {
        get { return (int)GetValue(NumberProperty); }
        set
        {
            SetValue(NumberProperty, value);
            base.RaisePropertyChanged();
        }
    }
    public static readonly DependencyProperty NumberProperty =
        DependencyProperty.Register("Number", typeof(int), typeof(MyControlViewModel),
        new PropertyMetadata(0, (s, e) => { }));

    public string Letter
    {
        get { return (string)GetValue(LetterProperty); }
        set
        {
            SetValue(LetterProperty, value);
            base.RaisePropertyChanged();
        }
    }
    public static readonly DependencyProperty LetterProperty =
        DependencyProperty.Register("Letter", typeof(string), typeof(MyControlViewModel),
        new PropertyMetadata("Z", (s, e) => { }));

    public ObservableCollection<string> Letters
    {
        get { return (ObservableCollection<string>)GetValue(LettersProperty); }
        set
        {
            SetValue(LettersProperty, value);
            base.RaisePropertyChanged();
        }
    }
    public static readonly DependencyProperty LettersProperty =
        DependencyProperty.Register("Letters", typeof(ObservableCollection<string>),
        typeof(MyControlViewModel),
        new PropertyMetadata(new ObservableCollection<string>(new[] { "~W", "~X", "~Y", "~Z" }), (s, e) => { }));
}

所有属性都是依赖属性。希望你已经注意到了。我这样做并不仅仅是因为我喜欢打字,虽然我确实喜欢打字。实际上,我这样做是因为为了进行内部绑定,必须使用一个依赖属性 - 并且是引发属性更改的依赖属性!最后一部分并不是微不足道的。但是它必须在视图模型中吗?不是必须的。但我喜欢这样。
你可以参考这个链接:http://blog.jerrynixon.com/2013/07/solved-two-way-binding-inside-user.html 此外,你的MainPage没有任何代码背景。但是视图模型看起来像这样:
public class MainPageViewModel : BindableBase
{
    public MainPageViewModel()
    {
        this._Letters = new ObservableCollection<string>(new[] { "A", "B", "C", "D" });
        this._Numbers = new ObservableCollection<int>(new[] { 1, 2, 3, 4 });
    }

    public string Letter
    {
        get { return (string)GetValue(LetterProperty); }
        set
        {
            SetValue(LetterProperty, value);
            base.RaisePropertyChanged();
        }
    }
    public static readonly DependencyProperty LetterProperty =
        DependencyProperty.Register("Letter", typeof(string), typeof(MyControlViewModel),
        new PropertyMetadata("Z", (s, e) => { }));

    ObservableCollection<string> _Letters = new ObservableCollection<string>();
    public ObservableCollection<string> Letters { get { return _Letters; } }

    ObservableCollection<int> _Numbers = new ObservableCollection<int>();
    public ObservableCollection<int> Numbers { get { return _Numbers; } }
}

可绑定基类是标准的,以下是其代码:
public abstract class BindableBase : DependencyObject, System.ComponentModel.INotifyPropertyChanged
{

    public event System.ComponentModel.PropertyChangedEventHandler PropertyChanged;
    protected void SetProperty<T>(ref T storage, T value, [System.Runtime.CompilerServices.CallerMemberName] String propertyName = null)
    {
        if (!object.Equals(storage, value))
        {
            storage = value;
            if (PropertyChanged != null)
                PropertyChanged(this, new System.ComponentModel.PropertyChangedEventArgs(propertyName));
        }
    }
    protected void RaisePropertyChanged([System.Runtime.CompilerServices.CallerMemberName] String propertyName = null)
    {
        if (PropertyChanged != null)
            PropertyChanged(this, new System.ComponentModel.PropertyChangedEventArgs(propertyName));
    }
}

完成后,您应该得到您想要的东西。像这样:

enter image description here

不要过分简化事情。但是,它真的很简单。
看,当您开始嵌套上下文时,理解XAML并不总是容易的。我不怪你第一次就没理解。但我希望这能帮助您入门。继续努力!
祝你好运!

谢谢你,Nixon。它对我很有帮助。感谢你的建议。 :) - StezPet

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接