稳扎稳打Silverlight(47) - 4.0UI之操作剪切板, 隐式样式, CompositeTransform, 拖放外部文件到程序中

[索引页]
[源码下载]

稳扎稳打Silverlight(47) - 4.0UI之操作剪切板, 隐式样式, CompositeTransform, 拖放外部文件到程序中

作者：webabcd


介绍
Silverlight 4.0 用户界面（UI）相关：

• 操作剪切板 - 支持获取或设置剪切板中的文本信息 
• 隐式样式(Implicit Style) - 将某种样式应用到某种类型的所有元素，即全局样式 
• CompositeTransform - 将多种转换方式合而为一 
• 拖动(Drag)外部文件，并将其放到(Drop) Silverlight 程序中

在线DEMO
http://www.cnblogs.com/webabcd/archive/2010/08/09/1795417.html


示例
1、演示如何操作剪切板
Clipboard.xaml

代码

< navigation:Page  x:Class ="Silverlight40.UI.Clipboard"  
           xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
           xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"  
           xmlns:d ="http://schemas.microsoft.com/expression/blend/2008"
           xmlns:mc ="http://schemas.openxmlformats.org/markup-compatibility/2006"
           xmlns:navigation ="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
           Title ="Clipboard Page" >
     < Grid  x:Name ="LayoutRoot" >
         < StackPanel  HorizontalAlignment ="Left" >
            
             < TextBox  Name ="txtMsg"  Width ="200"  Height ="50"  Margin ="5"   />

             <!--  复制 txtMsg 中的文本  -->
             < Button  Name ="btnCopy"  Content ="复制"  Margin ="5"  Click ="btnCopy_Click"   />

             <!--  将剪切板中的文本粘贴到 txtMsg  -->
             < Button  Name ="btnPaste"  Content ="粘贴"  Margin ="5"  Click ="btnPaste_Click"   />

         </ StackPanel >
     </ Grid >
</ navigation:Page >

Clipboard.xaml.cs

代码

/*
 * Silverlight 4.0 支持对剪切板的访问，只支持获取或设置剪切板中的文本信息
 *     System.Windows.Clipboard.SetText(string s) - 将指定的字符串复制到剪切板
 *     System.Windows.Clipboard.GetText() - 获取剪切板中的文本信息
 *     
 * 只有在 Click 或 KeyDown 事件的处理程序中才可以访问剪切板
 * 访问剪切板时，Silverlight 会弹出对话框要求用户进行确认，如果用户禁止了，则会引发异常。如果程序是“被信任的应用程序”则不会弹出该对话框
  */

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.Navigation;

namespace  Silverlight40.UI
{
     public   partial   class  Clipboard : Page
    {
         public  Clipboard()
        {
            InitializeComponent();
        }

         protected   override   void  OnNavigatedTo(NavigationEventArgs e)
        {

        }

         private   void  btnCopy_Click( object  sender, RoutedEventArgs e)
        {
             try
            {
                System.Windows.Clipboard.SetText(txtMsg.Text);
            }
             catch  (System.Security.SecurityException ex)
            {
                MessageBox.Show(ex.Message);
            }
        }

         private   void  btnPaste_Click( object  sender, RoutedEventArgs e)
        {
             try
            {
                txtMsg.SelectedText  =  System.Windows.Clipboard.GetText();
            }
             catch  (System.Security.SecurityException ex)
            {
                MessageBox.Show(ex.Message);
            }
        }
    }
}

2、演示 Silverlight 4.0 对隐式样式（全局样式）的支持
ImplicitStyle.xaml

代码

< navigation:Page  x:Class ="Silverlight40.UI.ImplicitStyle"  
           xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
           xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"  
           xmlns:d ="http://schemas.microsoft.com/expression/blend/2008"
           xmlns:mc ="http://schemas.openxmlformats.org/markup-compatibility/2006"
           xmlns:navigation ="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
           Title ="ImplicitStyle Page" >
     < Grid  x:Name ="LayoutRoot" >

         <!--
            隐式样式（Implicit Style） - 将某种样式应用到某种类型的所有元素，即全局样式
         -->
         < ToggleButton  Width ="200"  Height ="50"  Content ="用于演示隐式样式（Implicit Style）。ToggleButton 的样式设置详见 Assets/ToggleButtonStyle.xaml"   />
        
     </ Grid >
</ navigation:Page >

App.xaml

代码

< Application   
   x:Class ="Silverlight40.App"
  xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml" >

     < Application.Resources >
         < ResourceDictionary >
             < ResourceDictionary.MergedDictionaries >
                 < ResourceDictionary  Source ="Assets/ToggleButtonStyle.xaml" />
             </ ResourceDictionary.MergedDictionaries >
         </ ResourceDictionary >
     </ Application.Resources >

</ Application >

ToggleButtonStyle.xaml

代码

< ResourceDictionary
   xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
  xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:navigation ="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation" >

     <!--  ToggleButton 的隐式样式（Implicit Style）  -->
     < Style  TargetType ="ToggleButton" >
         < Setter  Property ="Background"  Value ="#FF1F3B53" />
         < Setter  Property ="Foreground"  Value ="#FF000000" />
         < Setter  Property ="Padding"  Value ="3" />
         < Setter  Property ="BorderThickness"  Value ="1" />
         < Setter  Property ="BorderBrush" >
             < Setter.Value >
                 < LinearGradientBrush  EndPoint ="0.5,1"  StartPoint ="0.5,0" >
                     < GradientStop  Color ="#FFA3AEB9"  Offset ="0" />
                     < GradientStop  Color ="#FF8399A9"  Offset ="0.375" />
                     < GradientStop  Color ="#FF718597"  Offset ="0.375" />
                     < GradientStop  Color ="#FF617584"  Offset ="1" />
                 </ LinearGradientBrush >
             </ Setter.Value >
         </ Setter >
         < Setter  Property ="Template" >
             < Setter.Value >
                 < ControlTemplate  TargetType ="ToggleButton" >
                     < Grid >
                         < VisualStateManager.VisualStateGroups >
                             < VisualStateGroup  x:Name ="CommonStates" >
                                 < VisualState  x:Name ="Normal" />
                                 < VisualState  x:Name ="MouseOver" >
                                     < Storyboard >
                                         < DoubleAnimationUsingKeyFrames  Storyboard.TargetProperty ="(UIElement.Opacity)"  Storyboard.TargetName ="Background" >
                                             < EasingDoubleKeyFrame  KeyTime ="0"  Value ="1" />
                                         </ DoubleAnimationUsingKeyFrames >
                                     </ Storyboard >
                                 </ VisualState >
                                 < VisualState  x:Name ="Pressed" >
                                     < Storyboard >
                                         < ColorAnimationUsingKeyFrames  Storyboard.TargetProperty ="(Border.Background).(SolidColorBrush.Color)"  Storyboard.TargetName ="Background" >
                                             < SplineColorKeyFrame  KeyTime ="0"  Value ="#FFffe575" />
                                         </ ColorAnimationUsingKeyFrames >
                                         < DoubleAnimationUsingKeyFrames  Storyboard.TargetProperty ="(UIElement.Opacity)"  Storyboard.TargetName ="Background" >
                                             < EasingDoubleKeyFrame  KeyTime ="0"  Value ="1" />
                                         </ DoubleAnimationUsingKeyFrames >
                                         < DoubleAnimationUsingKeyFrames  Storyboard.TargetProperty ="(UIElement.Opacity)"  Storyboard.TargetName ="grid" >
                                             < EasingDoubleKeyFrame  KeyTime ="0"  Value ="0" />
                                         </ DoubleAnimationUsingKeyFrames >
                                         < ColorAnimationUsingKeyFrames  Storyboard.TargetProperty ="(Border.BorderBrush).(SolidColorBrush.Color)"  Storyboard.TargetName ="Background" >
                                             < EasingColorKeyFrame  KeyTime ="0"  Value ="#FFC28A30" />
                                         </ ColorAnimationUsingKeyFrames >
                                     </ Storyboard >
                                 </ VisualState >
                                 < VisualState  x:Name ="Disabled" >
                                     < Storyboard >
                                         < DoubleAnimationUsingKeyFrames  Storyboard.TargetProperty ="Opacity"  Storyboard.TargetName ="DisabledVisualElement" >
                                             < SplineDoubleKeyFrame  KeyTime ="0"  Value =".55" />
                                         </ DoubleAnimationUsingKeyFrames >
                                     </ Storyboard >
                                 </ VisualState >
                             </ VisualStateGroup >
                             < VisualStateGroup  x:Name ="CheckStates" >
                                 < VisualState  x:Name ="Checked" >
                                     < Storyboard >
                                         < ColorAnimationUsingKeyFrames  Storyboard.TargetProperty ="(Border.Background).(SolidColorBrush.Color)"  Storyboard.TargetName ="Background2" >
                                             < SplineColorKeyFrame  KeyTime ="0"  Value ="#FFffe575" />
                                         </ ColorAnimationUsingKeyFrames >
                                         < DoubleAnimationUsingKeyFrames  Storyboard.TargetProperty ="(UIElement.Opacity)"  Storyboard.TargetName ="Background2" >
                                             < EasingDoubleKeyFrame  KeyTime ="0"  Value ="1" />
                                         </ DoubleAnimationUsingKeyFrames >
                                         < DoubleAnimationUsingKeyFrames  Storyboard.TargetProperty ="(UIElement.Opacity)"  Storyboard.TargetName ="grid2" >
                                             < EasingDoubleKeyFrame  KeyTime ="0"  Value ="0" />
                                         </ DoubleAnimationUsingKeyFrames >
                                         < ColorAnimationUsingKeyFrames  Storyboard.TargetProperty ="(Border.BorderBrush).(SolidColorBrush.Color)"  Storyboard.TargetName ="Background2" >
                                             < EasingColorKeyFrame  KeyTime ="0"  Value ="#FFC28A30" />
                                         </ ColorAnimationUsingKeyFrames >
                                     </ Storyboard >
                                 </ VisualState >
                                 < VisualState  x:Name ="Unchecked" />
                             </ VisualStateGroup >
                             < VisualStateGroup  x:Name ="FocusStates" >
                                 < VisualState  x:Name ="Focused" >
                                 </ VisualState >
                                 < VisualState  x:Name ="Unfocused" />
                             </ VisualStateGroup >
                         </ VisualStateManager.VisualStateGroups >
                         < Border  x:Name ="Background"  BorderThickness =" {TemplateBinding BorderThickness} "  Background ="#FFFDF7E2"  CornerRadius ="3"  BorderBrush ="#FFF0C958"  Opacity ="0" >
                             < Grid  x:Name ="grid"  Margin ="1" >
                                 < Grid.Background >
                                     < LinearGradientBrush  EndPoint ="0.5,1"  StartPoint ="0.5,0" >
                                         < GradientStop  Color ="#FFFDF7E2"  Offset ="1" />
                                         < GradientStop  Color ="#FFFCEDB3" />
                                     </ LinearGradientBrush >
                                 </ Grid.Background >
                             </ Grid >
                         </ Border >
                         < Border  x:Name ="Background2"  BorderThickness =" {TemplateBinding BorderThickness} "  Background ="#FFFDF7E2"  CornerRadius ="3"  BorderBrush ="#FFF0C958"  Opacity ="0" >
                             < Grid  x:Name ="grid2"  Margin ="1" >
                                 < Grid.Background >
                                     < LinearGradientBrush  EndPoint ="0.5,1"  StartPoint ="0.5,0" >
                                         < GradientStop  Color ="#FFFDF7E2"  Offset ="1" />
                                         < GradientStop  Color ="#FFFCEDB3" />
                                     </ LinearGradientBrush >
                                 </ Grid.Background >
                             </ Grid >
                         </ Border >
                         < ContentPresenter  x:Name ="contentPresenter"  ContentTemplate =" {TemplateBinding ContentTemplate} "  Content =" {TemplateBinding Content} "  HorizontalAlignment =" {TemplateBinding HorizontalContentAlignment} "  Margin =" {TemplateBinding Padding} "  VerticalAlignment =" {TemplateBinding VerticalContentAlignment} " />
                         < Rectangle  x:Name ="DisabledVisualElement"  Fill ="#FFFFFFFF"  IsHitTestVisible ="false"  Opacity ="0"  RadiusY ="3"  RadiusX ="3" />
                         < Rectangle  x:Name ="FocusVisualElement"  IsHitTestVisible ="false"  Margin ="1"  Opacity ="0"  RadiusY ="2"  RadiusX ="2"  Stroke ="#FF6DBDD1"  StrokeThickness ="1" />
                     </ Grid >
                 </ ControlTemplate >
             </ Setter.Value >
         </ Setter >
     </ Style >
    
</ ResourceDictionary >

3、演示 CompositeTransform 的效果
CompositeTransform.xaml

代码

< navigation:Page  x:Class ="Silverlight40.UI.CompositeTransform"  
           xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
           xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"  
           xmlns:d ="http://schemas.microsoft.com/expression/blend/2008"
           xmlns:mc ="http://schemas.openxmlformats.org/markup-compatibility/2006"
           xmlns:navigation ="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
           Title ="CompositeTransform Page" >
     < Grid  x:Name ="LayoutRoot" >
         < StackPanel  HorizontalAlignment ="Left"  Margin ="100,0,0,0" >
            
             <!--
                CompositeTransform - 将多种转换方式合而为一
                    CenterX - 转换中心点的 X 坐标
                    CenterY - 转换中心点的 Y 坐标
                    Rotation - 顺时针旋转角度
                    ScaleX - 沿 X 轴方向上的缩放比例
                    ScaleY - 沿 Y 轴方向上的缩放比例
                    SkewX - X 轴扭曲角度
                    SkewY - Y 轴扭曲角度
                    TranslateX - 沿 X 轴方向上的平移距离
                    TranslateY - 沿 Y 轴方向上的平移距离
             -->
             < Rectangle  Height ="100"  Width ="100"  Fill ="Red" >
                 < Rectangle.RenderTransform >
                     < CompositeTransform  SkewX ="30"  Rotation ="60"  ScaleX ="0.6"  ScaleY ="0.3"   />
                 </ Rectangle.RenderTransform >
             </ Rectangle >

             <!--  用 TransformGroup 的方式达到上面的 CompositeTransform 的相同效果  -->
             < Rectangle  Height ="100"  Width ="100"  Fill ="Red" >
                 < Rectangle.RenderTransform >
                     < TransformGroup >
                         < ScaleTransform  ScaleX ="0.6"  ScaleY ="0.3"   />
                         < SkewTransform  AngleX ="30"   />
                         < RotateTransform  Angle ="60"   />
                     </ TransformGroup >
                 </ Rectangle.RenderTransform >
             </ Rectangle >

         </ StackPanel >
     </ Grid >
</ navigation:Page >

4、演示如何 Drag&Drop 外部文件到 Silverlight 程序中
DragAndDrop.xaml

代码

< navigation:Page  x:Class ="Silverlight40.UI.DragAndDrop"  
           xmlns ="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
           xmlns:x ="http://schemas.microsoft.com/winfx/2006/xaml"  
           xmlns:d ="http://schemas.microsoft.com/expression/blend/2008"
           xmlns:mc ="http://schemas.openxmlformats.org/markup-compatibility/2006"
           xmlns:navigation ="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
           Title ="DragAndDrop Page" >
     < Grid  x:Name ="LayoutRoot" >
         < StackPanel  HorizontalAlignment ="Left" >

             <!--  对 Silverlight 中的 UIElement 进行拖动的 Demo 详见这里  -->
             < HyperlinkButton  NavigateUri ="http://www.cnblogs.com/webabcd/archive/2008/11/13/1332450.html"  TargetName ="_blank"  Content ="在 Silverlight 中拖放 UIElement 的 Demo"   />

             <!--  这是 DropTarget  -->
             < ListBox  Name ="listBox"  Background ="LightBlue"  Height ="400" >
                 < ListBoxItem  Content ="拖动外部文件到这里，以查看演示效果"   />
             </ ListBox >

         </ StackPanel >
     </ Grid >
</ navigation:Page >

DragAndDrop.xaml.cs

代码

/*
 * 拖放操作的 Demo - Silverlight 4.0 支持拖动外部文件到 Silverlight 程序中（支持多文件拖放，但是不支持文件夹拖放）
 * 
 * UIElement.AllowDrop - 指定 UIElement 是否可以用作于 DropTarget（拖放操作的放目标）。默认值为 false
 * UIElement.DragEnter - 拖动外部文件进入到 UIElement 时所触发的事件（事件参数类型为：DragEventArgs）
 * UIElement.DragLeave - 拖动外部文件离开 UIElement 时所触发的事件（事件参数类型为：DragEventArgs）
 * UIElement.DragOver - 拖动外部文件在 UIElement 中移动时所触发的事件（事件参数类型为：DragEventArgs）
 * UIElement.Drop - 拖动外部文件在 UIElement 中放开时所触发的事件（事件参数类型为：DragEventArgs）
 * DragEventArgs - 拖放操作所触发的拖放事件的事件参数
 *     DragEventArgs.Data - 获取与拖放事件相关联的数据（IDataObject 类型）
 * IDataObject.GetData(DataFormats.FileDrop) - 返回被拖放的外部文件的 FileInfo 数组
  */

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.Navigation;

using  System.IO;
using  System.Windows.Markup;
using  System.Windows.Media.Imaging;

namespace  Silverlight40.UI
{
     public   partial   class  DragAndDrop : Page
    {
         public  DragAndDrop()
        {
            InitializeComponent();
        }

         protected   override   void  OnNavigatedTo(NavigationEventArgs e)
        {
            listBox.AllowDrop  =   true ;

            listBox.DragEnter  +=   new  DragEventHandler(listBox_DragEnter);
            listBox.DragLeave  +=   new  DragEventHandler(listBox_DragLeave);
            listBox.DragOver  +=   new  DragEventHandler(listBox_DragOver);
            listBox.Drop  +=   new  DragEventHandler(listBox_Drop);
        }

         void  listBox_DragEnter( object  sender, DragEventArgs e)
        {
            listBox.Items.Add( " DragEnter " );
        }

         void  listBox_DragLeave( object  sender, DragEventArgs e)
        {
            listBox.Items.Add( " DragLeave " );
        }

         void  listBox_DragOver( object  sender, DragEventArgs e)
        {
             //  listBox.Items.Add("DragOver");
        }

         void  listBox_Drop( object  sender, DragEventArgs e)
        {
            listBox.Items.Add( " Drop " );

             if  (e.Data  ==   null )
                 return ;

            IDataObject dataObject  =  e.Data  as  IDataObject;
            FileInfo[] files  =  dataObject.GetData(DataFormats.FileDrop)  as  FileInfo[];

             foreach  (FileInfo file  in  files)
            {
                 if  (file.Exists)
                    listBox.Items.Add( " FileName:  "   +  file.Name  +   "  [FileSize:  "   +  file.Length  +   " ] " );
                 else
                    listBox.Items.Add( " 文件无效 " );
            }
        }
    }
}

OK
[源码下载]