devxoul/SwiftyImage

🎨 Generate image resources in Swift

Swift

1,080

110 commits

updated Feb 17, 2022

See the code

README

SwiftyImage

Swift CocoaPods CI

The most sexy way to use images in Swift.

Features

At a Glance

Creating Images
UIImage.size(width: 100, height: 100)
  .color(.white)
  .border(color: .red)
  .border(width: 10)
  .corner(radius: 20)
  .image

sample1

UIImage.resizable()
  .color(.white)
  .border(color: .blue)
  .border(width: 5)
  .corner(radius: 10)
  .image

sample2

Creating Color Overlayed Image
let image = UIImage(named: "myArrow").with(color: UIColor.blueColor())

Getting Started

SwiftyImage provides a simple way to create images with method chaining.

Step 1. Start Chaining

Method chaining starts from UIImage.size() or UIImage.resizable().

UIImage.size(width: CGFloat, height: CGFloat) // ...
UIImage.size(size: CGSize) // ...
UIImage.resizable() // ...

Step 2. Setting Properties

You can set fill color, border attributes, corner radius, etc.

UIImage.size(width: 100, height: 100)  // fixed size
  .color(.white)                       // fill color
  .border(color: .red)                 // border color
  .border(width: 10)                   // border width
  .corner(radius: 20)                  // corner radius
UIImage.resizable() // resizable image
  .color(.white)
  .border(color: .lightGray)
  .border(width: 1)
  .corner(radius: 5)

Step 3. Generating Image

Use .image at the end of method chaining to generate image.

imageView.image = UIImage.size(width: 100, height: 100)
  .color(.white)
  .border(color: .red)
  .border(width: 10)
  .corner(radius: 20)
  .image  // generate UIImage

Methods Available

Starting Method Chaining

  • .size(width: CGFloat, height: CGFloat)

    Starts chaining for fixed size image

  • .size(CGSize)

    Starts chaining for fixed size image

  • .resizable()

    Starts chaining for resizable image

Setting Properties

  • .color(UIColor)

    Sets fill color

  • .color(gradient: [UIColor], locations: [CGFloat], from: CGPoint, to: CGPoint)

    Sets gradient fill color

    New in version 1.1.0

  • .border(width: CGFloat)

    Sets border width

  • .border(color: UIColor)

    Sets border color

  • .border(gradient: [UIColor], locations: [CGFloat], from: CGPoint, to: CGPoint)

    Sets gradient border color

    New in version 1.1.0

  • .border(alignment: BorderAlignment)

    Sets border alignment. Same with Photoshop's

    available values: .inside, .center, .outside

  • .corner(radius: CGFloat)

    Sets all corners radius of image

  • .corner(topLeft: CGFloat)

    Sets top left corner radius of image

  • .corner(topRight: CGFloat)

    Sets top right corner radius of image

  • .corner(bottomLeft: CGFloat)

    Sets bottom left corner radius of image

  • .corner(bottomRight: CGFloat)

    Sets bottom right corner radius of image

Generating Image

  • .image

    Generates and returns image

Play with CGContext

SwiftyImage also provides a simple method to create or manipulate images with CGContext.

Creating Images

let image = UIImage.with(size: CGSize(width: 100, height: 100)) { context in
  UIColor.lightGrayColor().setFill()
  CGContextFillEllipseInRect(context, CGRect(x: 0, y: 0, width: 100, height: 100))
}

Manipulating Images

let newImage = oldImage.with { context in
  UIColor.lightGrayColor().setFill()
  CGContextFillEllipseInRect(context, CGRect(x: 0, y: 0, width: 100, height: 100))
}

Image Operator

You can easily combine multiple images with + operator.

let backgroundImage = ...
let iconImage = ...
let combinedImage = backgroundImage + iconImage

combine

Installation

pod 'SwiftyImage', '~> 1.1'

Playground

Use CocoaPods command $ pod try SwiftyImage to try Playground!

playground

License

SwiftyImage is under MIT license. See the LICENSE file for more info.

image
swift

devxoul/SwiftyImage

🎨 Generate image resources in Swift

Swift

1,080

110 commits

updated Feb 17, 2022

See the code

README

SwiftyImage

Swift CocoaPods CI

The most sexy way to use images in Swift.

Features

At a Glance

Creating Images
UIImage.size(width: 100, height: 100)
  .color(.white)
  .border(color: .red)
  .border(width: 10)
  .corner(radius: 20)
  .image

sample1

UIImage.resizable()
  .color(.white)
  .border(color: .blue)
  .border(width: 5)
  .corner(radius: 10)
  .image

sample2

Creating Color Overlayed Image
let image = UIImage(named: "myArrow").with(color: UIColor.blueColor())

Getting Started

SwiftyImage provides a simple way to create images with method chaining.

Step 1. Start Chaining

Method chaining starts from UIImage.size() or UIImage.resizable().

UIImage.size(width: CGFloat, height: CGFloat) // ...
UIImage.size(size: CGSize) // ...
UIImage.resizable() // ...

Step 2. Setting Properties

You can set fill color, border attributes, corner radius, etc.

UIImage.size(width: 100, height: 100)  // fixed size
  .color(.white)                       // fill color
  .border(color: .red)                 // border color
  .border(width: 10)                   // border width
  .corner(radius: 20)                  // corner radius
UIImage.resizable() // resizable image
  .color(.white)
  .border(color: .lightGray)
  .border(width: 1)
  .corner(radius: 5)

Step 3. Generating Image

Use .image at the end of method chaining to generate image.

imageView.image = UIImage.size(width: 100, height: 100)
  .color(.white)
  .border(color: .red)
  .border(width: 10)
  .corner(radius: 20)
  .image  // generate UIImage

Methods Available

Starting Method Chaining

  • .size(width: CGFloat, height: CGFloat)

    Starts chaining for fixed size image

  • .size(CGSize)

    Starts chaining for fixed size image

  • .resizable()

    Starts chaining for resizable image

Setting Properties

  • .color(UIColor)

    Sets fill color

  • .color(gradient: [UIColor], locations: [CGFloat], from: CGPoint, to: CGPoint)

    Sets gradient fill color

    New in version 1.1.0

  • .border(width: CGFloat)

    Sets border width

  • .border(color: UIColor)

    Sets border color

  • .border(gradient: [UIColor], locations: [CGFloat], from: CGPoint, to: CGPoint)

    Sets gradient border color

    New in version 1.1.0

  • .border(alignment: BorderAlignment)

    Sets border alignment. Same with Photoshop's

    available values: .inside, .center, .outside

  • .corner(radius: CGFloat)

    Sets all corners radius of image

  • .corner(topLeft: CGFloat)

    Sets top left corner radius of image

  • .corner(topRight: CGFloat)

    Sets top right corner radius of image

  • .corner(bottomLeft: CGFloat)

    Sets bottom left corner radius of image

  • .corner(bottomRight: CGFloat)

    Sets bottom right corner radius of image

Generating Image

  • .image

    Generates and returns image

Play with CGContext

SwiftyImage also provides a simple method to create or manipulate images with CGContext.

Creating Images

let image = UIImage.with(size: CGSize(width: 100, height: 100)) { context in
  UIColor.lightGrayColor().setFill()
  CGContextFillEllipseInRect(context, CGRect(x: 0, y: 0, width: 100, height: 100))
}

Manipulating Images

let newImage = oldImage.with { context in
  UIColor.lightGrayColor().setFill()
  CGContextFillEllipseInRect(context, CGRect(x: 0, y: 0, width: 100, height: 100))
}

Image Operator

You can easily combine multiple images with + operator.

let backgroundImage = ...
let iconImage = ...
let combinedImage = backgroundImage + iconImage

combine

Installation

pod 'SwiftyImage', '~> 1.1'

Playground

Use CocoaPods command $ pod try SwiftyImage to try Playground!

playground

License

SwiftyImage is under MIT license. See the LICENSE file for more info.

image
swift

Significant stargazers

Alex Zielenski

998 followers · starred May 2017

Dmytro

761 followers · starred Apr 2017

Wooseong Kim

132 followers · starred Jun 2017

Julius Lundang

25 followers · starred Apr 2017