一款简单的缩放拖拽图片控件

简介: 本文介绍一个针对 .NET 桌面应用程序的独立图片缩放拖拽显示控件 [SQPhoto](https://www.nuget.org/packages/SQPhoto/)。

SQPhoto 是一个 Windows 桌面应用的组件,支持 .NET6 和 .NET Framework 4.6 + 。基于 PictureBox 的图片展示工具,增加了拖动和缩放功能,便于在某些场景下的图片展示,比如我前面开发的 Snipping_OCR 工具就使用了这个组件。

Snipping_OCR

该用户组件采用 PanelPictureBox 组合的方式,控制 PictureBoxPanel 容器中显示的位置和大小来实现拖拽和放大缩小的功能。

/// <summary>
/// 计算鼠标移动位置是否还在容器内
/// </summary>
/// <returns></returns>
private bool IsMouseInPanel()
{
    if (PanBox.Left < PointToClient(Cursor.Position).X
    && PointToClient(Cursor.Position).X < PanBox.Left + PanBox.Width
    && PanBox.Top < PointToClient(Cursor.Position).Y
    && PointToClient(Cursor.Position).Y < PanBox.Top + PanBox.Height)
    {
        return true;
    }
    else
    {
        return false;
    }
}

/// <summary>
/// 鼠标移动
/// </summary>
/// <param name="sender"></param>
/// <param name="e"></param>
private void PicBox_MouseMove(object sender, MouseEventArgs e)
{
    //开启移动 左键按下 并且移动位置在框内
    if (_CanMove && isSelected && IsMouseInPanel())
    {
        PicBox.Location = new Point(PicBox.Left + (Cursor.Position.X - mouseDownPoint.X), PicBox.Top + (Cursor.Position.Y - mouseDownPoint.Y));
        mouseDownPoint = Cursor.Position;
    }
}

缩放的实现:

/// <summary>
/// 控制图片缩放
/// </summary>
/// <param name="change">变化情况,大于 0 放大,小于 0 缩小</param>
public void PicZoomSize(int change)
{
    var t = PicBox.Size;
    t.Width += change;
    t.Height += change;

    //控制最小缩放
    if (t.Width < _ZoomMin) return;
    PicBox.Size = t;

    //图片按中心比例放大缩小
    if (!_ZoomCenter) return;
    PicBox.Location = new Point((this.Width - PicBox.Width) / 2, (this.Height - PicBox.Height) / 2);
}

demo

以上组件和 Demo 仓库地址:https://github.com/sangyuxiaowu/SQPhoto

相关文章
|
JavaScript 前端开发 容器
手写图片拖拽、鼠标点位缩放
如题,无关技术背景,什么vue、react自己想用就用,这就是js加一点点css实现,意思就是可以任意迁。
218 0
|
前端开发 Android开发 数据格式
自定义ImageView实现图片的单指拖动和两指缩放
MainActivity如下: package cn.testtouchscreentomoveimage; import android.app.
1037 0
平铺文理+拉伸按钮图片
平铺文理+拉伸按钮图片
94 0
|
缓存 C# 虚拟化
WPF自定义控件与样式(12)-缩略图ThumbnailImage /gif动画图/图片列表
原文:WPF自定义控件与样式(12)-缩略图ThumbnailImage /gif动画图/图片列表 一.前言   申明:WPF自定义控件与样式是一个系列文章,前后是有些关联的,但大多是按照由简到繁的顺序逐步发布的等,若有不明白的地方可以参考本系列前面的文章,文末附有部分文章链接。
1464 0
|
9月前
|
索引
【sgPhotoPlayer】自定义组件:图片预览,支持点击放大、缩小、旋转图片
【sgPhotoPlayer】自定义组件:图片预览,支持点击放大、缩小、旋转图片
|
11天前
|
图形学
Unity UGUI实现鼠标拖动图片
在 Unity UGUI 中实现鼠标拖动图片功能,主要涉及事件检测、坐标转换和物体位置更新。根据鼠标移动量更新图片位置。代码示例展示了如何通过这些步骤实现拖动效果。
|
编解码 前端开发 C#
WPF布局之让你的控件随着窗口等比放大缩小,适应多分辨率满屏填充应用
  一直以来,我们设计windows应用程序,都是将控件的尺寸定好,无论窗体大小怎么变,都不会改变,这样的设计对于一般的应用程序来说是没有问题的,但是对于一些比较特殊的应用,比如有背景图片的,需要铺面整个屏幕,由于存在多种不同的分辨率,所以会出现布局混乱的情况。
2129 0
|
图形学
unity3d拖拽鼠标旋转模型
测试.png using UnityEngine; /// /// 脚本挂载到模型即可,模型添加 collider,isTrigger为true /// public class ModelRotation : MonoBehaviou...
1179 0
|
C#
艾伟_转载:在WPF里面实现以鼠标位置为中心缩放移动图片
  在以前的文章使用WPF Resource以及Transform等技术实现鼠标控制图片缩放和移动的效果里面,介绍了如何在WPF里面移动和放大缩小图片,程序也支持使用滚轮的方式缩放图片。然而前面文章里介绍的缩放功能只能以图片中心为原点来实现,但是这种功能往往并不是客户想要的,我们看图片的时候,往往都喜欢以鼠标放在图片的焦点为原点进行图片的缩放。
1240 0

热门文章

最新文章