silverlight4

Silverlight的ComboBox的绑定和取值

Silverlight的ComboBox与winform中的ComboBox存在类似的地⽅，但也有不同之处，本章包含以下内容:

⼀、ComboBox如何添加和绑定数据。

⼆、ComboBox如何添加⾃定义Item。

三、ComboBox如何取得所选项的值。

⾸先我们在页⾯添加4个ComboBox分别⽤不同的形式进⾏绑定。

代码

SelectionChanged="comboBox_SelectionChanged"/>

SelectionChanged="comboBox3_SelectionChanged"/>

接下来，我们先介绍添加和绑定数据的⽅法。

如何添加和绑定数据:

("武汉");

("⼤连");

("苏州");

上⾯的代码⽤最简单的⽅法添加了3个string类型的对象到comboBox中，运⾏后效果如下:

对于⾃定义的数据类型我们可以⽤下⾯的⽅法进⾏绑定:

第⼀步:定义数据对象

publicclassMyData

{

publicDateTimeTime

{get;set;}

publicstringPlace

{get;set;}

}

第⼆步:填充数据，并进⾏绑定:

代码

Listlist=newList

{

newMyData{Time=s(1),Place="中⼭路"},

newMyData{Time=s(2),Place="光⾕⾼新"}

};

yMemberPath="Place";

ource=list;

我们通过设置yMemberPath="Place"来定义显⽰哪个字段。运⾏效果如下图:

是不是很简单呢，那么接下来我们介绍⼀下如何进⾏⾃定义Item的添加。

如何添加⾃定义Item:

要添加⾃定义Item我们就需要⽤到ComboBoxItem对象。

代码

ComboBoxItemcbiRight=newComboBoxItem();

ound=newSolidColorBrush();

ntalContentAlignment=;

ue(tProperty,"上海");

ComboBoxItemcbiCenter=newComboBoxItem();

ound=newSolidColorBrush();

ntalContentAlignment=;

ue(tProperty,"北京");

ComboBoxItemcbiLeft=newComboBoxItem();

ound=newSolidColorBrush(ray);

ntalContentAlignment=;

ue(tProperty,"深圳");

在上⾯的代码中，我们分别对3个ComboBoxItem对象设置了背景⾊、对齐⽅式和值，剩下要做的只需要将这些对象添加到ComboBox中即

可。

(cbiRight);

(cbiCenter);

(cbiLeft);

运⾏效果如下:

在某些情况下我们需要显⽰更复杂的效果，⽐如在下拉框中显⽰图⽚，那这样的需求应该如何处理呢？看看后⾯的代码就知道了。

既然我们需要显⽰图⽚，那么我们就先定义⼀个Image图⽚对象，然后我们在定义⼀个Label进⾏⽂字显⽰。

Imageimg=newImage();

=newBitmapImage(newUri("",ve));

Labellbl=newLabel();

t="带图⽚的选项";

然后我们需要⽤⼀个容器装载这两个对象，这⾥我们使⽤的是StackPanel。

StackPanelsp=newStackPanel();

ation=ntal;

(img);

(lbl);

在这⾥可以看到我们在设置StackPanel的⽅向时选择的是ntal，就表⽰我们添加的两个对象会⽔平的显⽰在下拉框中。

最后⼀步就是把这个容器加载到我们的ComboBox中。

ComboBoxItemmultipleCmb=newComboBoxItem();

t=sp;

(multipleCmb);

运⾏结果如下，我们可以看到图⽚和⽂字同时现实在⼀个选择项内。

现在我们已经⽤不同的⽅法把数据添加到ComboBox中了，接下来的问题就是如何取得所选项的值。

如何取得所选项的值:

⼀般情况下有两种⽅式进⾏取值代码如下:

代码

privatevoidcomboBox3_SelectionChanged(objectsender,SelectionChangedEventArgse)

{

MyDatamd=(senderasComboBox).SelectedItemasMyData;

DateTimeselectedDateTime=;

stringselectedPlace=;

MyDatamd2=edValueasMyData;

DateTimeselectedDateTime2=;

stringselectedPlace2=;

}

这⾥的MyData是我们在前⾯⾃定义的数据类型，当我们在SelectionChanged事件中进⾏取值时，可分别对SelectedItem和SelectedValue

进⾏操作，

我们只需要将它们显⽰的转换成正确的数据类型即可。

本章所涉及的完整代码:

代码

xmlns="/winfx/2006/xaml/presentation"

xmlns:x="/winfx/2006/xaml"

xmlns:d="/expression/blend/2008"

xmlns:mc="/markup-compatibility/2006"

mc:Ignorable="d"

d:DesignHeight="600"d:DesignWidth="800">

SelectionChanged="comboBox_SelectionChanged"/>

SelectionChanged="comboBox3_SelectionChanged"/>