在usercontrol中使用Gridview控件

时间:2013-06-20 23:48:43

标签: windows-store-apps

我正在尝试使用以下要求创建UserControl。

Usercontrol包含gridview,在侧面gridview中,我需要添加一个按钮元素。因此,我们的想法是: - 如果通过向ItemSource提供集合在任何其他页面中使用usercontrol,则应生成按钮列表,并且Button内容值应该是Itemsource集合中存在的类型的属性值之一。

我是Windows应用程序编程的新手。我试图通过创建依赖项属性来公开gridview ItemSources属性,以便可以映射任何类型的ObservableCollection并尝试公开依赖项属性以绑定到按钮内容属性。但不能达到同样的目的。如果你能指出一个同样的样本应用程序我真的很感激。

提前多多感谢。

1 个答案:

答案 0 :(得分:0)

这是一个小样本(我希望你想做的事)......

编辑:我最后编辑了我的答案,提供了属性路径的属性。如果任何人有这个问题的另一个解决方案,请让我知道!

为绑定路径添加依赖项属性:

首先,我们创建一个虚拟模型,为我们的按钮提供标题:

public class SampleModel
{
    public string Title { get; set; }
}

然后,用户控制。这里重要的是ItemsSource-Binding(ElementName = UserControl)。否则,您将绑定到Parent-DataContext中的UserControlItemsSource。

编辑:自上次回答以来,该按钮已更改!

<UserControl
x:Class="StackOverflow.ListUserControl"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:StackOverflow"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="400"
x:Name="SampleUserControl">

<Grid>
    <ListView ItemsSource="{Binding UserControlItemsSource, ElementName=SampleUserControl}" Background="DeepSkyBlue" SelectionMode="None">
        <ListView.ItemTemplate>
            <DataTemplate>
                <Button Loaded="FrameworkElement_OnLoaded"/>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</Grid>
</UserControl>

...以及usercontrol的代码隐藏,包括UsercontrolItemsSource:

编辑:我在上一次回答后添加了依赖项属性 BindingPropertyPath FrameworkElement_OnLoaded 方法。

public sealed partial class ListUserControl : UserControl
{
    public ObservableCollection<SampleModel> UserControlItemsSource
    {
        get { return (ObservableCollection<SampleModel>)GetValue(UserControlItemsSourceProperty); }
        set { SetValue(UserControlItemsSourceProperty, value); }
    }

    // Using a DependencyProperty as the backing store for UserControlItemsSource.  This enables animation, styling, binding, etc...
    public static readonly DependencyProperty UserControlItemsSourceProperty =
        DependencyProperty.Register("UserControlItemsSource", typeof(ObservableCollection<SampleModel>), typeof(ListUserControl), new PropertyMetadata(null));


    public string BindingPropertyPath
    {
        get { return (string)GetValue(BindingPropertyPathProperty); }
        set { SetValue(BindingPropertyPathProperty, value); }
    }

    // Using a DependencyProperty as the backing store for BindingPropertyPath.  This enables animation, styling, binding, etc...
    public static readonly DependencyProperty BindingPropertyPathProperty =
        DependencyProperty.Register("BindingPropertyPath", typeof(string), typeof(ListUserControl), new PropertyMetadata(string.Empty));


    public ListUserControl()
    {
        this.InitializeComponent();
    }

    private void FrameworkElement_OnLoaded(object sender, RoutedEventArgs e)
    {
        Button button = sender as Button;
        Binding contentBinding = new Binding();
        contentBinding.Path = new PropertyPath(this.BindingPropertyPath);
        button.SetBinding(Button.ContentProperty, contentBinding);
    }
}

现在我们将usercontrol添加到我们的主页面(ListPageHost):

编辑:将新的依赖项属性 BindingPropertyPath 设置为您要用于该按钮的ItemsSource属性的名称。

<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>

    <Button Grid.Row="0" Content="Add Item to ItemsSource" Click="ButtonBase_OnClick"></Button>
    <local:ListUserControl Grid.Row="1" UserControlItemsSource="{Binding SampleCollection}" BindingPropertyPath="Title"/>
</Grid>

在主页的代码隐藏中,我们声明了我们的mainpage-viewmodel(ListPageHostViewModel):

public class ListPageHostViewModel
{
    private readonly ObservableCollection<SampleModel> _sampleCollection = new ObservableCollection<SampleModel>();

    public ObservableCollection<SampleModel> SampleCollection
    {
        get { return _sampleCollection; }
    }
}

...和MainPage的(ListPageHost)代码背后:

public sealed partial class ListPageHost : Page
{
    public ListPageHost()
    {
        this.InitializeComponent();
        this.DataContext = new ListPageHostViewModel();
    }

    /// <summary>
    /// Invoked when this page is about to be displayed in a Frame.
    /// </summary>
    /// <param name="e">Event data that describes how this page was reached.  The Parameter
    /// property is typically used to configure the page.</param>
    protected override void OnNavigatedTo(NavigationEventArgs e)
    {
    }

    private void ButtonBase_OnClick(object sender, RoutedEventArgs e)
    {
        var vm = this.DataContext as ListPageHostViewModel;
        if (vm != null)
        {
            vm.SampleCollection.Add(new SampleModel() { Title = string.Format("new item {0}", DateTime.Now.Ticks)});
        }
    }
}

希望这就是你要找的东西。如果您有任何疑问 - 请告诉我。 此致,Alex