How to highlight a custom UIButton that has no tex

问题:

I am trying to make a custom UIButton because I want to draw my own vector button icons instead of relying on text characters or bitmap images.

So... I tried this:

import UIKit

@IBDesignable
class CustomPlusButton: UIButton {

/*
// Only override draw() if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
override func draw(_ rect: CGRect) {
    // Drawing code
}
*/


func myPlusSign() -> UIBezierPath {

    //vars to factor out later
    let G = bounds.width / 5

    let plusPath = UIBezierPath()


    let startPoint = CGPoint(x:2*G,y:G)

    plusPath.move(to: startPoint)
    plusPath.addLine(to: CGPoint(x:2*G,y:2*G))
    plusPath.addLine(to: CGPoint(x:G,y:2*G))
    plusPath.addLine(to: CGPoint(x:G,y:3*G))
    plusPath.addLine(to: CGPoint(x:2*G,y:3*G))
    plusPath.addLine(to: CGPoint(x:2*G,y:4*G))
    plusPath.addLine(to: CGPoint(x:3*G,y:4*G))
    plusPath.addLine(to: CGPoint(x:3*G,y:3*G))
    plusPath.addLine(to: CGPoint(x:4*G,y:3*G))
    plusPath.addLine(to: CGPoint(x:4*G,y:2*G))
    plusPath.addLine(to: CGPoint(x:3*G,y:2*G))
    plusPath.addLine(to: CGPoint(x:3*G,y:G))
    plusPath.addLine(to: startPoint)

    plusPath.close()

    plusPath.fill()

    return plusPath



}

override func draw(_ rect: CGRect) {

    let path = myPlusSign()

    path.stroke()

}
}

I dragged a Button instance into the storyboard and changed it's type to my custom class.

In the storyboard, and when I run the app, it looks great as far as how the vector looks and how it fits into the button space, but it doesn't highlight when touched the way a normal button does.

As I understand it, normally you would use the "State config" section of the attributes inspector to control the behavior when highlighted, but it only allows control of text color, shadow color, image, or background.

My custom icon is none of these things... so how can I refer to it? What is the output of draw(_ rect) referred to as and how can I highlight it?

EDIT: I would also like it to fade back to normal state like a normal button does so hopefully there is some way to incorporate/reuse the highlight behavior of a normal button without fully overriding it?

Thank you!

回答1:

For a possible solution, you can modify the alpha of the button in the didSet of your button's overridden isHighlighted.

override var isHighlighted: Bool {
    didSet {
        alpha = isHighlighted ? 0.7 : 1
    }
}