稳扎稳打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
[源码下载]