textcat / jlstickertextview Goto Github PK

add text(multiple line support) to imageView, edit, rotate or resize them as you want, then render the text on image

License: MIT License

Swift 81.24% Ruby 1.09% Shell 0.69% Makefile 16.97%

jlstickertextview's Introduction

About

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.

Features

You can add multiple Text to StickerTextView at the same time
Multiple line Text support
Rotate, resize the text with one finger
Set the Color, alpha, font, alignment, TextShadow, lineSpacing...... of the text
StickerTextView also handle the process of rendering text on Image
Written in Swift

Installation

Manually

Just drag the Source files into your project(To get the latest version, please install manually)

CocoaPods

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:

use_frameworks!
pod "JLStickerTextView", :git =>
"https://github.com/Textcat/JLStickerTextView.git"

Usage

Start

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 JLStikcerImageView Class in Identity Inspector.

Add new Label

It is quite easy to add new label to current StickerImageView:

stickerView.addLabel()

Set the Label

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.

Render Text on Image

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 the StickerTextView appearance

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: closeView and rotateView are both UIimageView, while border is CAShapeLayer

Scale stickerView proportionally

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.

Avaliable Text Attributes Reference(Let's add more 😉)

Key	`JLStickerImageView` Property	value Type
`Font`	`.fontName`	`String`
`Alignment`	`.textAlignment`	`NSTextAlignment`
`Alpha`	`.textAlpha`	`CGFloat`
`textColor`	`.textColor`	`UIColor`
`lineSpacing`	`.lineSpacing`	`CGFloat`
`TextShadow`	`.textShadowOffset`	`CGSize`
	`.textShadowColor`	`UIColor`
	`.textShadowBlur`	`CGFloat`

Contributon

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:

Please fork this project
Define the attribute you want in JLAttributedTextView.swift
implement user interface in JLStickerImageVIew.swift
Write appropriate docs and comments in the README.md
Submit a pull request

Plan

Here are some ideas:

More options for text(eg: lineSpacing)
Interface to customize the appearance of StickerLabelView(close Button, rotate button, border,etc)
More general solution for Scaling stickerView proportionally
Support placeholder

Reference

Based on

IQLabelView

Also inspired by

jlstickertextview's People

Contributors

Stargazers

Watchers

jlstickertextview's Issues

customization

write text and when it reaches width equal to device width then it expands its height rather than width? how can i do that?

Add text on UIView instead of UIImage

Hey , I want to use this text feature in UIView instead of UIView. How can i achieve this?
Please Help!

is it possible to change font style of text?

It takes more time when add sticker at first time.

After first time, the performance is much better. But it takes longer time when add sticker at first time. Any idea on this?

this can add Bubble text to the image?

this can add Bubble text to the image? and the Bubble can rotate, resize with one finger.

that the Bubble's arrow can stretch and rotate with one finger.

the look like this:

http://v.youku.com/v_show/id_XMTQ5OTE4Mjc4NA==.html?from=y1.7-1.2#paction

Emoji Cursor Issue

When I add and emoji in the text and the press space or backspace in the middle of text the cursor jumps to the end of textview.

Swift Support

I am able to run the example but, while adding it in my swift project using pod it is giving me below error when I imported JLStickerTextView.

Could not build Objective-C module 'JLStickerTextView'

Can you please suggest how I can use this in my project?

Label is cut after present viewcontroller

After presenting or pushing a viewcontroller the JLStickerLabelView is cut and the stroke seems strange.

Please see the link with a screenshot https://imagebin.ca/v/2y99hj7oA512

Video Editing

Hi @luiyezheng great tutorial many useful, how to change - - - - - border line,

i want to develop a same to same as on video editing any idea how to do that as a multiple sticker with bubble add a different different timeline ?

Compile time error

Hello, @luiyezheng I have just installed a pods and i got Lots of Errors Please Check it in Image.

Please Help What i need to do !
Thanks :)

When text is selected everything becomes white

When I select a text inside the JLAttributedTextView, everything becomes white.

Normally it looks like this

But after selecting the texts, it becomes like this

Editing Time cursor issue

There is something wrong when I want to write something in textview from the middle position cursor goes at the end of the text.
Please resolve this issue ASAP.

Failed to compile and run the example

I tried to compile and run the example. I followed both approach (the manual and the Pod) both were unsuccessful.

For the Pod attempt, I couldn't pass the error againest import JLStickerTextView, the error is : Cannot load underlying module for 'JLStickerTextView'. I'm using Xcode version 7.3 and used the Example.xcworkspace file. I cleaned and ran again but no luck. My Pod version is the latest and was able to include other pods like SwiftyJSON.

I even downloaded the Xcode 8 beta 6 to try it, and it was worst because it seems the code is not yet upgraded to swift 3.0

I'm happy to try anything you may suggest and I'm so greatful for your help

Seems to be poorly formatted and no longer maintained

First of all, really thanks for your repo to provide me some nice initial ideas on creating my own stickerView.

I just wonder if the owner is still maintaining this repo. If not, I'd someday post my solution here for convenience.

provide swift 2.3

not all of us use xcode 8 as it has some issues can you provide swift 2.3 branch

Build Time Error

I am trying to run this project but i got Following Errors.

Is it possible to pass some text to JLStickerImageView

As the title says, is it possible to pass some text to the JLStickerImageView?
I am using swift 3 and it seems it s not possible, i spent some time trying to figure how to do that. I am surprised, as this would have been really nice.
The stickerImageView has just addLabel method, which has no init and i cannot pass any text to it.
Is tapping on the JLStickerLabelView the only way to edit text?
Thanks for your response =)

ps, this lib looks nice, hope it s possible to solve this issue

how can i set width constraint whenever i add text it goes outside the screen but i want to convert my text in multiple line
when i rotate or increase size of view it goes outside of parent view how we can manage to limit it to it's parent

customizaton

A close button would be nice. Awesome stuff by the way. Keep up the good work! :))

Question: If the sticker bubble/text is not selected when I tap the text color button, the app crashes. How do I setup auto-selection? :O

Issue: failed on runtime

I tried to run . I followed both approach (the manual and the Pod) both were unsuccessful.

I use Xcode 8 and swift 3.

i got error in limitImageViewToSuperView() function about image height , width condition failure

this is Issue i found in stickerImageView.swift

public func limitImageViewToSuperView() {
        if self.superview == nil {
            return
        }
        self.translatesAutoresizingMaskIntoConstraints = true
        let imageSize = self.image?.size
        let aspectRatio = imageSize!.width / imageSize!.height // here i got error because of imageSize is nil
        if Float((imageSize?.width)!) > Float((imageSize?.height)!) {
            self.bounds.size.width = self.superview!.bounds.size.width
            self.bounds.size.height = self.superview!.bounds.size.width / aspectRatio
        }else {
            self.bounds.size.height = self.superview!.bounds.size.height
            self.bounds.size.width = self.superview!.bounds.size.height * aspectRatio
        }
    }

add image to stickerview?

Hey is it possible to add an image/imageview to the sticker imageview?