基于WPF实现简单放大镜效果

 更新时间:2022年12月27日 10:01:39   作者:驚鏵  
这篇文章主要为大家详细介绍了WPF如何实现简单放大镜效果,文中的示例代码讲解详细,对我们学习或工作有一定帮助,感兴趣的小伙伴可以了解一下

WPF 如何实现简单放大镜

框架使用.NET40

Visual Studio 2019;

实现此功能需要用到 VisualBrush ,放大镜展现使用 Canvas -> Ellipse .

  • 可以使用 VisualBrush 创建放大效果。
  • 设置 Visual 获取或设置画笔的内容。
  • 设置 ViewboxUnits Absolute 坐标系与边界框无关。
  • 设置 Viewbox 获取或设置 TileBrush 图块中内容的位置和尺寸。
  • 当鼠标移动获取当前坐标点修改 VisualBrush 的 Viewbox
  • 鼠标移动修改 Ellipse 的 Canvas.Left 与 Canvas.Top 跟随鼠标。

实现代码

1) xaml 代码如下:

<Grid>
        <Image Source="0.png" Stretch="Fill"
               Name="image" MouseMove="image_MouseMove"
               MouseEnter="image_MouseEnter" MouseLeave="image_MouseLeave"/>

        <Canvas IsHitTestVisible="False" Name="MagnifierPanel">
            <Ellipse Stroke="LightBlue" Name="MagnifierCircle" 
                     Height="200" Width="200">
                <Ellipse.Fill>
                    <VisualBrush x:Name="MagnifierBrush"  
                                 Visual="{Binding ElementName=image}" 
                                 ViewboxUnits="Absolute"/>
                </Ellipse.Fill>
            </Ellipse>
        </Canvas>
    </Grid>

2) xaml.cs 代码如下:

private void image_MouseMove(object sender, MouseEventArgs e)
        {
            var center = e.GetPosition(image);
            var length = MagnifierCircle.ActualWidth * _factor;
            var radius = length / 2;
            var viewboxRect = = new Rect(center.X - radius, center.Y - radius, length, length);
            MagnifierBrush.Viewbox = viewboxRect;
            MagnifierCircle.SetValue(Canvas.LeftProperty, center.X - MagnifierCircle.ActualWidth / 2);
            MagnifierCircle.SetValue(Canvas.TopProperty, center.Y - MagnifierCircle.ActualHeight / 2);

        }

        private void image_MouseEnter(object sender, MouseEventArgs e)
        {
            MagnifierCircle.Visibility = Visibility.Visible;
        }

        private void image_MouseLeave(object sender, MouseEventArgs e)
        {
            MagnifierCircle.Visibility = Visibility.Hidden;
        }

效果图

到此这篇关于基于WPF实现简单放大镜效果的文章就介绍到这了,更多相关WPF放大镜内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • C#实现数组元素的数据类型转换方法详解

    C#实现数组元素的数据类型转换方法详解

    这篇文章主要为大家介绍了C#中一维数组如何快速实现数组元素的数据类型的转换,文中的示例代码讲解详细,感兴趣的小伙伴可以了解一下
    2022-04-04
  • C#编写的Base64加密和解密类

    C#编写的Base64加密和解密类

    本文给大家汇总介绍了几种C#编写的Base64加密和解密类的代码,从简单到复杂,都能够实现功能,有需要的小伙伴根据自己的项目需求参考下吧。
    2015-05-05
  • Unity排行榜优化滚动效果

    Unity排行榜优化滚动效果

    这篇文章主要为大家详细介绍了Unity排行榜优化滚动效果,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-07-07
  • 如何用C#实现SAGA分布式事务

    如何用C#实现SAGA分布式事务

    大家好,本篇文章主要讲的是如何用C#实现SAGA分布式事务,感兴趣的同学赶快来看一看吧,对你有帮助的话记得收藏一下
    2022-01-01
  • C#给图片加水印的简单实现方法

    C#给图片加水印的简单实现方法

    这篇文章主要介绍了C#给图片加水印的简单实现方法,涉及C#操作图片的相关技巧,非常具有实用价值,需要的朋友可以参考下
    2015-05-05
  • C#程序中创建、复制、移动、删除文件或文件夹的示例

    C#程序中创建、复制、移动、删除文件或文件夹的示例

    这篇文章主要介绍了C#程序中创建、复制、移动、删除文件或文件夹的示例,即对System.IO命名空间中类的运用,需要的朋友可以参考下
    2016-02-02
  • 浅谈C#索引器

    浅谈C#索引器

    这篇文章主要简单介绍C#索引器,索引器使你可从语法上方便地创建类、结构或接口,以便客户端应用程序可以像访问数组一样访问它们。编译器将生成一个 Item 属性和适当的访问器方法,在主要目标是封装内部集合或数组的类型中,常常要实现索引器,下面我们一起来看看具体内容吧
    2021-11-11
  • C# 变量,常量数据类型详情

    C# 变量,常量数据类型详情

    这篇文章主要介绍了C# 变量,常量数据类型详情,常量是指在程序运行中不能改变的数据,定义一个常量与定义一个变量过程类似,只是多加一个关键词const
    2022-07-07
  • UpdateLayeredWindow实现任意异形窗口使用详解

    UpdateLayeredWindow实现任意异形窗口使用详解

    这篇文章主要为大家介绍了UpdateLayeredWindow实现任意异形窗口使用详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-09-09
  • C#开发教程之FTP上传下载功能详解

    C#开发教程之FTP上传下载功能详解

    这篇文章主要为大家详细介绍了C#开发教程之FTP上传下载功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-04-04

最新评论