Response.Write("Hello LOLOTA")

ComboxBox在 Silverlight的應用上，在我的看法上，就如同ASP.NET的Dropdownlist下拉選單一樣。

在網頁的應用上，Silverlight跟ASP.NET很多控制項使用起來都是差不多的。(但是Silverlight控制項

外觀明顯略勝一籌阿..)。今天，我們來學習如何應用這個控制項。

 

1.

首先，開啟一個Silverlight專案，在專案中，我們新增一個ComboBox控制項：

<UserControl x:Class="D19._1.Page" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="400" Height="300"> <Grid x:Name="LayoutRoot" Background="White"> <ComboBox x:Name="uxComboBox" Width="200" Height="30"> <ComboBoxItem Content="Item1"></ComboBoxItem> <ComboBoxItem Content="Item2"></ComboBoxItem> <ComboBoxItem Content="Item3"></ComboBoxItem> <ComboBoxItem Content="Item4"></ComboBoxItem> </ComboBox> </Grid> </UserControl>

這個部份，我們在按下F5直接執行後，顯示如下：

 

2.

如果是透過程式碼新增：

public Page() { InitializeComponent(); //透過程式碼加Item uxComboBox.Items.Add("Test1"); uxComboBox.Items.Add("Test2"); uxComboBox.Items.Add("Test3"); }

 

 

3.

透過程式碼設定來源：

public Page() { InitializeComponent(); //設定來源 List<Customer> Cus = new List<Customer>(); Cus.Add(new Customer("lolota","Taipei", "男")); Cus.Add(new Customer("Hala","Taipei", "男")); Cus.Add(new Customer("Bunny","Taichung", "女")); uxComboBox1.ItemsSource = Cus; } public class Customer { public String Name { get; set; } public String City { get; set; } public String sex { get; set; } public Customer(String Name, String City, String sex) { this.Name = Name; this.City = City; this.sex = sex; }

<UserControl x:Class="D19._1.Page" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="400" Height="300" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Grid x:Name="LayoutRoot" Background="White"> <ComboBox x:Name="uxComboBox1" Width="200" Height="70" > <ComboBox.ItemTemplate> <DataTemplate> <StackPanel Orientation="Horizontal" > <TextBlock Text="{Binding Path=Name}" Width="50" Height="50" FontSize="14" VerticalAlignment="Center"/> <TextBlock Text="{Binding Path=City}" Width="80" Height="50" FontSize="14" VerticalAlignment="Center"/> <TextBlock Text="{Binding Path=sex}" Width="50" Height="50" FontSize="14" VerticalAlignment="Center"/> </StackPanel> </DataTemplate> </ComboBox.ItemTemplate> </ComboBox> </Grid> </UserControl>

這裡透過TextBlock來Binding欄位。

 

結果顯示：

 

4.

然後我們可以透過下列程式來取得選擇的Item:

private void uxComboBox1_SelectionChanged(object sender, SelectionChangedEventArgs e) { Object obj = ((ComboBox)sender).SelectedItem; }

 

 

 

程式碼下載

 

 

修煉大會，我們下次見~

 

 

如果您有微軟技術開發的問題，可以到MSDN Forum發問。

如果您有微軟IT管理的問題，可以到TechNet Forum發問喔。