add text(multiple line support) to imageView, edit, rotate or resize them as you want, then render the text on image
StickerTextView is an subclass of UIImageView. You can add multiple text to it, edit, rotate, resize the text as you want with one finger, then render the text on Image.
Just drag the Source files into your project(To get the latest version, please install manually)
To integrate StickerTextView into your Xcode project using CocoaPods, specify it in your Podfile and run
pod install:
use_frameworks! pod "JLStickerTextView", "~> 0.1.1"
To get the latest version:
Ruby use_frameworks! pod "JLStickerTextView", :git => "https://github.com/Textcat/JLStickerTextView.git"
First, import
JLStickerTextView, then subclass the UIImageView, which you want to add text on, to JLStickerImageView, like this:
import JLStickerTextView class ViewController: UIViewController { @IBOutlet var stickerView: JLStickerImageView! }
If you use Storyboard, you also need connect the UIImageView to
JLStikcerImageViewClass in Identity Inspector.
It is quite easy to add new label to current StickerImageView:
Swift stickerView.addLabel()
You can set the color, font , alignment, alpha.... of the label.(check all avaliable text attributes)
stickerView.textColor = UIColor.whiteColor()
Note: when you set the properties, you make change to the current selected TextLabel.
When you feel good, you are going to render the Text on Image and save the image:
let image = stickerView.renderTextOnView(stickerView) UIImageWriteToSavedPhotosAlbum(image!, nil, nil, nil)
Customize stickerTextView appearance is very strightforward:
//Set the image of close Button stickerView.currentlyEditingLabel.closeView!.image = UIImage(named: "cancel") //Set the image of rotate Button stickerView.currentlyEditingLabel.rotateView?.image = UIImage(named: "rotate") //Set the border color of textLabel stickerView.currentlyEditingLabel.border?.strokeColor = UIColor.redColor().CGColor
Note:
closeViewand
rotateVieware both UIimageView, while
borderis CAShapeLayer
This function is not complete yet, I just make it to fit my requirement.
stickerView.limitImageViewToSuperView()
When you render the text on UIImageView whose content mode is AspectFit, it is possible you will get some unwanted border. This function will scale UIImageView to fit the image.
|Key |
JLStickerImageViewProperty | value Type | | ------------------------- | ------------------------------ | ------------- | |
Font|
.fontName|
String| |
Alignment|
.textAlignment|
NSTextAlignment| |
Alpha|
.textAlpha|
CGFloat| |
textColor|
.textColor|
UIColor| |
lineSpacing|
.lineSpacing|
CGFloat| |
TextShadow|
.textShadowOffset|
CGSize| | |
.textShadowColor|
UIColor| | |
.textShadowBlur|
CGFloat|
Any suggestion, request, pull are welcome. If you encounter any problem, feel free to create an issue.
If you want to add more text attributes:
JLAttributedTextView.swift
JLStickerImageVIew.swift
Here are some ideas:
Based on
Also inspired by