2020-11-21|閱讀時間 ‧ 約 3 分鐘

各種相互連動的時光機!!

    目的:

    1 使用 date picker & slider 做時間的魔法師,顯示自己十年的變化成長。

    2 date picker 設定最小 & 最大時間,讓時間的範圍為 2009 ~ 2019。

    3 滑動 slider 時,slider 會停在整數的位置,比方滑到 2010.6 時會四捨五入到 2011。

    4 slider & picker 要連動,比方 slider 滑到 2018,picker 也要顯示 2018。

    5 一年一張照片。如果照片很多的,也可以用月和日為單位,比方一年 365 天,天天換照片。

    6 時間自動快轉的照片輪播功能。

    這次所做的project相比之前更為完整但也更複雜許多。

    第一個要注意的點是當我們從Storyboard的介面中的slider和datepicker各拉一個IBAction過來時,我們的sender要設定為當使用者觸控的動作會造成的影響,這裡可以參考使用Storyboard各個元件屬性欄位的內容設定。

    第二個也是我覺得目前來說最複雜的部分,為datepicker的內容與其延伸相關內容。

    首先是要先定義一個實例:

    var dateComponents = DateComponents()

    此實例以我的了解是可以建立一個具有所有時間相關單位的實例,如年、月、日、時、分、秒等等…。

    dateComponents.calendar = Calendar.current

    上面的設定calendar則是讓使用者能夠進行比較或計算的功能,而current讓使用者設定初始值的概念。

    因此我們也能在第二部分:

    dateComponents = Calendar.current.dateComponents(in: TimeZone.current, from: datepicker.date)

    利用datepicker.date額外設定日期為使用者選訂的時間以及保持目前的時區設定去進行更新。

    這次下來最耗費我時間的主要是:

    因為在設定自動播放中每張照片的等待時間的function讓我一直不太能了解,後來整理好後如下:

    timer = Timer.scheduledTimer(timeInterval: 1, target: self, selector: #selector(runimage), userInfo: nil, repeats: true)

    1. timeInterval: 等待時間。
    2. target:所要等待的目標,通常設定為self。
    3. (最重要)selector:要執行的目標函數,也就是我們要讓哪個功能重複等待執行。
    4. userInfo:使用者資料,設為nil。
    5. repeats:需不需要重複。
    分享至
    成為作者繼續創作的動力吧!
    © 2024 vocus All rights reserved.