如何在Objective-C(iOS)的图像上写文本?
我想以编程方式制作这样的图像:
我有上面的图像和文字与我。 我应该在图像上写文字吗?
我想使它成为一个完整的PNG图像(图像+标签),并将其设置为button的背景。
请提供任何示例代码或任何build议。
在图像中绘制文本并返回结果图像:
+(UIImage*) drawText:(NSString*) text inImage:(UIImage*) image atPoint:(CGPoint) point { UIFont *font = [UIFont boldSystemFontOfSize:12]; UIGraphicsBeginImageContext(image.size); [image drawInRect:CGRectMake(0,0,image.size.width,image.size.height)]; CGRect rect = CGRectMake(point.x, point.y, image.size.width, image.size.height); [[UIColor whiteColor] set]; [text drawInRect:CGRectIntegral(rect) withFont:font]; UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext(); return newImage; }
用法:
// note: replace "ImageUtils" with the class where you pasted the method above UIImage *img = [ImageUtils drawText:@"Some text" inImage:img atPoint:CGPointMake(0, 0)];
将图像内的文字原点从0,0改为任何你喜欢的点。
要在文本后面绘制纯色矩形,请在[[UIColor whiteColor] set];
行之前添加以下内容[[UIColor whiteColor] set];
:
[[UIColor brownColor] set]; CGContextFillRect(UIGraphicsGetCurrentContext(), CGRectMake(0, (image.size.height-[text sizeWithFont:font].height), image.size.width, image.size.height));
我正在使用文本大小来计算纯色矩形的原点,但可以用任何数字replace它。
我对iOS 7支持的第一个答案的贡献是:
+(UIImage*) drawText:(NSString*) text inImage:(UIImage*) image atPoint:(CGPoint) point { UIGraphicsBeginImageContextWithOptions(image.size, YES, 0.0f); [image drawInRect:CGRectMake(0,0,image.size.width,image.size.height)]; CGRect rect = CGRectMake(point.x, point.y, image.size.width, image.size.height); [[UIColor whiteColor] set]; UIFont *font = [UIFont boldSystemFontOfSize:12]; if([text respondsToSelector:@selector(drawInRect:withAttributes:)]) { //iOS 7 NSDictionary *att = @{NSFontAttributeName:font}; [text drawInRect:rect withAttributes:att]; } else { //legacy support [text drawInRect:CGRectIntegral(rect) withFont:font]; } UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext(); return newImage; }
希望这可以帮助
编辑:修改UIGraphicsBeginImageContextWithOptions
来处理屏幕比例。 Thk @SoftDesigner
仅限iOS7。
水印在右下angular。
@interface UIImage (DrawWatermarkText) -(UIImage*)drawWatermarkText:(NSString*)text; @end @implementation UIImage (DrawWatermarkText) -(UIImage*)drawWatermarkText:(NSString*)text { UIColor *textColor = [UIColor colorWithWhite:0.5 alpha:1.0]; UIFont *font = [UIFont systemFontOfSize:50]; CGFloat paddingX = 20.f; CGFloat paddingY = 20.f; // Compute rect to draw the text inside CGSize imageSize = self.size; NSDictionary *attr = @{NSForegroundColorAttributeName: textColor, NSFontAttributeName: font}; CGSize textSize = [text sizeWithAttributes:attr]; CGRect textRect = CGRectMake(imageSize.width - textSize.width - paddingX, imageSize.height - textSize.height - paddingY, textSize.width, textSize.height); // Create the image UIGraphicsBeginImageContext(imageSize); [self drawInRect:CGRectMake(0, 0, imageSize.width, imageSize.height)]; [text drawInRect:CGRectIntegral(textRect) withAttributes:attr]; UIImage *resultImage = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext(); return resultImage; } @end
用法:
UIImage *image = [UIImage imageNamed:@"mona_lisa"]; image = [image drawWatermarkText:@"Leonardo da Vinci"];
这是Swift版本。
func textToImage(drawText: NSString, inImage: UIImage, atPoint:CGPoint)->UIImage{ // Setup the font specific variables var textColor: UIColor = UIColor.whiteColor() var textFont: UIFont = UIFont(name: "Helvetica Bold", size: 12)! //Setup the image context using the passed image. UIGraphicsBeginImageContext(inImage.size) //Setups up the font attributes that will be later used to dictate how the text should be drawn let textFontAttributes = [ NSFontAttributeName: textFont, NSForegroundColorAttributeName: textColor, ] //Put the image into a rectangle as large as the original image. inImage.drawInRect(CGRectMake(0, 0, inImage.size.width, inImage.size.height)) // Creating a point within the space that is as bit as the image. var rect: CGRect = CGRectMake(atPoint.x, atPoint.y, inImage.size.width, inImage.size.height) //Now Draw the text into an image. drawText.drawInRect(rect, withAttributes: textFontAttributes) // Create a new image out of the images we have created var newImage: UIImage = UIGraphicsGetImageFromCurrentImageContext() // End the context now that we have the image we need UIGraphicsEndImageContext() //And pass it back up to the caller. return newImage }
要调用它,你只需传入一个图像。
textToImage("000", inImage: UIImage(named:"thisImage.png")!, atPoint: CGPointMake(20, 20))
下面的链接帮助我得到这个正确的。
Swift – 用drawInRect绘制文本:withAttributes:
如何在Objective-C(iOS)的图像上写文本?
最初的目标是创build一个dynamic的图像,我可以在AnnotaionView中使用,比如在地图上给定的位置放置一个价格,这对于它来说非常有用。 希望这可以帮助有人试图做同样的事情。
我做了这样的事情! 浏览并结合一些例子。
放置图像中间的文字,如果需要调整字体的大小。
UIImage *myImage = [UIImage imageNamed:@"promoicon.png"]; UIGraphicsBeginImageContext(myImage.size); [myImage drawInRect:CGRectMake(0,0,myImage.size.width,myImage.size.height)]; UITextView *myText = [[UITextView alloc] init]; myText.font = [UIFont fontWithName:@"TrebuchetMS-Bold" size:15.0f]; myText.textColor = [UIColor whiteColor]; myText.text = NSLocalizedString(@"promotionImageText", @""); myText.backgroundColor = [UIColor clearColor]; CGSize maximumLabelSize = CGSizeMake(myImage.size.width,myImage.size.height); CGSize expectedLabelSize = [myText.text sizeWithFont:myText.font constrainedToSize:maximumLabelSize lineBreakMode:UILineBreakModeWordWrap]; myText.frame = CGRectMake((myImage.size.width / 2) - (expectedLabelSize.width / 2), (myImage.size.height / 2) - (expectedLabelSize.height / 2), myImage.size.width, myImage.size.height); [[UIColor whiteColor] set]; [myText.text drawInRect:myText.frame withFont:myText.font]; UIImage *myNewImage = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext();
我已经创build了完全自定义的扩展UIImage在Swift中绘制水印:
extension UIImage{ enum WaterMarkCorner{ case TopLeft case TopRight case BottomLeft case BottomRight } func waterMarkedImage(#waterMarkText:String, corner:WaterMarkCorner = .BottomRight, margin:CGPoint = CGPoint(x: 20, y: 20), waterMarkTextColor:UIColor = UIColor.whiteColor(), waterMarkTextFont:UIFont = UIFont.systemFontOfSize(20), backgroundColor:UIColor = UIColor.clearColor()) -> UIImage{ let textAttributes = [NSForegroundColorAttributeName:waterMarkTextColor, NSFontAttributeName:waterMarkTextFont] let textSize = NSString(string: waterMarkText).sizeWithAttributes(textAttributes) var textFrame = CGRectMake(0, 0, textSize.width, textSize.height) let imageSize = self.size switch corner{ case .TopLeft: textFrame.origin = margin case .TopRight: textFrame.origin = CGPoint(x: imageSize.width - textSize.width - margin.x, y: margin.y) case .BottomLeft: textFrame.origin = CGPoint(x: margin.x, y: imageSize.height - textSize.height - margin.y) case .BottomRight: textFrame.origin = CGPoint(x: imageSize.width - textSize.width - margin.x, y: imageSize.height - textSize.height - margin.y) } /// Start creating the image with water mark UIGraphicsBeginImageContext(imageSize) self.drawInRect(CGRectMake(0, 0, imageSize.width, imageSize.height)) NSString(string: waterMarkText).drawInRect(textFrame, withAttributes: textAttributes) let waterMarkedImage = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() return waterMarkedImage } }
正如你看到的,我已经添加了一些属性的默认值,所以你可以忽略,如果你不需要改变。 这里有一些如何使用它的例子:
let watermark1 = image.waterMarkedImage(waterMarkText: "@yourapp") let watermark2 = image.waterMarkedImage(waterMarkText: "your app name", corner: .TopRight, margin: CGPoint(x: 5, y: 5), waterMarkTextColor: UIColor.greenColor()) let watermark3 = image.waterMarkedImage(waterMarkText: "appName", waterMarkTextColor: UIColor.blackColor(), waterMarkTextFont: UIFont(name: "Helvatica", size: 25)!)
这里是一个Swift版本,正确的中心在图像上的文字。 这适用于各种大小的文字。
func addTextToImage(text: NSString, inImage: UIImage, atPoint:CGPoint) -> UIImage{ // Setup the font specific variables let textColor = YOURCOLOR let textFont = YOUR SIZE //Setups up the font attributes that will be later used to dictate how the text should be drawn let textFontAttributes = [ NSFontAttributeName: textFont, NSForegroundColorAttributeName: textColor, ] // Create bitmap based graphics context UIGraphicsBeginImageContextWithOptions(inImage.size, false, 0.0) //Put the image into a rectangle as large as the original image. inImage.drawInRect(CGRectMake(0, 0, inImage.size.width, inImage.size.height)) // Our drawing bounds let drawingBounds = CGRectMake(0.0, 0.0, inImage.size.width, inImage.size.height) let textSize = text.sizeWithAttributes([NSFontAttributeName:textFont]) let textRect = CGRectMake(drawingBounds.size.width/2 - textSize.width/2, drawingBounds.size.height/2 - textSize.height/2, textSize.width, textSize.height) text.drawInRect(textRect, withAttributes: textFontAttributes) // Get the image from the graphics context let newImag = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() return newImag }
使用这种方法来添加您的文本字段的图像与选定的字体和颜色和大小
//Method to add - (UIImage *) addText:(UIImage *)img text:(NSString *)text { CGRect rect = CGRectMake(0,0, img.size.width, img.size.height); // create a context according to image size UIGraphicsBeginImageContext(rect.size); // draw image [img drawInRect:rect]; float fontSize = _txtvwEdit.font.pointSize*2; NSLog(@"Original %f new %f",_txtvwEdit.font.pointSize,fontSize); UIFont* font = [UIFont fontWithName:_txtvwEdit.font.fontName size:fontSize]; CGRect textRect = CGRectMake((_txtvwEdit.frame.origin.x*2)-5,_txtvwEdit.frame.origin.y*2,_txtvwEdit.frame.size.width*2,_txtvwEdit.frame.size.height*2); if ([temparyGifframes count]>0) { font = [UIFont fontWithName:_txtvwEdit.font.fontName size:_txtvwEdit.font.pointSize]; textRect = CGRectMake(_txtvwEdit.frame.origin.x,_txtvwEdit.frame.origin.y ,_txtvwEdit.frame.size.width,_txtvwEdit.frame.size.height); } /// Make a copy of the default paragraph style NSMutableParagraphStyle* paragraphStyle = [[NSParagraphStyle defaultParagraphStyle] mutableCopy]; paragraphStyle.lineBreakMode = NSLineBreakByCharWrapping; paragraphStyle.alignment = NSTextAlignmentLeft; NSDictionary *attributes = @{ NSFontAttributeName: font, NSForegroundColorAttributeName: _txtvwEdit.textColor,NSParagraphStyleAttributeName: paragraphStyle }; // draw text [text drawInRect:textRect withAttributes:attributes]; // get as image UIImage * image = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext(); return image; }
考虑到性能,你应该避免频繁的调用-drawRect :. 每个UIView都支持一个CALayer,只要CALayer停留在层次结构中,图像就保留在内存中。这意味着您在应用程序中看到的大部分操作(包括视图/图层的移动,旋转和缩放) ,不需要重绘。这意味着你可以使用在UIImageView上添加一个CATextLayer,如果你不需要带水印的图像。 https://developer.apple.com/library/ios/qa/qa1708/_index.html
- (void)addText:(NSString *)text inImageView:(UIImageView *)imageView { CATextLayer *textLayer = [CATextLayer layer]; UIFont *font = [UIFont systemFontOfSize:14.0f]; CGSize textSize = [text sizeWithAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:14.0f]}]; textLayer.frame = CGRectMake((imageView.size.width - textSize.width)/2, (imageView.size.height - textSize.height)/2, textSize.width, textSize.height);; textLayer.string = text; textLayer.fontSize = font.pointSize; [imageView.layer addSublayer:textLayer]; }
在@Jano的Swift-3答案: –
func drawText(text:NSString ,image:UIImage ,point:CGPoint ) -> UIImage { let font = UIFont.boldSystemFont(ofSize: 12) UIGraphicsBeginImageContext(image.size) image.draw(in:CGRect(x: 0, y: 0, width: image.size.width, height: image.size.height) ) let rect = CGRect(x: point.x, y: point.y, width:image.size.width, height: image.size.height ) UIColor.white.set() text.draw(in: rect.integral, withAttributes: [NSFontAttributeName : font]) let image = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() return image! }
Swift 3
extension UIImage { func textToImage(drawText: NSString, atPoint:CGPoint) -> UIImage? { // Setup the font specific variables let textColor: UIColor = UIColor.white let textFont: UIFont = UIFont(name: "Helvetica Bold", size: 12)! //Setup the image context using the passed image. UIGraphicsBeginImageContext(self.size) //Setups up the font attributes that will be later used to dictate how the text should be drawn let textFontAttributes = [ NSFontAttributeName: textFont, NSForegroundColorAttributeName: textColor, ] as [String : Any] //Put the image into a rectangle as large as the original image. self.draw(in: CGRect(x:0, y:0, width:self.size.width, height: self.size.height)) // Creating a point within the space that is as bit as the image. let rect: CGRect = CGRect(x:atPoint.x, y:atPoint.y, width:self.size.width, height:self.size.height) //Now Draw the text into an image. drawText.draw(in: rect, withAttributes: textFontAttributes) // Create a new image out of the images we have created let newImage: UIImage? = UIGraphicsGetImageFromCurrentImageContext() // End the context now that we have the image we need UIGraphicsEndImageContext() //And pass it back up to the caller. return newImage } }
@Hossam Ghareebs的Swift 3版本回答并添加了缺less的backgroundColor参数的集成:
enum WaterMarkCorner{ case TopLeft case TopRight case BottomLeft case BottomRight } extension UIImage{ func waterMarkedImage(_ waterMarkText:String, corner:WaterMarkCorner = .TopRight, margin:CGPoint = CGPoint(x: 20, y: 20), waterMarkTextColor:UIColor = UIColor.black, waterMarkTextFont:UIFont = UIFont.systemFont(ofSize: 40), backgroundColor:UIColor = UIColor(white: 1.0, alpha: 0.5)) -> UIImage?{ let textAttributes = [NSForegroundColorAttributeName:waterMarkTextColor, NSFontAttributeName:waterMarkTextFont, NSBackgroundColorAttributeName: backgroundColor] let textSize = NSString(string: waterMarkText).size(attributes: textAttributes) var textFrame = CGRect(x:0, y:0, width:textSize.width, height:textSize.height) let imageSize = self.size switch corner{ case .TopLeft: textFrame.origin = margin case .TopRight: textFrame.origin = CGPoint(x: imageSize.width - textSize.width - margin.x, y: margin.y) case .BottomLeft: textFrame.origin = CGPoint(x: margin.x, y: imageSize.height - textSize.height - margin.y) case .BottomRight: textFrame.origin = CGPoint(x: imageSize.width - textSize.width - margin.x, y: imageSize.height - textSize.height - margin.y) } /// Start creating the image with water mark UIGraphicsBeginImageContext(imageSize) self.draw(in: CGRect(x:0, y:0, width:imageSize.width, height:imageSize.height)) NSString(string: waterMarkText).draw(in: textFrame, withAttributes: textAttributes) let waterMarkedImage = UIGraphicsGetImageFromCurrentImageContext() UIGraphicsEndImageContext() return waterMarkedImage } }
UIImageView *imageView = [UIImageView alloc]; imageView.image = [UIImage imageNamed:@"img.png"]; UILabel *label = [UILabel alloc]; label.text = @"Your text"; [imageView addsubview:label];
设置要在其中显示标签的标签的框架。