如何获取UI元素的图像,,CIO之家

如何获取UI元素的图像

上善若水润物无声　　http://liutiemeng.blog.51cto.com/120361/121351　　Wphone　　编辑:dezai　　图片来源:网络

如我想在UI上拖拽某个元素，拖拽过程中，我需要让这个UI元素的影相跟着鼠标移动（但UI还停留在原位），当放开鼠标的时候，UI元素移动到新的位置。

这是个很常见的需求，实现这个需求的第一步就是获取这个UI元素的影相。实现这一步其实很简单，核心就是使用VisualBrush这个画刷子类。

下面我给出一个简单的例子。

这是UI描述，

<Window x:Class="WpfApplicationImage.Window1" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="Window1" Height="300" Width="400" Background="SteelBlue"> 
    <Grid Margin="10"> 
        <Grid.ColumnDefinitions> 
            <ColumnDefinition Width="160"/> 
            <ColumnDefinition Width="*"/> 
            <ColumnDefinition Width="160"/> 
        Grid.ColumnDefinitions> 
        <StackPanel x:Name="stackPanelLeft" Background="White"> 
            <Button x:Name="btn" Content="OK" Height="40"/> 
        StackPanel> 
        <Button Content=">>>" Grid.Column="1" Margin="5" Click="Button_Click"/> 
        <StackPanel x:Name="stackPanelRight" Background="White" Grid.Column="2"/> 
    Grid> 
Window>

UI效果是这样的

点击中间的Button，会把左边StackPanel中Button的影像加入到右边的StackPanel中。代码如下（核心是使用VisualBrush）：

        private void Button_Click(object sender, RoutedEventArgs e) 
        { 
            VisualBrush vbrush = new VisualBrush(btn); 

            Rectangle rect = new Rectangle(); 
            rect.Width = btn.Width; 
            rect.Height = btn.Height; 
            rect.Fill = vbrush; 
            rect.Opacity = 0.5; //为了表示是影像，我让不透明度为50% 

            this.stackPanelRight.Children.Add(rect); 

        }

点击几下后，结果如下图：

核心问题解决了，剩下的就好办了。如果想做出拖拽等效果，只是些使用Mouse事件和计算偏移量的小技俩了:p

====================================

我写了一个完整的例子，上传到资源里了，可惜不知道为什么显示不出来。名字叫“WPF拖拽效果源代码”。等我自己能看见了，就把链接贴过来~~~

放个截图先~~~~

本文作者:上善若水润物无声来源:http://liutiemeng.blog.51cto.com/120361/121351
CIO之家 www.ciozj.com 微信公众号:imciow

免责声明:本站转载此文章旨在分享信息，不代表对其内容的完全认同。文章来源已尽可能注明，若涉及版权问题，请及时与我们联系，我们将积极配合处理。同时，我们无法对文章内容的真实性、准确性及完整性进行完全保证，对于因文章内容而产生的任何后果，本账号不承担法律责任。转载仅出于传播目的，读者应自行对内容进行核实与判断。请谨慎参考文章信息，一切责任由读者自行承担。

延伸阅读