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

posted @ 2010-08-25 09:11  webabcd  阅读(6021)  评论(14编辑  收藏  举报