在silverlight中开发User Control(用户控件)
来源:互联网 发布:怎么开淘宝代理网店 编辑:程序博客网 时间:2024/05/16 11:48
在silverlight 2(Beta1) 中开发用户控件与我们以前在Webform中使用的方式基本上接近.
下面是一个DEMO,用于执行一个简单的查询雇员信息的操作.运行结果如下图所示:
首先我们要新建一个Silverlight Application , 名称为:SearchUserControl
在该项目中添加一个Silverlight User Control , 名称为:EmployeeSearch
然后我们在该用户控件的CS代码中添加一个类用于描述雇员信息,如下:
另外还有一个EmployeeNameEventArgs类,用于当点击查询时,将要查询的雇员姓名以事件
参数方式传递到Page页面中,如下:
到这里准备工作就绪,下面是相应的控件xaml代码,请将其粘贴到EmployeeSearch.xaml中:
然后将下面的cs代码复制到EmployeeSearch.xaml.cs中,相关内容参见注释:
这样控件的开发就完成了,下面是在page.xaml中声明并设置这个控件相应属性的代码:
其中的xmlns:local="clr-namespace:SearchUserControl"为控件的名空间的引用,类似于我们
以前写用户控件时的:
而下面代码即是我们引用该控件并进行属性设置的声明:
StaticResource myEmployee会使用本地绑定的静态资源中所指向的数据,如下:
这样就会将控件中的搜索框绑定到该初始值(资源)上.
而下面就是实际运行这个控件执行查询操作时CS代码(page.xaml.cs):
因为代码比较简单,基本上就是一个linq to object查询,所以就不多做说明了.
好了,今天的内容就先到这里,有兴趣的朋友可以在回复中进行讨论.
源码下载地址,请点击这里:)
下面是一个DEMO,用于执行一个简单的查询雇员信息的操作.运行结果如下图所示:
首先我们要新建一个Silverlight Application , 名称为:SearchUserControl
在该项目中添加一个Silverlight User Control , 名称为:EmployeeSearch
然后我们在该用户控件的CS代码中添加一个类用于描述雇员信息,如下:
public class EmployeeInfo
{
public string EmployeeNo { get; set; }
public string EmployeeName { get; set; }
}
{
public string EmployeeNo { get; set; }
public string EmployeeName { get; set; }
}
另外还有一个EmployeeNameEventArgs类,用于当点击查询时,将要查询的雇员姓名以事件
参数方式传递到Page页面中,如下:
public class EmployeeNameEventArgs : EventArgs
{
public string EmployeeName { get; set; }
}
{
public string EmployeeName { get; set; }
}
到这里准备工作就绪,下面是相应的控件xaml代码,请将其粘贴到EmployeeSearch.xaml中:
<Grid x:Name="LayoutRoot" Background="White">
<Grid.RowDefinitions>
<RowDefinition Height="200" />
<RowDefinition Height="100" />
<RowDefinition Height="50" />
</Grid.RowDefinitions>
<ListBox Margin="10" x:Name="EmployeeList"/>
<StackPanel Grid.Row="1" Margin="12">
<TextBlock>输入要查询的名称:</TextBlock>
<TextBox x:Name="Search" Margin="10" Text="james" />
</StackPanel>
<Button Margin ="10" Content="获取Employee信息" Grid.Row="2" Click="OnGetEmployee"
Width="120" />
</Grid>
<Grid.RowDefinitions>
<RowDefinition Height="200" />
<RowDefinition Height="100" />
<RowDefinition Height="50" />
</Grid.RowDefinitions>
<ListBox Margin="10" x:Name="EmployeeList"/>
<StackPanel Grid.Row="1" Margin="12">
<TextBlock>输入要查询的名称:</TextBlock>
<TextBox x:Name="Search" Margin="10" Text="james" />
</StackPanel>
<Button Margin ="10" Content="获取Employee信息" Grid.Row="2" Click="OnGetEmployee"
Width="120" />
</Grid>
然后将下面的cs代码复制到EmployeeSearch.xaml.cs中,相关内容参见注释:
public partial class EmployeeSearch : System.Windows.Controls.UserControl
{
#region 使用依赖属性从PAGE页面传参到当前用户控件,详情参见Page.xaml页面
public static DependencyProperty SearchEmployeeNameProperty =
DependencyProperty.Register("SearchEmployeeName", typeof(string),
typeof(EmployeeSearch), null);
public string SearchEmployeeName
{
get
{
return ((string)base.GetValue(SearchEmployeeNameProperty));
}
set
{
base.SetValue(SearchEmployeeNameProperty, value);
}
}
#endregion
/// <summary>
/// 声明查询单击事件
/// </summary>
public event EventHandler<EmployeeNameEventArgs> SearchClick;
public EmployeeSearch()
{
InitializeComponent();
this.Loaded += OnLoaded;
}
void OnLoaded(object sender, RoutedEventArgs e)
{
Search.Text = SearchEmployeeName;
}
void OnGetEmployee(object o, EventArgs e)
{
//当有事件绑定时(参见page.xaml中的 SearchClick="OnSearch" 属性)
if (SearchClick != null)
{
SearchEmployeeName = Search.Text;
//运行绑定的单击事件代码
SearchClick(this, new EmployeeNameEventArgs()
{
EmployeeName = Search.Text
});
}
}
//将ListBox的ItemsSource属性开放给Page页面,以便进行数据绑定
public System.Collections.IEnumerable ItemsSource
{
get
{
return EmployeeList.ItemsSource;
}
set
{
EmployeeList.ItemsSource = value;
}
}
}
{
#region 使用依赖属性从PAGE页面传参到当前用户控件,详情参见Page.xaml页面
public static DependencyProperty SearchEmployeeNameProperty =
DependencyProperty.Register("SearchEmployeeName", typeof(string),
typeof(EmployeeSearch), null);
public string SearchEmployeeName
{
get
{
return ((string)base.GetValue(SearchEmployeeNameProperty));
}
set
{
base.SetValue(SearchEmployeeNameProperty, value);
}
}
#endregion
/// <summary>
/// 声明查询单击事件
/// </summary>
public event EventHandler<EmployeeNameEventArgs> SearchClick;
public EmployeeSearch()
{
InitializeComponent();
this.Loaded += OnLoaded;
}
void OnLoaded(object sender, RoutedEventArgs e)
{
Search.Text = SearchEmployeeName;
}
void OnGetEmployee(object o, EventArgs e)
{
//当有事件绑定时(参见page.xaml中的 SearchClick="OnSearch" 属性)
if (SearchClick != null)
{
SearchEmployeeName = Search.Text;
//运行绑定的单击事件代码
SearchClick(this, new EmployeeNameEventArgs()
{
EmployeeName = Search.Text
});
}
}
//将ListBox的ItemsSource属性开放给Page页面,以便进行数据绑定
public System.Collections.IEnumerable ItemsSource
{
get
{
return EmployeeList.ItemsSource;
}
set
{
EmployeeList.ItemsSource = value;
}
}
}
这样控件的开发就完成了,下面是在page.xaml中声明并设置这个控件相应属性的代码:
<UserControl x:Class="SearchUserControl.Page"
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="400" Height="400" xmlns:local="clr-namespace:SearchUserControl">
<UserControl.Resources>
<local:EmployeeInfo EmployeeName="王五" x:Key="myEmployee" />
</UserControl.Resources>
<StackPanel x:Name="LayoutRoot" Background="White">
<local:EmployeeSearch x:Name="SearchControl" SearchClick="OnSearch"
SearchEmployeeName = "{Binding EmployeeName}"
DataContext = "{StaticResource myEmployee}" />
<TextBlock x:Name="txtEmployeeName" Text="暂无" FontSize="16" Margin="10" TextAlignment="Center" />
</StackPanel>
</UserControl>
xmlns="http://schemas.microsoft.com/client/2007"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="400" Height="400" xmlns:local="clr-namespace:SearchUserControl">
<UserControl.Resources>
<local:EmployeeInfo EmployeeName="王五" x:Key="myEmployee" />
</UserControl.Resources>
<StackPanel x:Name="LayoutRoot" Background="White">
<local:EmployeeSearch x:Name="SearchControl" SearchClick="OnSearch"
SearchEmployeeName = "{Binding EmployeeName}"
DataContext = "{StaticResource myEmployee}" />
<TextBlock x:Name="txtEmployeeName" Text="暂无" FontSize="16" Margin="10" TextAlignment="Center" />
</StackPanel>
</UserControl>
其中的xmlns:local="clr-namespace:SearchUserControl"为控件的名空间的引用,类似于我们
以前写用户控件时的:
<%@ Register TagPrefix="" Namespace="" Assembly="" %>
而下面代码即是我们引用该控件并进行属性设置的声明:
<local:EmployeeSearch x:Name="SearchControl" SearchClick="OnSearch"
SearchEmployeeName = "{Binding EmployeeName}"
DataContext = "{StaticResource myEmployee}" />
SearchEmployeeName = "{Binding EmployeeName}"
DataContext = "{StaticResource myEmployee}" />
StaticResource myEmployee会使用本地绑定的静态资源中所指向的数据,如下:
<UserControl.Resources>
<local:EmployeeInfo EmployeeName="王五" x:Key="myEmployee" />
</UserControl.Resources>
<local:EmployeeInfo EmployeeName="王五" x:Key="myEmployee" />
</UserControl.Resources>
这样就会将控件中的搜索框绑定到该初始值(资源)上.
而下面就是实际运行这个控件执行查询操作时CS代码(page.xaml.cs):
void OnSearch(object sender, EmployeeNameEventArgs e)
{
List<string> employeeList = new List<string>();
foreach (EmployeeInfo en in GetData(e.EmployeeName))
{
employeeList.Add(en.EmployeeNo + " " + en.EmployeeName);
}
SearchControl.ItemsSource = employeeList;
txtEmployeeName.Text = "查询有关 """ + SearchControl.SearchEmployeeName + """ Employee信息";
}
private List<EmployeeInfo> GetData(string value)
{
Dictionary<string, string> employee = new Dictionary<string, string>(){ {"10001", "张三"},
{"10002", "李四"},
{"10003", "王五"},
{"10004", "马六"},
{"10005", "王大麻子"},
{"10006", "王宝强"},
{"10007", "王蛋蛋"},
{"10008", "王五强"}
};
return (from e in employee
where e.Value.Contains(value.Trim())
select new EmployeeInfo
{
EmployeeNo = e.Key,
EmployeeName = e.Value
}).ToList();
}
{
List<string> employeeList = new List<string>();
foreach (EmployeeInfo en in GetData(e.EmployeeName))
{
employeeList.Add(en.EmployeeNo + " " + en.EmployeeName);
}
SearchControl.ItemsSource = employeeList;
txtEmployeeName.Text = "查询有关 """ + SearchControl.SearchEmployeeName + """ Employee信息";
}
private List<EmployeeInfo> GetData(string value)
{
Dictionary<string, string> employee = new Dictionary<string, string>(){ {"10001", "张三"},
{"10002", "李四"},
{"10003", "王五"},
{"10004", "马六"},
{"10005", "王大麻子"},
{"10006", "王宝强"},
{"10007", "王蛋蛋"},
{"10008", "王五强"}
};
return (from e in employee
where e.Value.Contains(value.Trim())
select new EmployeeInfo
{
EmployeeNo = e.Key,
EmployeeName = e.Value
}).ToList();
}
因为代码比较简单,基本上就是一个linq to object查询,所以就不多做说明了.
好了,今天的内容就先到这里,有兴趣的朋友可以在回复中进行讨论.
源码下载地址,请点击这里:)
- 在silverlight中开发User Control(用户控件)
- 用户控件(User Control)
- 建立Silverlight 2.0 控件(User control)
- 建立Silverlight 2.0 控件(User control)
- 动态创建“WEB用户控件(WEB User Control)"和控件
- SilverLight中自定义用户控件
- User control(用户控件) vs custom control(自定义控件)
- Windows Vista应用程序的开发中,对应UAC(User Account Control, 用户帐户控制)的开发需求 (一)
- Windows Vista应用程序的开发中,对应UAC(User Account Control, 用户帐户控制)的开发需求 (二)
- Windows Vista应用程序的开发中,对应UAC(User Account Control, 用户帐户控制)的开发需求 (三)
- SilverLight中调用自定义用户控件
- SilverLight中调用自定义用户控件
- 在容器中加入ActiveX Control 控件
- 在VC++中使用Tab Control控件
- 在VC++中使用Tab Control控件
- 动态创建“WEB用户控件(WEB User Control)”又一方法,及如何调用Web用户控件的方法,如何对控件用户控件中的控件
- silverlight 实现在Canvas中拖放控件
- silverlight在XAML中设置控件焦点
- 在Silverlight 2 (Beta2) 中使用webclient上传图片
- 在Silverlight 2 Beta2 中使用TabControl
- siverlight 2 Beta2提供下载了,顺便给前阵子写的beta1文章做个总结
- silvelight中操作html页面元素
- silverlight与javascript交互操作
- 在silverlight中开发User Control(用户控件)
- "下金蛋" OR "造大便"-----关于产出与产能的思考
- 在silverlight中使用Linq TO XML
- 在silverlight 2 (beta1) 中使用BackgroundWorker
- 在silverlight中使用OpenFileDialog浏览本地图片
- 动态加载Silverlight应用的dll文件(可实现插件功能)
- silverlight 2(Beta)中的Socket应用示例
- 推荐一个基于Microsoft ASP.NET MVC Preview 2 的应用示例
- DinnerNow中的Work Flow应用(下) --- 订单流程