.NetCore实现图片缩放与裁剪 - 基于ImageSharp
前言
(突然发现断更有段时间了
最近在做博客的时候,需要实现一个类似Lorempixel、LoremPicsum这样的随机图片功能,图片有了,还需要一个根据输入的宽度高度获取图片的功能,由于之前处理图片时使用到了ImageSharp库,所以这次我立刻就想到用它。
分析需求
图片库中的图片基本都是我之前收集的壁纸什么的,尺寸参差不齐,有横屏的也有竖屏
然后包装成接口只需要输入宽度和高度,就能随机选一张图片然后进行缩放或者裁剪
我的思路是:
- 横屏图片,将高度调整到与输入高度一致,宽度按比例调整
- 竖屏图片,将宽度调整到与输入高度一致,高度按比例调整
然后再选取中间部分进行截取
当然还有特殊情况,就是输入的宽度和高度超过图片原来高度宽度的情况,这个只能破坏图片原有的比例,强行进行拉伸~
PS:本来想画个图表达一下思路,不过没找到趁手的画图工具(Draw.io:不要看我)
实现
首先读取图片
很简单,传入图片路径即可
当然也可以用流的方式读取
using var image = Image.Load("imagePath");
然后就是根据图片的大小各种情况来进行缩放和裁剪
在网上查到的很多博客用的代码都是类似image.Resize和image.Crop之类的,但这是旧版的ImageSharp代码
新版全都放在image.Mutate里,要什么操作再传入lambda表达式
(有点像ORM的操作)
比如缩放就是这样
image.Mutate(a => a.Resize(newWidth, newHeight));
裁剪就是这样
image.Mutate(a => a.Crop(new Rectangle(x, y, width, height)));
完整代码
功能很简单,完整代码在此
void GetImage(string imagePath, int width, int height) {
using var image = Image.Load(imagePath);
Rectangle cropRect;
int newWidth;
int newHeight;
// 横屏图片
if (image.Width > image.Height) {
if (width > image.Width) {
newWidth = width;
newHeight = height;
}
else {
newHeight = height;
newWidth = image.Width / image.Height * newHeight;
}
cropRect = new Rectangle((newWidth - width) / 2, 0, width, height);
}
// 竖屏图片
else {
if (height > image.Height) {
newWidth = width;
newHeight = height;
}
else {
newWidth = width;
newHeight = newWidth * image.Height / image.Width;
}
cropRect = new Rectangle(0, (newHeight - height) / 2, width, height);
}
image.Mutate(a => a.Resize(newWidth, newHeight));
image.Mutate(a => a.Crop(cropRect));
image.SaveAsPng("output.png");
}
后续在我的StarBlog开发笔记系列里,接下来会更新~
参考资料
- 随机图片网站:https://picsum.photos/
- .NetCore如何使用ImageSharp进行图片的生成:https://www.cnblogs.com/niwan/p/11126239.html
- https://stackoverflow.com/questions/63639644/how-load-an-image-from-disk-and-save-to-a-stream-using-imagesharp-while-preservi
.NetCore实现图片缩放与裁剪 - 基于ImageSharp的更多相关文章
- php使用imagick模块实现图片缩放、裁剪、压缩示例
PHP 使用Imagick模块 缩放,裁剪,压缩图片 包括gif图片 缩放 裁剪 复制代码代码如下: /** * 图片裁剪 * 裁剪规则: * 1. 高度为空或为零 按宽度缩放 高度自适 ...
- java图片缩放与裁剪
import java.awt.Graphics; import java.awt.Image; import java.awt.image.BufferedImage; import java.io ...
- C#图片处理示例(裁剪,缩放,清晰度,水印)
C#图片处理示例(裁剪,缩放,清晰度,水印) 吴剑 2011-02-20 原创文章,转载必需注明出处:http://www.cnblogs.com/wu-jian/ 前言 需求源自项目中的一些应用,比 ...
- PHP图片裁剪_图片缩放_PHP生成缩略图
在制作网页过程中,为了排版整齐美观,对网页中的图片处理成固定大小尺寸的图片,或是要截去图片边角中含有水印的图片,对于图片量多,每天更新大量图,靠人工PS处理是不现实的,那么有没有自动处理图片的程序了! ...
- 用Js+css3实现图片旋转,缩放,裁剪,滤镜
还是前端图片的老话题,花了半天时间,东拼西凑,凑出个demo,优点在于代码少,核心代码就6行,目前刚做了旋转,缩放,裁剪,滤镜要js做,网络上也有现成的代码, 但是想做到自定义的滤镜咋办呢?这还要从底 ...
- 【转】java缩放图片、java裁剪图片代码工具类
一首先看下效果 二工具类 三测试类 在系统的上传图片功能中,我们无法控制用户上传图片的大小,用户可能会上传大到几十M小到1k的的图片,一方面图片太大占据了太多的空间,另一方面,我们没办法在页面上显示统 ...
- java多图片上传--前端实现预览--图片压缩 、图片缩放,区域裁剪,水印,旋转,保持比例。
java多图片上传--前端实现预览 前端代码: https://pan.baidu.com/s/1cqKbmjBSXOhFX4HR1XGkyQ 解压后: java后台: <!--文件上传--&g ...
- 图片裁剪(基于RxPaparazzo)
图片裁剪(基于RxPaparazzo) 前言:基于RxPaparazzo的图片裁剪,图片旋转.比例放大|缩小. 效果: 开发环境:AndroidStudio2.2.1+gradle-2.14.1 涉及 ...
- 图片上传裁剪zyupload
图片上传控件用的是zyupload控件,使用过程中遇到了一些问题,特别记录下来 上图是目前的使用效果,这个控件我是用js代码动态添加出来的 HTML代码: <div class="wi ...
随机推荐
- LC-242
利用ASCII码构成哈希表来映射 和这题类似: https://leetcode-cn.com/problems/minimum-window-substring/solution/li-yong-a ...
- 快速排序算法 - go实现
在分析redis集群中大Key的时候,通常都采用分析rdb文件的方式:但是这种方式需要在每一台redis服务器上部署分析程序及分析脚本,而像salt之类的工具运维没有开放给我们使用,一台一台部署不好管 ...
- JavaScript基础第02天笔记
JavaScript基础第02天 1 - 运算符(操作符) 1.1 运算符的分类 运算符(operator)也被称为操作符,是用于实现赋值.比较和执行算数运算等功能的符号. JavaScript中常用 ...
- (更新中)"华为杯" 武汉大学21级新生程序设计竞赛 非官方题解
"华为杯" 武汉大学21级新生程序设计竞赛 https://ac.nowcoder.com/acm/contest/31620#question D.和谐之树 思路:披着线段树外皮 ...
- 2021.07.17 P3177 树上染色(树形DP)
2021.07.17 P3177 树上染色(树形DP) [P3177 HAOI2015]树上染色 - 洛谷 | 计算机科学教育新生态 (luogu.com.cn) 重点: 1.dp思想是需要什么,维护 ...
- jsp第七周作业
1.p78-p79的例4-9 <%@ page language="java" import="java.util.*" pageEncoding=&qu ...
- Glade To Code 介绍
Glade To Code 简介 根据 Glade 文件生成指定语言的 GTK 代码的工具 使用说明 python3 glade-to-code.py -l [语言类型] -i [输入 Glade 文 ...
- *CTF babyarm内核题目分析
本文从漏洞分析.ARM64架构漏洞利用方式来讨论如何构造提权PoC达到读取root权限的文件.此题是一个ARM64架构的Linux 5.17.2 版本内核提权题目,目的是读取root用户的flag文件 ...
- Python 迭代器、生成器、可迭代对象
迭代器 1 #迭代器定义: 2 #类中得有__iter__和__next__两个方法 3 #__iter__方法放回对象本身,即:self(是迭代器对象) 4 #__next__方法,返回下一个数据, ...
- npm install xxxx --legacy-peer-deps命令是什么?
摘要:带着好奇心,研究学习了一番npm install xxxx --legacy-peer-deps命令是什么?为什么可以解决下载时候产生的依赖冲突呢? 本文分享自华为云社区<npm inst ...