30天的swift歷程-第一天

學(xué)習(xí)別人的代碼,不失為一種自我進(jìn)步和學(xué)習(xí)的方式。

第一天,實(shí)現(xiàn)一個(gè)簡單的計(jì)時(shí)功能的小APP的demo,做下自我的記錄,方便日后進(jìn)行查看;
(PS:總結(jié)很早就開始寫了,但是由于這幾天太忙就沒導(dǎo)出時(shí)間去寫)

首先我是從一個(gè)小白的角度去入手這個(gè)demo,因此講解也相對的直白些,還請大牛們見諒,謝謝各位看官了!


demo效果圖

首先,咱需要準(zhǔn)備下使用到的工具包,,布局使用的是SnapKit的布局項(xiàng)目的包,需要下載這個(gè)包到本地,git地址可以google;


導(dǎo)入的Snapkit的包

直接進(jìn)行拖拽就可以實(shí)現(xiàn)這個(gè)過程,記得要進(jìn)行拖拽的是Snapkit.xcodeproj的這個(gè)文件,

需要自己進(jìn)行導(dǎo)入相應(yīng)的依賴

好了,說到這里可以直接上代碼了,新建的工程,在ViewController.swift,里面寫入相應(yīng)的控制代碼,創(chuàng)建一個(gè)代表宏定義的文件SnapKitViewController.swift:

First:在SnapKitViewController.swift的文件中寫入以下內(nèi)容:

import UIKit
//導(dǎo)入相應(yīng)的包
import SnapKit
//進(jìn)行配置的宏定義的文件
//定義寬度和長度的宏定義變量
let SCREEN_WIDTH = UIScreen.main.bounds.size.width
let SCREEN_HEIGHT = UIScreen.main.bounds.size.height
//定義兩個(gè)顏色的變量函數(shù),用于初始化顏色變量的值
var RGBClolor:(CGFloat,CGFloat,CGFloat)->UIColor = {red,green,blue in
    return UIColor(red:red/255,green:green/255,blue:blue/255,alpha:1)
}
var RGBAColor:(CGFloat,CGFloat,CGFloat,CGFloat)->UIColor = { red,green,blue,alpha in
    return UIColor(red:red/255,green:green/255,blue:blue/255,alpha:alpha)
}

Second:編寫ViewController.swift的內(nèi)容:
此文件的內(nèi)容總結(jié)如下,稍后我會分塊講解。

import UIKit

//引入第三方庫作為相應(yīng)的,SnapKit的布局框架

//import SnapKit

class ViewController: UIViewController,alertpickdeleget{
    

    
    //添加與相應(yīng)的空間關(guān)聯(lián)的變量,lazy(懶加載)方式,就是用到的時(shí)候在進(jìn)行加載,懶加載必須使用的是var,因此需要使用()
    
    //定義相應(yīng)的控件和相應(yīng)的time指標(biāo)
    lazy var topBox = UIView()
    lazy var bottomLeft = UIView()
    lazy var bottomRight = UIView()
    lazy var resetBtn = UIButton()
    lazy var startBtn = UIButton()
    lazy var pauseBtn = UIButton()
    lazy var numberLabel = UILabel()
    
    var time:Timer!
 
    //進(jìn)行展示的view

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        
        /*在展示函數(shù)里面寫展示的部分的代碼
         1.添加相應(yīng)的view和button放到主頁面上進(jìn)行回掉的過程
         2.添加相應(yīng)的背景作為顯示的控件的背景元素,采用的是宏定義中的相應(yīng)函數(shù)進(jìn)行的定義
         3.采用的是snapkit的自動布局的框架進(jìn)行的布局操作,因此可以進(jìn)行相應(yīng)的過程
        */
        self.view.addSubview(self.topBox)
        self.view.addSubview(self.bottomLeft)
        self.view.addSubview(self.bottomRight)
        
        topBox.backgroundColor = RGBClolor(8,1,34)
        bottomRight.backgroundColor = RGBClolor(82,91,252)
        bottomLeft.backgroundColor = RGBClolor(102,189,9)
        
        topBox.snp.makeConstraints{(make) in
            make.width.equalTo(SCREEN_WIDTH)
            make.height.equalTo(SCREEN_HEIGHT*0.4)
            make.left.equalTo(self.view).offset(0)  //offset設(shè)置偏移量
            make.top.equalTo(self.view).offset(0)
        }
        resetBtn.setTitle("重置", for: .normal) //設(shè)置重置按鈕的標(biāo)題
        resetBtn.setTitleColor(RGBClolor(255,255,255), for: .normal)
        //增加執(zhí)行的函數(shù)
        resetBtn.addTarget(self, action: #selector(resert), for: .touchUpInside)
        topBox.addSubview(resetBtn)
        
        //-----------------------------------
        
        //設(shè)定相應(yīng)的格式,產(chǎn)生相應(yīng)的顯顯示字體的過程
        numberLabel.text = "0.0"
        numberLabel.font = UIFont.boldSystemFont(ofSize: 100)
        numberLabel.textColor = UIColor.white
        numberLabel.textAlignment = .center
        topBox.addSubview(self.numberLabel)
        
        //設(shè)定布局格式,定義控件的位置
        numberLabel.snp.makeConstraints{(make) in
            make.center.equalTo(topBox) //相對的布局方式進(jìn)行布局的過程
            make.width.equalTo(topBox)
            make.height.equalTo(100)
        }
        
        //-----------------------------------
        
        //設(shè)定resertBtn的布局格式
        resetBtn.snp.makeConstraints{(make) in
            make.width.equalTo(20)
            make.top.equalTo(self.topBox).offset(20)
            make.height.equalTo(20)
            make.right.equalTo(self.topBox.snp.right).offset(-20)
        }
        
        //-----------------------------------
        //設(shè)定bottomleft的布局格式,是view的區(qū)域顯示的是一個(gè)區(qū)域的相關(guān)的布局
        bottomLeft.snp.makeConstraints{(make) in
            make.width.equalTo(SCREEN_WIDTH*0.5)
            make.top.equalTo(self.topBox.snp.bottom).offset(0)
            make.left.equalTo(self.view)
            make.bottom.equalTo(self.view)
        }
        
        //設(shè)置前端顯示的開始的按鈕的部分
        startBtn.setTitle("開始", for: .normal)
        startBtn.setTitleColor(UIColor.white, for: .normal)
        startBtn.addTarget(self, action: #selector(start), for: .touchUpInside)
        bottomLeft.addSubview(startBtn)
        
        //-----------------------------------
        //設(shè)定start的布局格式
        startBtn.snp.makeConstraints{(make) in
            make.width.equalTo(bottomLeft)
            make.height.equalTo(bottomLeft)
            make.left.equalTo(bottomLeft).offset(0)
            make.top.equalTo(bottomLeft).offset(0)
        }
        //-----------------------------------
        //處理bootomright的布局部分
        bottomRight.snp.makeConstraints{(make) in
            make.left.equalTo(bottomLeft.snp.right).offset(0)
            make.width.equalTo(bottomLeft)
            make.height.equalTo(bottomLeft)
            make.top.equalTo(topBox.snp.bottom).offset(0)
        }
        
        //暫停按鈕的使用
        pauseBtn.setTitle("暫停", for: .normal)
        pauseBtn.setTitleColor(UIColor.white, for: .normal)
        pauseBtn.isUserInteractionEnabled = true
        pauseBtn.addTarget(self, action: #selector(pause), for: .touchUpInside)
        bottomRight.addSubview(pauseBtn)
        
        pauseBtn.snp.makeConstraints{(make) in
            make.width.equalTo(bottomRight)
            make.height.equalTo(bottomRight)
            make.left.equalTo(bottomRight).offset(0)
            make.top.equalTo(bottomRight).offset(0)
        }
            
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
    //清零的點(diǎn)擊事件
    func resert(){
        //按鈕標(biāo)簽都是可用的,時(shí)間控件清零,初始化相應(yīng)的控件得到相應(yīng)的初始化信息
        self.startBtn.isUserInteractionEnabled = true
        self.pauseBtn.isUserInteractionEnabled = true
        self.numberLabel.text = "0.0"
        self.time.invalidate()
    }
    //開始按鈕按下之后執(zhí)行的動作
    func start() {
        //首先把按鈕制成可用的狀態(tài)
        startBtn.isUserInteractionEnabled = false
        pauseBtn.isUserInteractionEnabled = true
        //開始按鈕使用之后,啟動定時(shí)器操作的過程,開始進(jìn)行計(jì)時(shí)的操作
        
        self.time = Timer.scheduledTimer(timeInterval: 0.1, target: self, selector: #selector(numberChange), userInfo: self, repeats: true)
        self.time.fire()
    }
    func numberChange()  {
        //顯示相應(yīng)的數(shù)字,并以0.1的頻率進(jìn)行增加
        let number = NSString(string: numberLabel.text!).doubleValue//轉(zhuǎn)換成double類型的數(shù)字進(jìn)行顯示
        let changeNumber = number+0.1
        numberLabel.text = "\(changeNumber)" //顯示相應(yīng)的字符串信息到界面
        
    }
    func pause() {
        //暫停按鈕的動作
        
        //self.time.invalidate()
        if(startBtn.isUserInteractionEnabled == false){
            //點(diǎn)擊相應(yīng)的部分彈出提示框
            pauseBtn.isUserInteractionEnabled = false
            startBtn.isUserInteractionEnabled = true
            self.time.invalidate()
            
        }
        if(startBtn.isUserInteractionEnabled == true && pauseBtn.isUserInteractionEnabled == true){
            //定義相關(guān)的操作,變成一個(gè)提示框
            /*let alertcanel = AlertViewController()
            alertcanel.deleget = self
            self.present(alertcanel, animated: true, completion: {()->Void in})*/
            //pauseBtn.isUserInteractionEnabled = false
            
            let alertController = UIAlertController(title: "取消", message: "取消按鈕", preferredStyle: .actionSheet)
            
            let cancelAction = UIAlertAction(title: "取消", style: .cancel, handler: nil)
            
            alertController.addAction(cancelAction)
            self.present(alertController, animated: true, completion: nil)
        }
        
    }
    func alertchangefun(image:UIImage) {
        //實(shí)現(xiàn)相依協(xié)議中的方法
        //self.time.invalidate()
    }

}

代碼講解:
第一部分如下:

//添加與相應(yīng)的空間關(guān)聯(lián)的變量,lazy(懶加載)方式,就是用到的時(shí)候在進(jìn)行加載,懶加載必須使用的是var,是有閉包的形式,因此需要使用()
    
    //定義相應(yīng)的控件和相應(yīng)的time指標(biāo)
    lazy var topBox = UIView()
    lazy var bottomLeft = UIView()
    lazy var bottomRight = UIView()
    lazy var resetBtn = UIButton()
    lazy var startBtn = UIButton()
    lazy var pauseBtn = UIButton()
    lazy var numberLabel = UILabel()
    
    var time:Timer!

此處聲明相應(yīng)使用的變量,因?yàn)槭褂昧薙napkit的布局框架,因此前端的布局都是采用的代碼的形式進(jìn)行的編輯。整體的布局需要一個(gè)顯示時(shí)間的

整個(gè)頁面的布局說明

time的變量負(fù)責(zé)的是進(jìn)行計(jì)時(shí)的操作,邏輯上使用的變量。

第二部分如下:
在viewDidLoad的函數(shù)中進(jìn)行操作,首先執(zhí)行:

self.view.addSubview(self.topBox)
self.view.addSubview(self.bottomLeft)
self.view.addSubview(self.bottomRight)

topBox.backgroundColor = RGBClolor(8,1,34)
bottomRight.backgroundColor = RGBClolor(82,91,252)
bottomLeft.backgroundColor = RGBClolor(102,189,9)

執(zhí)行這個(gè)的過程是對使用SnapKit的框架進(jìn)行操作的前提,首先把相應(yīng)的view控件加入到最底層的控件中,是為了進(jìn)行布局的操作!

之后對topBox進(jìn)行布局進(jìn)行相應(yīng)的snap的過程設(shè)置:

topBox.snp.makeConstraints{(make) in
            make.width.equalTo(SCREEN_WIDTH)
            make.height.equalTo(SCREEN_HEIGHT*0.4)
            make.left.equalTo(self.view).offset(0)  //offset設(shè)置偏移量
            make.top.equalTo(self.view).offset(0)
        }

通過snap對topbox進(jìn)行相應(yīng)的設(shè)置

resetBtn.setTitle("重置", for: .normal) //設(shè)置重置按鈕的標(biāo)題
resetBtn.setTitleColor(RGBClolor(255,255,255), for: .normal)
//增加執(zhí)行的函數(shù)
 resetBtn.addTarget(self, action: #selector(resert), for: .touchUpInside)
topBox.addSubview(resetBtn)

設(shè)置重置按鈕,通過addTarget函數(shù)進(jìn)行,通過函數(shù)resert進(jìn)行邏輯上的操作,介紹相應(yīng)的函數(shù):

//清零的點(diǎn)擊事件
    func resert(){
        //按鈕標(biāo)簽都是可用的,時(shí)間控件清零,初始化相應(yīng)的控件得到相應(yīng)的初始化信息
        self.startBtn.isUserInteractionEnabled = true
        self.pauseBtn.isUserInteractionEnabled = true
        self.numberLabel.text = "0.0"
        self.time.invalidate()
    }

self.time.invalidate()是設(shè)置相應(yīng)的初始化函數(shù)
之后通過addASubview的函數(shù)把這個(gè)控件加入到它需要依附的控件;

后面的代碼核心和上述的部分類似,只要注意就行;
(PS:好了,不多說了,已經(jīng)半夜12點(diǎn)多了,改洗洗睡了,好開始一天的工作,自己加油吧,多努力,一點(diǎn)一滴的努力才會讓自己長大!?。。?/p>

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 發(fā)現(xiàn) 關(guān)注 消息 iOS 第三方庫、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關(guān)注 2017.06.26 09:4...
    肇東周閱讀 15,228評論 4 61
  • 2017.10.28晴,降溫 10.28 今天幼兒園親子活動,海陸空,地址選在了金山學(xué)校,正好今天是陰雨后的第一個(gè)...
    灸灸微笑閱讀 273評論 0 0
  • 麗城開了一家小酒館,叫“講故事酒館”。 酒館很小,藏在一條曲徑幽深的胡同里。 有那么一天,有個(gè)女人走過這個(gè)酒館,佇...
    雅雅走走閱讀 2,141評論 0 4
  • http://www.xmhouse.pro/appRef/redirect.html?taskId=393&us...
    unique肖肖閱讀 226評論 0 0
  • 鬼畫胡子閱讀 187評論 0 1

友情鏈接更多精彩內(nèi)容