稳扎稳打Silverlight(3) - 2.0控件之Border, Button, Calendar, Canvas, CheckBox, ComboBox

概述[索引页] [源码下载] 稳扎稳打Silverlight(3) - 2.0控件之Border, Button, Calendar, Canvas, CheckBox, ComboBox 作者： webabcd 介绍 Silverlight 2.0 控件一览：Border, Button, Calendar, Canvas, CheckBox, ComboBox   在线DEMO http://ww [索引页]
[源码下载]


稳扎稳打Silverlight(3) - 2.0控件之border,button,Calendar,Canvas,CheckBox,ComboBox

作者： webabcd


介绍
Silverlight 2.0 控件一览：border,ComboBox  


在线DEMO
http://www.voidcn.com/article/p-ounmxjds-tq.html  


示例
1、border.xaml <UserControl x:Class="Silverlight20.Control.border"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
        <StackPanel HorizontalAlignment="left">
                
                <!--
                borderThickness - 边框的宽度（像素值：上下左右；左右,上下；左,上,右,下）
                borderBrush - 边框的颜色
                CornerRadius - 边框角的半径
                -->
                <border borderThickness="1,3,5,7" borderBrush="Red" CornerRadius="10" WIDth="120" margin="5">
                        <TextBlock Text="红色border" tooltipService.tooltip="红色border" TextAlignment="Center" />
                </border>

                <!--
                border.borderBrush - 继承自 System.windows.Media.Brush 的对象
                -->
                <border borderThickness="3" CornerRadius="10" WIDth="120" margin="5">
                        <TextBlock Text="红色border" tooltipService.tooltip="红色border" TextAlignment="Center" />
                        <border.borderBrush>
                                <ImageBrush ImageSource="http://silverlight.net/themes/silverlight/images/logo.jpg" />
                        </border.borderBrush>
                </border>

        </StackPanel>
</UserControl>     2、button.xaml <UserControl x:Class="Silverlight20.Control.button"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
        <StackPanel HorizontalAlignment="left" WIDth="400">

                <!--
                Content - 按钮上显示的内容
                Click - 按钮的单击事件
                Cursor - 鼠标移动到按钮上面时，鼠标指针的样式
                        Arrow - 箭头
                        Hand - 手形    
                        Wait - 沙漏
                        IBeam - “I”字形    
                        Stylus - 点
                        Eraser - 橡皮
                        None - 无
                padding - 容器内的内容与容器边缘的填充距离（像素值：上下左右；左右,下）
                -->
                <button Tag="我是button" Content="我是button" Cursor="Eraser" Click="button_Click" padding="5" margin="5" />

                <!--
                IsEnabled - 按钮是否有效
                -->
                <button Tag="无效button" Content="无效button" IsEnabled="False" Click="button_Click" margin="5" />

                <!--
                button.Content - 按钮上显示的内容
                ClickMode - 触发单击事件的类型 [System.windows.Controls.ClickMode枚举]
                        ClickMode.Press - 鼠标左键单击
                        ClickMode.Release - 鼠标左键单击并放开
                        ClickMode.Hover - 鼠标经过
                -->
                <button Tag="图片button" ClickMode="Release" Click="button_Click" margin="5">
                        <button.Content>
                                <Image Source="/Silverlight20;component/Images/logo.jpg" />
                        </button.Content>
                </button>

        </StackPanel>
</UserControl>   button.xaml.cs

using System;

using System.Collections.Generic;

using System.linq;

using System.Net;

using System.windows;

using System.windows.Controls;

using System.windows.documents;

using System.windows.input;

using System.windows.Media;

using System.windows.Media.Animation;

using System.windows.Shapes;

using System.windows.browser;

namespace Silverlight20.Control

{

         public partial class button : UserControl

        {

                 public button()

                {

                        InitializeComponent();

                }

                 private voID button_Click( object sender,RoutedEventArgs e)

                {

                        HTMLWindow HTML = HTMLPage.Window;

                        HTML.Alert(((System.windows.Controls.button)sender).Tag.ToString() + " 被单击了");

                }

        }

}     3、Calendar.xaml <!--
Calendar控件的命名空间和其他控件一样，都是在System.windows.Controls下
但是其是在System.windows.Controls.dll程序集中定义的
所以要引入相应的xml命名空间
-->
<UserControl x:Class="Silverlight20.Control.Calendar"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:basics="clr-namespace:System.windows.Controls;assembly=System.windows.Controls">
        <StackPanel HorizontalAlignment="left">
                <TextBox x:name="txtMsg" margin="5"    />
                
                <!--
                SelectedDatesChanged - 选中日期后所触发的事件
                displayDateEnd - 此日期之后的日期不予显示    
                displayDateStart - 此日期之前的日期不予显示
                FirstDayOfWeek - 控件所显示的每星期的第一天为星期几 [System.DayOfWeek枚举]
                displayMode - 控件的显示模式 [System.windows.Controls.displayMode枚举]
                        displayMode.Month - 标题显示年月，内容显示日期。默认值
                        displayMode.Year - 标题显示年，内容显示月
                        displayMode.Decade - 标题显示一个十年的区间，内容显示年
                IsTodayHighlighted - 是否高亮显示今天的日期
                -->
                <basics:Calendar x:name="calendar" margin="5" FirstDayOfWeek="Monday"
                        SelectedDatesChanged="calendar_SelectedDatesChanged">
                </basics:Calendar>
                
                <StackPanel OrIEntation="Horizontal">
                        
                        <CheckBox Content="禁止选择今天以前的日期" margin="5"
                                Checked="CheckBox_Checked" Unchecked="CheckBox_Unchecked" />

                        <Radiobutton Groupname="selectionMode" x:name="SingleDate" Content="可选单一日期" margin="5"                                
                                Checked="selectionMode_Changed" />

                        <Radiobutton Groupname="selectionMode" x:name="None" Content="不可选日期" margin="5"                                
                                Checked="selectionMode_Changed" />

                        <Radiobutton Groupname="selectionMode" x:name="SingleRange" Content="可选连续日期（shift）" margin="5"                                
                                Checked="selectionMode_Changed" />

                        <Radiobutton Groupname="selectionMode" x:name="MultipleRange" Content="可选多个日期（ctrl）" margin="5"                                
                                Checked="selectionMode_Changed" />
                        
                </StackPanel>
                
        </StackPanel>
</UserControl>   Calendar.xaml.cs

using System;

using System.Collections.Generic;

using System.linq;

using System.Net;

using System.windows;

using System.windows.Controls;

using System.windows.documents;

using System.windows.input;

using System.windows.Media;

using System.windows.Media.Animation;

using System.windows.Shapes;

namespace Silverlight20.Control

{

         public partial class Calendar : UserControl

        {

                 public Calendar()

                {

                        InitializeComponent();

                }

                 private voID calendar_SelectedDatesChanged( object sender,SelectionChangedEventArgs e)

                {

                         // Calendar.SelectedDate - 选中的日期

                         // Calendar.SelectedDates - 选中的多个日期集合

                         this.txtMsg.Text = "";

                         foreach (DateTime dt in calendar.SelectedDates)

                        {

                                 this.txtMsg.Text += dt.ToString( "yyyy-MM-dd");

                                 this.txtMsg.Text += " ";

                        }

                }

                 private voID CheckBox_Checked( object sender,RoutedEventArgs e)

                {

                         if ( this.calendar.SelectedDate != null && this.calendar.SelectedDate < DateTime.Now.Date)

                                 this.calendar.SelectedDate = DateTime.Now;

                         // Calendar.BlackoutDates - 不允许选择的日期集合

                         // Calendar.BlackoutDates.AddDatesInPast() - 禁止选择今天之前的日期

                         this.calendar.BlackoutDates.AddDatesInPast();

                }

                 private voID CheckBox_Unchecked( object sender,RoutedEventArgs e)

                {

                         // Calendar.BlackoutDates.Clear() - 清除 不允许选择的日期集合 的设置

                         this.calendar.BlackoutDates.Clear();

                }

                 private voID selectionMode_Changed( object sender,RoutedEventArgs e)

                {

                         // CalendarSelectionMode.None - 禁止选择日期

                         // CalendarSelectionMode.SingleRange - 可以选择多个日期，连续日期（Shift键配合）

                         // CalendarSelectionMode.MultipleRange - 可以选择多个日期，任意日期（Ctrl键配合）

                         // CalendarSelectionMode.SingleDate - 只能选择一个日期

                         switch (((System.windows.Controls.Radiobutton)sender).name)

                        {

                                 case "None":

                                         this.calendar.SelectionMode = CalendarSelectionMode.None;

                                         break;

                                 case "SingleRange":

                                         this.calendar.SelectionMode = CalendarSelectionMode.SingleRange;

                                         break;

                                 case "MultipleRange":

                                         this.calendar.SelectionMode = CalendarSelectionMode.MultipleRange;

                                         break;

                                 default:

                                         this.calendar.SelectionMode = CalendarSelectionMode.SingleDate;

                                         break;

                        }

                }

        }

}     4、Canvas.xaml <UserControl x:Class="Silverlight20.Control.Canvas"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" HorizontalAlignment="left">
        
        <!--
        Canvas - 绝对布局模式
                Canvas.left - 与上一层 Canvas 的 Y轴 间的距离，左上角为原点
                Canvas.top - 与上一层 Canvas 的 X轴 间的距离，左上角为原点
        -->
        <Canvas Background="Red" WIDth="100" Height="100">
                
                <Canvas Background="Green" WIDth="100" Height="100" Canvas.left="120" Canvas.top="120" >
                        <TextBlock Text="TextBlock" Canvas.top="20" />
                </Canvas>
                
        </Canvas>
        
</UserControl>  
5、CheckBox.xaml   <UserControl x:Class="Silverlight20.Control.CheckBox"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
        <StackPanel>

                <!--
                IsChecked - 是否被选中
                -->
                <CheckBox x:name="chk1" Content="我是CheckBox" IsChecked="False" margin="5" />

                <!--
                IsThreeState - 是否是 有3个状态 的CheckBox
                        false - 通常的两状态。默认值
                        true - 有3个状态，分别为：true,false,null。也就是说 CheckBox.IsChecked 是 bool? 类型
                -->
                <CheckBox x:name="chk2" Content="红色的三状态的CheckBox" Background="Red" IsThreeState="True" margin="5" />

                <!--
                IsEnabled - CheckBox是否有效
                -->
                <CheckBox x:name="chk3" Content="无效的CheckBox" IsEnabled="False" margin="5"/>

                <!--
                CheckBox.Content - CheckBox所对应的内容
                Checked - 被选中后所触发的事件
                Unchecked - 被取消选中后所触发的事件
                Click - 被单击后所触发的事件
                -->
                <CheckBox x:name="chk4" Checked="button_Click" margin="5">
                        <CheckBox.Content>
                                <Image Source="/Silverlight20;component/Images/logo.jpg" WIDth="100" />
                        </CheckBox.Content>
                </CheckBox>

                <button Content="各个CheckBox的选中状态" WIDth="200" HorizontalAlignment="left" Click="button_Click" margin="5" />

        </StackPanel>
</UserControl>   CheckBox.xaml.cs

using System;

using System.Collections.Generic;

using System.linq;

using System.Net;

using System.windows;

using System.windows.Controls;

using System.windows.documents;

using System.windows.input;

using System.windows.Media;

using System.windows.Media.Animation;

using System.windows.Shapes;

using System.windows.browser;

namespace Silverlight20.Control

{

         public partial class CheckBox : UserControl

        {

                 public CheckBox()

                {

                        InitializeComponent();

                }

                 private voID button_Click( object sender,RoutedEventArgs e)

                {

                        HTMLWindow HTML = HTMLPage.Window;

                        HTML.Alert( string.Format( "chk1: {0}\r\nchk2: {1}\r\nchk3: {2}\r\nchk4: {3}",    

                                chk1.IsChecked,chk2.IsChecked,chk3.IsChecked,chk4.IsChecked));

                }

        }

}     6、ComboBox.xaml <UserControl x:Class="Silverlight20.Control.ComboBox"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"    
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
        <StackPanel HorizontalAlignment="left">
                
                <!--
                XAML方式构造ComboBox
                -->
                <ComboBox x:name="cbo" WIDth="200" margin="5">
                        <ComboBoxItem Content="ComboBoxItem1" />
                        <ComboBoxItem Content="ComboBoxItem2" />
                        <ComboBoxItem Content="ComboBoxItem3" />
                </ComboBox>
                
                <!--
                后台邦定方式构造ComboBox
                displayMemberPath - 数据源中需要被显示出来的字段名称
                MaxDropDownHeight - 下拉框的最大下拉高度
                -->
                <ComboBox x:name="cbo2" displayMemberPath="name" MaxDropDownHeight="100" WIDth="200" margin="5" />
                
        </StackPanel>
</UserControl>   ComboBox.xaml.cs

using System;

using System.Collections.Generic;

using System.linq;

using System.Net;

using System.windows;

using System.windows.Controls;

using System.windows.documents;

using System.windows.input;

using System.windows.Media;

using System.windows.Media.Animation;

using System.windows.Shapes;

namespace Silverlight20.Control

{

         public partial class ComboBox : UserControl

        {

                 public ComboBox()

                {

                        InitializeComponent();

                        BindData();

                }

                 voID BindData()

                {

                        var source = new Data.sourceData();

                         // 设置 ComboBox 的数据源

                        cbo2.ItemsSource = source.GetData().Take(10);

                }

        }

}    
OK
[源码下载] 总结

以上是内存溢出为你收集整理的稳扎稳打Silverlight(3) - 2.0控件之Border, Button, Calendar, Canvas, CheckBox, ComboBox全部内容，希望文章能够帮你解决稳扎稳打Silverlight(3) - 2.0控件之Border, Button, Calendar, Canvas, CheckBox, ComboBox所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。