您的位置：首页 > 其它

Silverlight 数据显示和布局控件示例

2010-02-14 18:41 453 查看

数据显示控件

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 数据显示和布局控件 示例