Bigger touch zones for custom keyboard buttons

This commit is contained in:
Selim Mustafaev 2020-09-17 14:35:00 +03:00
parent e4085ee665
commit a6bf78affe
2 changed files with 37 additions and 18 deletions

View File

@ -15,8 +15,13 @@
}
],
"color" : {
"platform" : "ios",
"reference" : "systemGray3Color"
"color-space" : "srgb",
"components" : {
"alpha" : "1.000",
"blue" : "0.290",
"green" : "0.282",
"red" : "0.282"
}
},
"idiom" : "universal"
}

View File

@ -18,39 +18,39 @@ class PNButton: UIButton {
private(set) var type: PNButtonType
private var timer: Timer?
private var waitCount = 0
private var rectLayer = CAShapeLayer()
private var bgColor = UIColor(named: "KeyBackground")
weak var delegate: PNButtonDelegate?
init(letter: Character) {
self.type = .symbol(String(letter))
super.init(frame: .zero)
self.setup()
self.titleLabel?.font = UIFont(name: "RoadNumbers", size: 36)
let title = String(Constants.pnLettersMap[letter] ?? letter)
self.setTitle(title, for: .normal)
self.setTitleColor(.label, for: .normal)
self.backgroundColor = UIColor(named: "KeyBackground")
self.setup()
}
init(digit: Int) {
self.type = .symbol(String(digit))
super.init(frame: .zero)
self.setup()
self.titleLabel?.font = UIFont(name: "RoadNumbersCyr-Regular", size: 30)
let character = Character(String(digit))
let title = String(Constants.pnLettersMap[character] ?? character)
self.setTitle(title, for: .normal)
self.setTitleColor(.label, for: .normal)
self.backgroundColor = UIColor(named: "KeyBackground")
self.setup()
}
init(imageName: String, type: PNButtonType) {
self.type = type
self.bgColor = UIColor(named: "DarkKeyBackground")
super.init(frame: .zero)
self.setImage(UIImage(systemName: imageName), for: .normal)
self.backgroundColor = UIColor(named: "DarkKeyBackground")
self.tintColor = .label
self.setup()
self.setImage(UIImage(systemName: imageName), for: .normal)
self.tintColor = .label
}
required init?(coder: NSCoder) {
@ -58,17 +58,26 @@ class PNButton: UIButton {
}
func setup(_ radius: CGFloat = 0.5) {
self.layer.cornerRadius = 6
self.layer.shadowColor = UIColor.black.cgColor
self.layer.shadowOpacity = 0.4
self.layer.shadowOffset = CGSize(width: 0.0, height : 1.0)
self.layer.shadowRadius = radius
self.rectLayer.cornerRadius = 6
self.layer.addSublayer(self.rectLayer)
self.imageView?.layer.zPosition = 2
self.rectLayer.shadowColor = UIColor.black.cgColor
self.rectLayer.shadowOpacity = 0.4
self.rectLayer.shadowOffset = CGSize(width: 0.0, height : 1.0)
self.rectLayer.shadowRadius = radius
self.addTarget(self, action: #selector(buttonDown), for: .touchDown)
self.addTarget(self, action: #selector(buttonUp), for: [.touchUpInside, .touchUpOutside])
self.addTarget(self, action: #selector(touchUpInside), for: .touchUpInside)
}
override func layoutSubviews() {
super.layoutSubviews()
self.rectLayer.backgroundColor = self.bgColor?.cgColor
self.rectLayer.frame = self.layer.bounds.inset(by: UIEdgeInsets(top: 4, left: 4, bottom: 4, right: 4))
}
@objc func buttonDown(_ sender: PNButton) {
print("buttonDown")
sender.layer.opacity = 0.3
@ -92,6 +101,11 @@ class PNButton: UIButton {
print("touchUpInside")
self.delegate?.buttonTapped(self)
}
func setBacgroundColor(color: UIColor) {
self.bgColor = color
self.setNeedsLayout()
}
}
class PNKeyboard: UIView, UIInputViewAudioFeedback, PNButtonDelegate {
@ -130,7 +144,7 @@ class PNKeyboard: UIView, UIInputViewAudioFeedback, PNButtonDelegate {
let done = PNButton(imageName: "arrow.turn.down.left", type: .done)
done.delegate = self
done.backgroundColor = .systemBlue
done.setBacgroundColor(color: .systemBlue)
done.tintColor = .white
let letterRows = [
@ -143,7 +157,7 @@ class PNKeyboard: UIView, UIInputViewAudioFeedback, PNButtonDelegate {
let lettersStack = UIStackView(arrangedSubviews: letterRows)
lettersStack.axis = .vertical
lettersStack.distribution = .fillEqually
lettersStack.spacing = 8
//lettersStack.spacing = 8
let digitRows = [
self.createLetterStack([digits[0], digits[1], digits[2]]),
@ -155,7 +169,7 @@ class PNKeyboard: UIView, UIInputViewAudioFeedback, PNButtonDelegate {
let digitsStack = UIStackView(arrangedSubviews: digitRows)
digitsStack.axis = .vertical
digitsStack.distribution = .fillEqually
digitsStack.spacing = 8
//digitsStack.spacing = 8
let mainStack = UIStackView(arrangedSubviews: [lettersStack, digitsStack])
mainStack.spacing = 16
@ -174,7 +188,7 @@ class PNKeyboard: UIView, UIInputViewAudioFeedback, PNButtonDelegate {
func createLetterStack(_ views: [UIView]) -> UIStackView {
let stack = UIStackView(arrangedSubviews: views)
stack.distribution = .fillEqually
stack.spacing = 8
//stack.spacing = 8
return stack
}