美文网首页
长图、截图、绘图

长图、截图、绘图

作者: Linco_Yang | 来源:发表于2018-07-09 18:34 被阅读0次

title: 长图、截图、绘图
date: 2017-11-27
categories:
tags: Objective-C,


关于图片绘制的内容有很多,很难用一篇文章来介绍。这篇文章只是在工作中遇到的情况。根据不同的情况来分别记录一下当时是怎么处理的。

[TOC]

长图

在某些滚动视图里面,可能遇到一张长图来展示所有的内容。
在继承UIScrollView的视图里,可以通过如下方式来生成长图。

UIImage* image = nil;
UIGraphicsBeginImageContext(scrollView.contentSize);
{//重点,既要获取整个scrollerView,又要保证不破环界面本身
CGPoint savedContentOffset = scrollView.contentOffset; // 内容偏移
CGRect savedFrame = scrollView.frame;
scrollView.contentOffset = CGPointZero;
scrollView.frame = CGRectMake(0, 0, scrollView.contentSize.width, scrollView.contentSize.height);
[scrollView.layer renderInContext: UIGraphicsGetCurrentContext()];
image = UIGraphicsGetImageFromCurrentImageContext();
scrollView.contentOffset = savedContentOffset;
scrollView.frame = savedFrame;
}
UIGraphicsEndImageContext();
使用
UIGraphicsBeginImageContextWithOptions(scrollView.contentSize, scrollView.opaque, 0.0);
替换
UIGraphicsBeginImageContext(scrollView.contentSize);
处理图片失真的问题。

tlayer层的大小取决于frame,不是contentSize。

某个UI控件的内容

这个其实是最常见的需求情况,比如某个图片是某种宣传渠道。你们后台没有搞不同机型返回不同的图片。
其实这个时候完全可以直接把读取到的图片,但是,有的时候图片需要进行处理(比如圆角、边框、显示卡片的样式等)。这种情况下没办法对网络请求的图片直接存储。这时可以把需要生成图片的控件做绘制存储。

UIGraphicsBeginImageContext(currentView.bounds.size); //currentView 当前的view  创建一个基于绘图的图形上下文并指定大小为当前视图的bounds
[currentView.layer renderInContext:UIGraphicsGetCurrentContext()]; //renderInContext呈现接受者及其子范围到指定的上下文
UIImage *viewImage = UIGraphicsGetImageFromCurrentImageContext(); //返回一个基于当前图形上下文的图片
UIGraphicsEndImageContext(); //移除栈顶的基于当前位图的图形上下文
UIImageWriteToSavedPhotosAlbum(viewImage, nil, nil, nil); //然后将该图片保存到图片图

在画布上添加UI元素来绘制图片

这种需求可能会在下面这样的场景中遇到:宣传用的落地页。
因为这种场景中一般都会有数额等信息,这些数值每个用户是不一样的。这个时候就需要在模板上绘制出这些会变动的信息。
以某个项目中的战绩海报为例:

#define UIColorFromRGB(rgbValue) [UIColor colorWithRed:((float)((rgbValue & 0xFF0000) >> 16))/255.0 green:((float)((rgbValue & 0xFF00) >> 8))/255.0 blue:((float)(rgbValue & 0xFF))/255.0 alpha:1.0]

+ (UIImage *)createShareImageWithID:(NSString *)userid totalIncome:(NSString *)totalIncome taskIncome:(NSString *)taskIncome apprenticeIncome:(NSString *)apprenticeIncome apprenticeNumber:(NSString *)apprenticeNumber userIcon:(NSString *)userIcon qrCode:(NSString *)qrCode {
UIImage *image = [UIImage imageNamed: @"imageNameString"];
CGSize size= CGSizeMake(image.size.width, image.size.height); // 画布大小 图片大小固定的.
UIGraphicsBeginImageContextWithOptions(size, NO, 0.0); // 尺寸 不透明 无缩放
[image drawAtPoint:CGPointMake(0, 0)];
// 获得一个位图图形上下文
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextDrawPath (context, kCGPathStroke);

//绘制二维码
NSData *ewmData = [NSData dataWithContentsOfURL:[NSURL URLWithString:qrCode]];
UIImage *ewmImage = [UIImage imageWithData:ewmData];
[ewmImage drawInRect:CGRectMake(90, 750, 140, 140) ];

//
NSMutableParagraphStyle *paragraphStyle = [[NSParagraphStyle defaultParagraphStyle] mutableCopy];
paragraphStyle.lineBreakMode = NSLineBreakByTruncatingTail;
paragraphStyle.alignment = NSTextAlignmentCenter;

NSMutableAttributedString *apprenticeAttributedStr = [[NSMutableAttributedString alloc] initWithString:[NSString stringWithFormat:@"%@ 人", apprenticeNumber]];
NSUInteger apprenticeStrLength = apprenticeAttributedStr.length;
[apprenticeAttributedStr addAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:52.f],NSForegroundColorAttributeName:UIColorFromRGB(0x27313e),NSParagraphStyleAttributeName:paragraphStyle} range:NSMakeRange(0, apprenticeStrLength-2)];
[apprenticeAttributedStr addAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:28.f],NSForegroundColorAttributeName:UIColorFromRGB(0x27313e),NSParagraphStyleAttributeName:paragraphStyle} range:NSMakeRange(apprenticeStrLength-1, 1)];
[apprenticeAttributedStr drawInRect:CGRectMake(0, 610, 375, 300)];

NSMutableAttributedString *totalIncomeAttributeStr = [[NSMutableAttributedString alloc] initWithString:[NSString stringWithFormat:@"%@ 元", apprenticeIncome]];
NSUInteger totalIncomeStrLength = totalIncomeAttributeStr.length;
[totalIncomeAttributeStr addAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:52.f],NSForegroundColorAttributeName:UIColorFromRGB(0x27313e),NSParagraphStyleAttributeName:paragraphStyle} range:NSMakeRange(0, totalIncomeStrLength-2)];
[totalIncomeAttributeStr addAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:28.f],NSForegroundColorAttributeName:UIColorFromRGB(0x27313e),NSParagraphStyleAttributeName:paragraphStyle} range:NSMakeRange(totalIncomeStrLength-1, 1)];
[totalIncomeAttributeStr drawInRect:CGRectMake(375, 610, 375, 300)];

UIImage *tempImg = [UIImage imageNamed:@"show_btn"];
[tempImg drawInRect:CGRectMake(145, 980, 460, 161)];

// 返回绘制的新图形
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();

return newImage;
}

IMG_0800.JPG

系统API

/* Called via the -display method when the `contents' property is being
* updated. Default implementation does nothing. The context may be
* clipped to protect valid layer content. Subclasses that wish to find
* the actual region to draw can call CGContextGetClipBoundingBox(). */

- (void)drawInContext:(CGContextRef)ctx;

/** Rendering properties and methods. **/

/* Renders the receiver and its sublayers into 'ctx'. This method
* renders directly from the layer tree. Renders in the coordinate space
* of the layer.
*
* WARNING: currently this method does not implement the full
* CoreAnimation composition model, use with caution. */

- (void)renderInContext:(CGContextRef)ctx;

相关文章

  • 长图、截图、绘图

    title: 长图、截图、绘图date: 2017-11-27categories:tags: Objective...

  • 谷歌长图截图

    1. F12 打开控制台 2. 同时按下 Ctrl + Shift + P 3. 在标注输入框内输入Capture...

  • swift 截屏,长图处理

    起因: 公司项目需要截图,截长图 问题: 如何截图,截长图,网上的资料往往不是太长,就是没解决问题,甚至有不少bu...

  • iOS 截图、截长图、图片拼接

    图片拼接 截图 UIScroolView、UITableView截取长图 截取长图部分我采用的逻辑是,首先获取co...

  • Annotable:当标注比截图还简单

    手机截图有两难,一是截长图,二是截图标注。 手机截图只能一屏一屏截,想要截一张长图,必须要借助其他爱屁屁或者直接上...

  • 在手机上一键把文章生成长图的方法!

    长图痛点:截图丑,有水印,时间长…… 本期特色:复制粘贴网页/文章链接可以转成一张长图片,免费! 旧方法 手机截图...

  • MATLAB 绘图(二)

    概述 本次的内容涉及到除了线图以外的绘图,包括离散绘图、极坐标绘图、曲面绘图和统计绘图。 离散绘图:茎干图、阶梯图...

  • 11-1绘图

    图就是数据,数据就是图 base绘图函数image.png 绘图参数image.png*低级绘图函数需要寄生于高级...

  • Python网页截图/屏幕截图/截长图如何实现?

    对于Python网页截图这个问题,笔者网络一番搜索之后,总结了大概有如下几种实现方案, 利用PyQT5 利用sel...

  • 如何截很长很长的图

    今天做一份报表 需要在Word里面截一张长图 电脑自带的截图和QQ截图 都只能截取整个屏幕 不能拖动截图 我想了两...

网友评论

      本文标题:长图、截图、绘图

      本文链接:https://www.haomeiwen.com/subject/wmbtpftx.html