WP7实例篇之土豆搜索器（1）

修改说明：由于youku的api不怎么geli ，转而采用土豆的api，文章下方就不怎么修改了，大家可以自行修改项目中的文本.

学习wp7也有一段时间了，就以一个小demo实现wp7优酷搜索器来练练手。

首先，我们使用expression blend 4创建项目，命名为wp7youkusearch，然后设计其主页，如下图

 

接着我们创建示例数据来进行绑定，导航之data面板（如果没有，可以选择菜单栏的windows->data ）,选择new sample data… 用于数据绑定。

可以看到blend默认给我们生成了两个属性，一个是字符串类型的，一个是布尔类型的。我们将布尔类型改为image类型，然后将collection拖至页面中，可以看到此时页面中自动生成了一个列表（在对象和时间面板中看到是listbox），列表中有一些字符串和图片

并且data面板中的sampledatasource外围包围着黄色的框，表示这个数据源被用于绑定了。

如果我们觉得blend自动生成的模板达不到我们的要求，或者说我们需要重排模板，右击listbox，选择edit additional templates—> edit generated items（itemtemplate）—> edit current，如下图

此时我们就可以编辑模板了，注意此时默认的容器是stackpanel，我们可以通过右击stackpanel，选择change layout type来改变布局的类型，这里我们选择grid，如下图

调整界面后，大致的模板是这样的：

 

我们需要将textbox的textwarping设为warp以便当字符串多的时候能自动换行：

退出模板编辑，切换到xaml代码界面，可以看到有类似如下的资源代码：

 

关于更多expression blend的技巧可以看笔者的 《expression blend 知识锦分享》，这里不做过多的介绍