Silverlight 数据显示和布局控件 示例
2010-02-14 18:41
357 查看
数据显示控件
DataGrid
DataGrid是最基础的数据显示方式,也就是二维表格。<data:DataGridName="dataGrid1"Height="120" Margin="5,5,5,5" RowDetailsVisibilityMode="VisibleWhenSelected" AutoGenerateColumns="False"> <data:DataGrid.Columns> <data:DataGridTextColumnHeader="订?单¥号?" Width="SizeToHeader" Binding="{BindingOrderID}" IsReadOnly="True"/> <data:DataGridTextColumnHeader="客í户§名?称?" Width="SizeToHeader" Binding="{BindingCustomerName}"/> <data:DataGridTextColumnHeader="订?单¥签?订?日?期ú" Width="SizeToHeader" Binding="{BindingOrderDate}"/> <data:DataGridCheckBoxColumnHeader="是?否?变?更ü" Width="SizeToHeader" Binding="{BindingIsChanged}"/> </data:DataGrid.Columns> </data:DataGrid>
Width="SizeToHeader"宽度与Header相同
this.dataGrid1.ItemsSource=Order.Orders.GetSampleOrderList();
///<summary>
///订?单¥集ˉ合?类à
///</summary>
publicclassOrders
{
publicstaticList<Order>GetSampleOrderList()
{
returnnewList<Order>{newOrder("001","A公?司?"
,DateTime.Now,true),
newOrder("002","B公?司?"
,DateTime.Now,false)};
}
}
DataPager
DataPager是翻页控件,用来与ListBox,DataGrid组合并实现翻页的控件。
xmlns:dataControls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"
<ListBoxx:Name="listBox"/>
<dataControls:DataPagerx:Name="dataPager"
Source="{BindingItemsSource,ElementName=listBox}"
Background="LightBlue">
</dataControls:DataPager>
publicSC_Pager()
{
InitializeComponent();
//设置分页控件基本属性
dataPager.DisplayMode=PagerDisplayMode.FirstLastPreviousNextNumeric;
//分页事件
dataPager.PageIndexChanged+=
newEventHandler<EventArgs>(dataPager_PageIndexChanged);
//设置页尺寸
dataPager.PageSize=5;
//定义数据源
string[]source=@"一,二,三,四,五,六,七,八,九,十
,十一,十二,十三,十四,十五".Split(',');
//创建分页集合对象
PagedCollectionViewpager=newPagedCollectionView(source);
//将分页集合做为数据源绑定到ListBox控件
listBox.ItemsSource=pager;
}
//显示当前页号
voiddataPager_PageIndexChanged(objectsender,EventArgse)
{
DataPagerdataPager=senderasDataPager;
MessageBox.Show("当前是第"+dataPager.PageIndex.ToString()+"页");
}
TreeView
TreeView树控件,他的节点可以是文字也可以是其他XAML元素,TreeViewItem元素代表节点,可以一层嵌套一层
xmlns:controls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls"
<controls:TreeViewWidth="300"Margin="10"
x:Name="treeView">
<controls:TreeViewItemHeader="商ì品·树÷"
IsSelected="True"
IsExpanded="True">
<controls:TreeViewItemHeader="茶è"
IsExpanded="True">
<controls:TreeViewItemHeader="铁ú观?音?"/>
<controls:TreeViewItemHeader="茉?莉ò花¨"/>
</controls:TreeViewItem>
<controls:TreeViewItemHeader="电?脑?"
IsExpanded="True">
<controls:TreeViewItemHeader="台¨式?机ú"
IsExpanded="True">
<controls:TreeViewItemHeader="Dell"/>
<controls:TreeViewItemHeader="联a想?"/>
</controls:TreeViewItem>
<controls:TreeViewItemHeader="笔ê记?本?"
IsExpanded="True">
<controls:TreeViewItem>
<controls:TreeViewItem.Header>
<CheckBoxContent="Ibm"
Click="CheckBox_Click"
Width="100"/>
</controls:TreeViewItem.Header>
</controls:TreeViewItem>
<controls:TreeViewItem>
<controls:TreeViewItem.Header>
<CheckBoxContent="Dell"
Click="CheckBox_Click"
Width="100"/>
</controls:TreeViewItem.Header>
</controls:TreeViewItem>
</controls:TreeViewItem>
</controls:TreeViewItem>
</controls:TreeViewItem>
</controls:TreeView>
Header="笔记本"属性代表树节点的显示内容
布局控件
布局控件是纯粹为展现UI而设计的控件。Border
Canvas
面板控件Grid
格子控件StackPanel
排列控件GridSplitter
Grid的组合控件,用来实现格子大小的鼠标拖动修改。下面定义了,三行三列的格子,其中夹在中间的2个像素的分析放置了GridSplitter控件,用来使用鼠标拖动,来调整格子的大小。
<GridName="LayoutRoot"Background="#46461F">
<Grid.RowDefinitions>
<RowDefinitionHeight="100"/>
<RowDefinitionHeight="2"/>
<RowDefinitionHeight="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinitionWidth="100"/>
<ColumnDefinitionWidth="2"/>
<ColumnDefinitionWidth="*"/>
</Grid.ColumnDefinitions>
<RectangleGrid.Row="0"Grid.Column="0"Fill="Red"/>
<RectangleGrid.Row="0"Grid.Column="2"Fill="Blue"/>
<RectangleGrid.Row="2"Grid.Column="0"Fill="Green"/>
<RectangleGrid.Row="2"Grid.Column="2"Fill="Yellow"/>
<!--水?平?控?件t
ShowsPreview:o为aTrue时±显?示?预¤览à效§果?
HorizontalAlignment:o为a"Stretch"时±,?可é调÷整?行D的?大ó小?
VerticalAlignment:o为a"Stretch"时±,?可é调÷整?列D的?大ó小?
-->
<basics:GridSplitterGrid.Row="1"Grid.Column="0"
Grid.ColumnSpan="3"
ShowsPreview="True"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch">
</basics:GridSplitter>
<!--垂1直±控?件t
ShowsPreview:oFalse时±不?显?示?预¤览à
-->
<basics:GridSplitterGrid.Row="0"Grid.Column="1"
Grid.RowSpan="3"
ShowsPreview="False"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch">
</basics:GridSplitter>
</Grid>
ScrollViewer
ScrollViewer是滚动条窗口控件,当包含在他其中的控件大小超出了ScrollViewer的大小的时候,滚动条就会变的可拖动。<ScrollViewerVerticalScrollBarVisibility="Visible"
HorizontalScrollBarVisibility="Auto"Name="scv_Text">
</ScrollViewer>
TabControl
TabControl是选项卡控件。
<basics:TabControlx:Name="tab1"Width="300"Height="200">
<basics:TabItemHeader="选?项?卡¨1"Content="这a是?第ú一?个?选?项?卡¨"/>
<basics:TabItemHeader="选?项?卡¨2">
<ButtonContent="Button"Height="23"Name="button1"Width="75"/>
</basics:TabItem>
</basics:TabControl>
示例出自Silverlight开发详解一书的源代码
相关文章推荐
- Silverlight 数据显示和布局控件 示例
- Silverlight 数据显示和布局控件 示例
- Control Study -> 主表和子表数据同时在绑定控件显示(示例代码下载)
- Android布局设计之ExpandableList绑定XML数据构成级联、item布局页面的控件查找及配置child事件,自定义适配显示内容
- Control Study -> Asp.net几个较复杂的显示数据控件(Repeater/DataList/DataGrid)用法 (示例代码下载)
- Control Study -> 主表和子表数据同时在绑定控件显示(示例代码下载)
- 主表和子表数据同时在绑定控件显示(示例代码下载)
- Control Study -> 主表和子表数据同时在绑定控件显示(示例代码下载)
- Silverlight项目笔记1:UI控件与布局、MVVM、数据绑定、await/async、Linq查询、WCF RIA Services、序列化、委托与事件
- Silverlight 信息显示与编辑控件 示例
- Control Study -> Asp.net几个较复杂的显示数据控件(Repeater/DataList/DataGrid)用法 (示例代码下载)
- Silverlight 信息显示与编辑控件 示例
- Silverlight 信息显示与编辑控件 示例
- ASPxGridView控件常用示例五:显示Detail数据
- Control Study -> Asp.net几个较复杂的显示数据控件(Repeater/DataList/DataGrid)用法 (示例代码下载)
- 有关xml操作的心得(2)--xml文件和数据显示控件的绑定
- TabHost整合Listview进行数据显示和单独准确绑定listview中的控件
- vs数据控件中时间显示问题
- 使用嵌套的Repeater控件显示分级数据
- 关于对孟子E章《利用Repeater控件显示主-从关系数据表》的一点补充(转)