小程序源代碼：給自己設(shè)計(jì)一個(gè)番茄鬧鐘，文末有代碼
星標(biāo)公眾號(hào)，方便及時(shí)閱讀新知識(shí) 推薦給朋友，和朋友一起學(xué)習(xí)知識(shí) |
大家好，我是楊數(shù)Tos！
這篇文章主要分享：給自己設(shè)計(jì)一個(gè)非常簡(jiǎn)單的工作鬧鐘，提醒自己注意勞逸結(jié)合，除了工作也要定時(shí)休息。
整個(gè)鬧鐘項(xiàng)目的代碼分為3部分，分別是：鬧鐘主頁(yè)、鬧鐘記錄、鬧鐘設(shè)置；
A. 鬧鐘主頁(yè)的功能有點(diǎn)類(lèi)似番茄鬧鐘，它由一個(gè)倒計(jì)時(shí)工具構(gòu)成，只要客戶(hù)點(diǎn)擊按鈕，就會(huì)開(kāi)始倒計(jì)時(shí)；
B. 鬧鐘記錄主要記錄了客戶(hù)每次的點(diǎn)擊操作，有點(diǎn)類(lèi)似日志；
C. 鬧鐘設(shè)置可以自定義設(shè)置一些參數(shù)，包括設(shè)置工作時(shí)長(zhǎng)、休息時(shí)長(zhǎng)、背景音樂(lè)、背景圖片。
整個(gè)鬧鐘項(xiàng)目的原理比較簡(jiǎn)單：
1、在設(shè)置頁(yè)面有兩個(gè)變量，分別是工作時(shí)長(zhǎng)與休息時(shí)長(zhǎng)，只要是主頁(yè)中啟動(dòng)了鬧鐘，都會(huì)以這兩個(gè)變量的值為準(zhǔn)，進(jìn)行倒計(jì)時(shí)；
2、只要點(diǎn)擊了一次主頁(yè)中的休息或工作按鈕，都會(huì)觸發(fā)一次記錄，將記錄值顯示在“鬧鐘記錄”這個(gè)頁(yè)面中。
注：在設(shè)置功能區(qū)這里，可以自定義背景圖片和自定義鈴聲，這里是一個(gè)點(diǎn)擊觸發(fā)操作，兩個(gè)bindtap還沒(méi)有寫(xiě)后端的js代碼，需要自己添加。
整個(gè)項(xiàng)目的代碼邏輯很簡(jiǎn)單，大多數(shù)都是CSS代碼，用來(lái)美化頁(yè)面的樣式。
總結(jié)：這就是一個(gè)倒計(jì)時(shí)工具，只要點(diǎn)擊按鈕，就會(huì)進(jìn)行倒計(jì)時(shí)；原理很簡(jiǎn)單，適合練手。
需要代碼請(qǐng)關(guān)注@楊數(shù)Tos，回【鬧鐘fq】，獲取源代碼。
本文由楊數(shù)Tos原創(chuàng)，歡迎關(guān)注，帶你一起長(zhǎng)知識(shí)。
推 薦 內(nèi) 容