前面几章连续讲到ListBox的运用,本章要讲得是如何简单的把SampleData 绑进ListBox里
?
前面几章连续讲到ListBox的运用,本章要讲的是如何简单的把SampleData 绑进ListBox里
?
就是要让不会的新手都看的懂!
?
本章范例最後结果:
?
?
01
若你对ListBox还不熟悉,请回到这里重新开始喔~
?
开启一个新的专案,并且在工作区置入一个ListBox
於Data->Creat Sample Data->New Sample Data开始我们的Sample Data建置
?
若是你找不到Data控制版面,请到TopMenu->Window->选取Data後就会出现了
?
点选New Sample Data後会出现设定视窗
这边值得一提的是有个CheckBox选项:"Enable sample data when application is running"
意思是,执行时是否要显示这个绑在ListBox里的假资料,选取为显示,反之则否
?
若是这时候不选择,之後你也可以在Data Source Options做调整
?
这是Blend很聪明的地方:
「为了能让介面设计师与程式设计师的分工更细,并且减少设计双方的认知误差,抛弃传统合作模式很重要的功能之一,这项功能让设计师在设计时能够藉由假资料的代入,模拟最後的成果。」
?
02
接着设定总共四组的Sample Data:
本章范例把四种格式都抓出来设定,分别为Boolean、Image、Number以及String
如果想看更详细的SampleData设定,请看这里。
?
接着点选Collection後直接拖拉进ListBox里,ListBox就会出现刚刚所设定的SampleData了
?
03
接下来修改放进SampleData後,ListBox内资料的排列方式
ListBox->Edit Additional Templates->Edit Generates Items->Edit Current
?
进入了ItemTemplate後,可以看到刚刚代入的四项SampleData被StackPanel包了起来
?
调整下列几项设定:
1)更改StackPanel的排列方式,由Vertical改为Horizontal水平排列
2)全选StackPanel下的四个物件,设定上下左右间格为10、设定排列方式为置中
3)当然你也可以更改字的字型与颜色
?
完成後,按下F5预览你的成果
?
再ListBox的外观调整成你喜欢的样子就大功告成啦~!
?
?
?
?
本篇的教学就到此。
?
?
(若有任何错误的地方,请各位前辈或同好能不吝指教,小女子都会虚心接受;若是你喜欢我的教学,请给我点鼓励,谢谢。)
一步一步迈向HIE之路
喜欢我文章请推我一下或给我个回应,你的鼓励会给我无限的动力喔!
若是您有其他问题或是特别需要,请在文章回应处留言,我会尽快回覆您