返回顶部
首页 > 资讯 > 后端开发 > 其他教程 >用C#绘制九宫格形式的图片
  • 426
分享到

用C#绘制九宫格形式的图片

2024-04-02 19:04:59 426人浏览 八月长安
摘要

目录方法一:图片上绘制直线方法二:切分绘制图片总结使用GDI+产生九宫格形式的图片,不考虑局部放大的功能。具体的方式如下: 方法一:图片上绘制直线   想到的最简

使用GDI+产生九宫格形式的图片,不考虑局部放大的功能。具体的方式如下:

方法一:图片上绘制直线

  想到的最简单粗暴的方式就是直接在图片上绘制九宫格的线,看着像是切成了九片,实际上还是完整的图片,主要代码及效果如下所示:

	 m_startX = pnlcanvas.Width / 6;
     m_startY = pnlCanvas.Height / 6;
     m_imageWidth = pnlCanvas.Width - m_startX * 2;
     m_imageHeight = pnlCanvas.Height - m_startY * 2;

     e.Graphics.DrawImage(m_image, m_startX, m_startY, m_imageWidth, m_imageHeight);

     using (Pen p = new Pen(Brushes.White,m_lineWidth))
     {
         int stepX = m_imageWidth / 3;
         int stepY = m_imageHeight / 3;

         for(int i=1;i<3;i++)
         {
             e.Graphics.DrawLine(p, m_startX + i * stepX, m_startY, m_startX + i * stepX, m_startY + m_imageHeight);
             e.Graphics.DrawLine(p, m_startX, m_startY + i * stepY, m_startX + m_imageWidth, m_startY + i * stepY);
         }
     }

在这里插入图片描述

这种方式的缺点是白线会遮住部分图片内容。如果要实现局部放大,就要计算并保存每部分图片的位置和大小,等鼠标移动到图片区域时,将该部分图片放大绘制即可。

方法二:切分绘制图片

  Graphics类中的DrawImage函数有一个重载函数,可以将图片的部分区域内容绘制到指定区域,可以利用该函,将原图分为九个区域,然后依次绘制到窗口中,在加上线条即可构成九宫格形式。主要代码及效果图如下所示:
  这种方式的问题是绘制线条时难以精确的将线条绘制到预留的线条区域,看着效果不太好。

	 m_startX = pnlCanvas.Width / 6-2*m_lineWidth; 
     m_startY = pnlCanvas.Height / 6 - 2 * m_lineWidth;
     m_imageWholeWidth = pnlCanvas.Width - m_startX * 2;
     m_imageWholeHeight = pnlCanvas.Height - m_startY * 2;
     int srcImageSplittedWidth = m_image.Width / 3;
     int srcImageSplittedHeight = m_image.Height / 3;
     int destImageSplittedWidth = (m_imageWholeWidth - 2 * m_lineWidth) / 3;
     int destImageSplittedHeight = (m_imageWholeHeight - 2 * m_lineWidth) / 3;
     
	 for (int heightIndex = 0; heightIndex < 3; heightIndex++)
     {
         for (int widthIndex = 0; widthIndex < 3; widthIndex++)
         {
             g.DrawImage(m_image,
                 new Rectangle(m_startX + destImageSplittedWidth * widthIndex + m_lineWidth * widthIndex, m_startY + destImageSplittedHeight * heightIndex + m_lineWidth * heightIndex, destImageSplittedWidth, destImageSplittedHeight),
                 new Rectangle(srcImageSplittedWidth * widthIndex, srcImageSplittedHeight * heightIndex, srcImageSplittedWidth, srcImageSplittedHeight), GraphicsUnit.Pixel);
         }                
     }
     
	 using (Pen p = new Pen(Brushes.White, m_lineWidth))
     {
        p.Alignment = System.Drawing.Drawing2D.PenAlignment.Center;
        for (int i = 1; i < 3; i++)
        {
            g.DrawLine(p, m_startX + destImageSplittedWidth * i + m_lineWidth * i, m_startY, m_startX + destImageSplittedWidth * i + m_lineWidth * i, m_startY + m_imageWholeHeight);
            g.DrawLine(p, m_startX, m_startY + i * destImageSplittedHeight + m_lineWidth * i, m_startX + m_imageWholeWidth, m_startY + i * destImageSplittedHeight + m_lineWidth * i);
        }
     }        

在这里插入图片描述

为避免上述问题,将图片背景设置为白色,这样绘制完九片图形后,结合背景色,看着就是九宫格形式。代码就补贴了,就是上面的代码去掉绘制线条部分,然后在绘制图片前用白色填充图片区域即可。代码效果如下图所示。

在这里插入图片描述

此时还有一点问题,就是右侧和下方还有一丁点空白(感觉是计算各属性值时取整造成的)。为消除空白,直接在填充图片区域背景色时,填充宽度和高度减少2像素,这样就不会出现上述问题了。最终的效果如下所示:

g.FillRectangle(Brushes.White, m_startX, m_startY, m_imageWholeWidth-2, m_imageWholeHeight-2);

在这里插入图片描述

总结

到此这篇关于用C#绘制九宫格形式的图片的文章就介绍到这了,更多相关C#九宫格图片内容请搜索编程网以前的文章或继续浏览下面的相关文章希望大家以后多多支持编程网!

--结束END--

本文标题: 用C#绘制九宫格形式的图片

本文链接: https://lsjlt.com/news/163840.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • 用C#绘制九宫格形式的图片
    目录方法一:图片上绘制直线方法二:切分绘制图片总结使用GDI+产生九宫格形式的图片,不考虑局部放大的功能。具体的方式如下: 方法一:图片上绘制直线   想到的最简...
    99+
    2024-04-02
  • 怎么用C#绘制九宫格形式的图片
    这篇文章主要介绍了怎么用C#绘制九宫格形式的图片,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。方法一:图片上绘制直线&emsp;&emsp;想到的最简单粗暴的...
    99+
    2023-06-29
  • 怎么用Python制作的九宫格图片
    本篇内容介绍了“怎么用Python制作的九宫格图片”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!原理用Python制作的九宫格图像生成器包装...
    99+
    2023-06-30
  • C++ OpenCV怎么制作九宫格图像
    今天小编给大家分享一下C++ OpenCV怎么制作九宫格图像的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。一、九宫...
    99+
    2023-06-26
  • C++OpenCV实战之制作九宫格图像
    目录前言一、九宫格图像二、源码三、效果显示总结前言 本文将使用OpenCV C++ 制作九宫格图像。其实原理很简单,就是将一张图像均等分成九份。然后将这九个小块按一定间隔(九宫格效果...
    99+
    2024-04-02
  • Android形状图形与状态列表图形及九宫格图片超详细讲解
    目录一、图形Drawable二、形状图形三、九宫格图片四、状态列表图形一、图形Drawable Drawable类型表达了各种各样的图形,包括图片、色块、画板、背景等。 包含图片在内...
    99+
    2024-04-02
  • 如何使用Python生成九宫格图片
    这篇文章将为大家详细讲解有关如何使用Python生成九宫格图片,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。一、前言大家在朋友圈应该看到过用一张图片以九宫格的方式显示,效果大致如下:要实现上面的效果非常简...
    99+
    2023-06-14
  • Python生成九宫格图片的示例代码
    一、前言 大家在朋友圈应该看到过用一张图片以九宫格的方式显示,效果大致如下: 要实现上面的效果非常简单,我们只需要截取图片的九个区域即可。今天我们就要带大家使用Python来实现...
    99+
    2024-04-02
  • python实现图片九宫格分割的示例
    目录简介实现原理源码运行结果简介 大家都知道在微信朋友圈或者微博以及QQ动态中,有很多“强迫症患者”发图片都爱发9张,而有些图是一张图片分成的九宫图,对于这种操作,大家知道是怎么做...
    99+
    2024-04-02
  • 使用python怎么实现一个九宫格图片
    这篇文章给大家介绍使用python怎么实现一个九宫格图片,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。python的数据类型有哪些python的数据类型:1. 数字类型,包括int(整型)、long(长整型)和floa...
    99+
    2023-06-14
  • CSS怎样实现动态图片的九宫格布局
    这篇文章给大家分享的是有关CSS怎样实现动态图片的九宫格布局的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。前提条件: content="width=750"<meta name...
    99+
    2023-06-08
  • android绘制圆形图片的两种方式示例
    android绘制圆形图片的两种方式 看下效果先 下面有完整的示例代码 使用BitmapShader(着色器) 我们在绘制view 的时候 就是小学上美术课 用水彩笔在...
    99+
    2022-06-06
    示例 图片 Android
  • 基于Python实现图片一键切割九宫格的工具
    有时候发微博时候,需要裁切图片为九宫格,但是ps或者其他工具都太麻烦,这里写一个python一键切割九宫格的工具,以供大家学习和使用! 实现代码 """ 1.将一张图片填充为正方形...
    99+
    2023-03-22
    Python图片切割九宫格 Python图片 九宫格 Python九宫格
  • 怎么用C++ OpenCV绘制几何图形
    本篇内容介绍了“怎么用C++ OpenCV绘制几何图形”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!具体内容如下绘制几何图形直线矩形多边形圆...
    99+
    2023-06-25
  • 利用Matlab绘制好看的旋转九边形
    目录PART.0 使用效果 PART.1 程序说明 PART.2 完整代码PART.0 使用效果  PART.1 程序说明 这个...
    99+
    2024-04-02
  • Android编程绘制圆形图片的方法
    本文实例讲述了Android编程绘制圆形图片的方法。分享给大家供大家参考,具体如下: 效果图如下: 第一步:新建RoundView自定义控件继承View package c...
    99+
    2022-06-06
    方法 图片 Android
  • 使用c++实现OpenCV绘制旋转矩形图形
    目录功能函数测试代码测试效果  功能函数 // 绘制旋转矩形 void DrawRotatedRect(cv::Mat mask,const cv::RotatedRe...
    99+
    2024-04-02
  • Pyecharts 绘制3种常用的图形
    目录1.上下组合2.左右组合3.一轴多图大家好,今天给大家利用 Pyecharts 绘制上下组合图、左右组合图、一轴多图,好用超经典,分析给大家 1.上下组合 from pyecha...
    99+
    2024-04-02
  • android图像绘制(五)画布保存为指定格式/大小的图片
    将图片进行编辑(放缩,涂鸦等),最后保存成指定格式、大小的图片。 先贴代码: 代码如下: Bitmap bmp = Bitmap.createBitmap(480, 800,...
    99+
    2022-06-06
    图片 Android
  • 怎么用Pyecharts绘制常用的图形
    本文小编为大家详细介绍“怎么用Pyecharts绘制常用的图形”,内容详细,步骤清晰,细节处理妥当,希望这篇“怎么用Pyecharts绘制常用的图形”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。1.上下组合fro...
    99+
    2023-06-29
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作