Search code examples
swiftimageuibuttonpaintcode

UIButton title + image using Paintcode app

I have a UIButton with title and image onto the right of the title. But i wanna draw the image using paintcode app rather than using image in assets. How can i do it?

Solution

  • You could either create an reusable widget based on a .xib file, which would draw everything you need, for example:

    Reusable widget (loaded from a .xib)

 _____________________________________________
| UIView                                      | 
|     ___________________________________     |
|    | Button  |  Image (from PaintCode) |    |
|    |_________|_________________________|    |
|_____________________________________________|

    ... or do everything inside PaintCode itself (the image AND the text), like:

    wiring

    ... which would result in the following:

    simulator

    You could even use @IBInspectable to set the text of the button directly in Interface Builder:

    import Foundation
import UIKit

@IBDesignable class TextButton: UIButton {

    // MARK: Properties

    // The button's text can be set in Interface Builder.
    @IBInspectable var text: String = "HelloWorld!" {
        didSet {
            setNeedsDisplay() // Forces PaintCode to redraw.
        }
    }

    override var isHighlighted: Bool {
        didSet {
            setNeedsDisplay()
        }
    }

    override var isSelected: Bool {
        didSet {
            setNeedsDisplay()
        }
    }

    override var isEnabled: Bool {
        didSet {
            setNeedsDisplay()
        }
    }

    // MARK: Lifecycle

    override func draw(_ rect: CGRect) {
        StyleKit.drawTextButton(frame: rect, buttonLabelText: text)
    }
}

    ibinspectable

    Since you are already using PaintCode, I would stick to it and do everything you could there.

    Take a look at PaintCode's documentation on using variables.

    And here's the Xcode project: https://github.com/backslash-f/paintcode-tests