DAY 4 『 RGB调色盘 - TextFieldDelegate、@IBAction 』Part3

RGB调色盘:view + slider * 3 + textfield * 3

昨天介绍了每个物件的功能!
今天主要讲解:

  1. TextFieldDelegate 如何写出 textField 的输入限制
  2. @IBAction 与 storyboard 的拉线

除了讲解程序码之外,还会附上截图以供参考。


  1. 在 Class 函数外,写 extension ViewController : UITextFieldDelegate(里面写判断字串长度的函数)
extension ViewController : UITextFieldDelegate {
    //新的字串可判断字串长度,决定是否可以输入。回传 true 允许文字输入,回传 false 让文字不能输入。
    func textField(_ textField: UITextField, shouldChangeCharactersIn range: NSRange, replacementString string: String) -> Bool {
       var result = false
       if let text = textField.text, let range = Range(range, in: text) {
           let newText = text.replacingCharacters(in: range, with: string)
           // 判断只能输入3位数
           if newText.count < 4 {
              result = true
           }
       }
       return result
    }
}

  1. 在 storyboard 拉线到对应的 @IBAction
    textField:
    textField

    slider:
    slider

    delegate:
    delegate

附上RGB调色盘完整程序码

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var showcolor: UIView!
    @IBOutlet weak var redtext: UITextField!
    @IBOutlet weak var greentext: UITextField!
    @IBOutlet weak var bluetext: UITextField!
    @IBOutlet weak var redslider: UISlider!
    @IBOutlet weak var greenslider: UISlider!
    @IBOutlet weak var blueslider: UISlider!
    
    override func viewDidLoad() {
        super.viewDidLoad()

        let tap: UITapGestureRecognizer = UITapGestureRecognizer(target: self, action: #selector(dismissKeyBoard))
        self.view.addGestureRecognizer(tap)
    }

    @objc func dismissKeyBoard() {
        self.view.endEditing(true)
    }
 
    @IBAction func TextFieldToSilder(textField: UITextField) {
        guard let stringColor = textField.text else {return}
        guard let intColor = Int(stringColor)else {return}
        switch textField {
        case redtext:
            redslider.setValue(Float(intColor), animated: true)
        case greentext:
            greenslider.setValue(Float(intColor), animated: true)
        case bluetext:
            blueslider.setValue(Float(intColor), animated: true)
        default: break
        }
    }

    @IBAction func SliderToTextField(_ sender: Any) {
        redtext.text = "\(Int(redslider.value))"
        greentext.text = "\(Int(greenslider.value))"
        bluetext.text = "\(Int(blueslider.value))"
    }

    @IBAction func colorchange(_ sender: Any){
        showcolor.backgroundColor = UIColor(red: CGFloat(redslider.value)/255, green: CGFloat(greenslider.value)/255, blue: CGFloat(blueslider.value)/255, alpha: 1)
    }
}

extension ViewController : UITextFieldDelegate {
    func textField(_ textField: UITextField, shouldChangeCharactersIn range: NSRange, replacementString string: String) -> Bool {
       var result = false
       if let text = textField.text, let range = Range(range, in: text) {
           let newText = text.replacingCharacters(in: range, with: string)
           if newText.count < 4 {
              result = true
           }
       }
       return result
    }
}


明天会介绍关於 storyboard 的 layout(约束)拉法,敬请期待!


<<:  Day00:Setting up Environment(环境设定)

>>:  序言 - UI/UX 与 网页设计一路走来

Day4 决策树(Decision tree)

决策树是什麽? 讲人话就是利用特徵与分类结果之间的关系,藉由历史资料建构出一棵「如果这样就那样」的树...

全端入门Day23_後端程序撰写之多一点的Node.js

昨天写了写了基本的Node.js,但还没有介绍程序码,今天就来介绍昨天的程序码。 Node.js入门...

Day13 - 使用爬虫套件撷取网页内容

接续昨天的内容,今天要实作使用爬虫技术,根据给定的小说网址,抓取其书名和作者资讯。 这次会使用两个套...

django新手村6-----HTTP Status Code

常见的 200 ok 404 找不到请求的网页 403 服务器拒绝请求 301 永久移动网页,重新导...

DAY20 - line message API 初体验

上一篇,申请好了 line message API 的频道,这一篇就来实际玩转 line mess...