欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  移动技术

Windows Phone 实用开发技巧(29):动态绑定Pivot

程序员文章站 2023-12-24 19:42:45
前几天有个网友问我如何动态绑定pivot项,即piovtitem的项是动态的,pivotitem中的数据也是动态的。这个使用mvvm模式可以很方便的实现,在viewmodel中设置一个集合表示当前有...
前几天有个网友问我如何动态绑定pivot项,即piovtitem的项是动态的,pivotitem中的数据也是动态的。这个使用mvvm模式可以很方便的实现,在viewmodel中设置一个集合表示当前有多少个item,集合中的类中含有当前pivotitem中的数据源。下面以一个简单的demo来演示下:
先来看看xaml中是怎么去绑定的
<!--layoutroot is the root grid where all page content is placed-->
<grid x:name="layoutroot" background="transparent">
    <!--pivot control-->
    <controls:pivot title="my application"
                    itemtemplate="{staticresource dt_pivot}"
                    headertemplate="{staticresource dt_header}"
                    itemssource="{binding binddata}">
    </controls:pivot>
</grid>
pivot的数据源绑定是viewmodel中的binddata,itemtemplate表示pivotitem的模板,headertemplate表示pivotitem中header模板,这两个模板分别如下:
<phone:phoneapplicationpage.resources>
    <datatemplate x:key="dt_pivot">
        <listbox itemssource="{binding listdata}">
            <listbox.itemtemplate>
                <datatemplate>
                    <textblock text="{binding}" />
                </datatemplate>
            </listbox.itemtemplate>
        </listbox>
    </datatemplate>
    <datatemplate x:key="dt_header">
        <textblock text="{binding name}" />
    </datatemplate>
</phone:phoneapplicationpage.resources>
headertemplate十分简单,就使用一个textblock表示当前的标题。pivot的itemtemplate里面放置一个listbox,数据源为binddata下的listdata
viewmodel中的数据源:
private observablecollection<testpivot> _binddata;
public observablecollection<testpivot> binddata
{
    get
    {
        return _binddata;
    }
    set
    {
        _binddata = value;
        raisepropertychanged("binddata");
    }
 
}
testpivot即自己定义的类,含有piovtheader和pivotitem数据源的类:
public class testpivot
{
    /// <summary>
    /// property for pivot header
    /// </summary>
    public string name { get; set; }
 
    /// <summary>
    /// data for pivot item datasource(eg.listbox)
    /// </summary>
    public list<string> listdata { get; set; }
}
ok,绑定已经建立好了,现在就是如何初始化数据源了,为了简单起见,以最简单的循环生成绑定源数据:
public void adddata(int size)
{
    binddata = new observablecollection<testpivot>();
    for (int i = 0; i < size; i++)
    {
        testpivot t = new testpivot();
        t.name = "piovt item" + i;
        t.listdata = new list<string>();
        for (int j = 0; j < 10; j++)
        {
            t.listdata.add("list item"+j);
        }
        binddata.add(t);
    }
}
其中size表示当前有几个pivotitem,这里pivot数据源可以是同步方式也可以以异步方式,只要testpivot实现notifypropertychanged,并且属性listdata通知改变即可。
你可以从这里找到源代码:, hope that helps.
 
作者:alexis

上一篇:

下一篇: