我新上線的小程式功能:生日備註

一方_self發表於2024-10-25

功能作用:記錄親朋好友的生日資訊、還有多少天生日、多少歲。

背景:因為記不住親人的出生日期和多少歲和還有多久生日,用記事本也只能記錄一串文字,不是特別方便,所以自己從零開發了這樣一個小功能,能幫助自己記錄親人的生日資訊。

框架:uniapp、雲開發,我的這套框架可以很方便的控制功能是否可用,以及可定義許可權和角色,角色關聯功能,角色分配給使用者,使用者可多角色,頁面引數可靈活配置。

技術難點:時間轉換,公農曆雖然有相關的第三方庫可以很方便的支援,但融入自己的專案也是有點麻煩。後端拿到的日期得設定到日期元件上,還得切換公農曆,這裡花費了一些時間。根據生日的公農曆計算還有多少天生日、倒數計時、年齡。列表監聽詳情新增、修改、刪除動態處理,如果詳情修改了那麼列表也要修改,詳情被刪除那麼列表也要被刪除。用到了js-calendar-converter這個公農曆轉換的第三方包,在雲物件中install,這樣不佔用小程式大小。以及用到了brithday-lunar這個uniapp外掛用以在介面選擇公農曆日期,外掛有些功能無法滿足的我就修改和新增了一些方法以及修復了一些bug,日期方面的處理了2-3天才能用。

功能整體實現:前端使用uniapp開發,資料庫使用雲開發儲存,資料庫為nosql,定義好表結構。整體介面就四個,分別是:分組列表、資料列表、新增、編輯。

下面開始進入實際功能演示:

頁面一進入是這樣的:

我新上線的小程式功能:生日備註

啥也沒有,我們點選右下角加號進入新增頁面:

我新上線的小程式功能:生日備註

上面依次是頭像、姓名、出生日期、分組、備註、更多資訊。

我一次講解一下各個欄位的功能:

頭像:可以隨機選擇一個或者自己拍照或者從相簿選擇一個作為頭像。

姓名:生日物件的姓名,可以是稱呼或暱稱,讓自己看到能知道是誰。

我新上線的小程式功能:生日備註

出生日期:在這裡設定生日物件的出生日期,這樣系統就知道還有多少天生日和多少歲了,可以設定農曆、公曆。

我新上線的小程式功能:生日備註

我新上線的小程式功能:生日備註

分組:可以給生日物件設定一個分組,比如家人一個組、朋友一個組:

我新上線的小程式功能:生日備註

備註:可以設定對生日物件的備註資訊,比如可以新增生日當天要買什麼禮物、什麼儀式等等。

我新上線的小程式功能:生日備註

更多資訊:可以設定更多特有的資訊,如:喜歡吃的、身高、哪一年認識的、鞋碼、手機號、身份證等等特有的資訊。

我新上線的小程式功能:生日備註

以上資訊都填好後點選提交:

此時列表自動重新整理載入出來:

我新上線的小程式功能:生日備註

備註是滾動的,點選更多資訊可以彈出剛才新增的更多資訊:

我新上線的小程式功能:生日備註

我們再新增一個朋友的生日:

我新上線的小程式功能:生日備註

我們可以點選上面的分組只顯示這一個分組下的親朋好友:

我新上線的小程式功能:生日備註

我新上線的小程式功能:生日備註

如果到了生日的當天,還會在頭像上面顯示一個動圖特效(這個圖可以在後臺更改),因為沒法上傳動圖,所以我截圖了完整的特效效果:

我新上線的小程式功能:生日備註

我新上線的小程式功能:生日備註

以上就是介面的操作了。

下面列出一下資料表的表結構:

我新上線的小程式功能:生日備註

一共10個欄位,資料庫實際儲存的資料形式:

我新上線的小程式功能:生日備註

介面樣式啥的都是自己想的,也沒有設計,大概想了怎麼放就做了。

涉及的檔案修改:

我新上線的小程式功能:生日備註

目前整體式如上的功能,大家有啥建議嗎~ 可以在評論區寫上。

使用方式:微信搜尋《一方雲知》小程式,首頁就能看到:

我新上線的小程式功能:生日備註

可能後面圖示會改動。

該功能承諾永久免費使用,大家放心使用。

這篇分享文章就到這裡啦!如果你對文章內容有疑問或想要深入討論,歡迎在評論區留言,我會盡力回答。同時,如果你覺得這篇文章對你有幫助,不妨點個贊並分享給其他同學,讓更多人受益。

想要了解更多相關知識,可以檢視我以往的文章,其中有許多精彩內容。記得關注我,獲取及時更新,我們可以一起學習、討論技術,共同進步。

感謝你的閱讀與支援,期待在未來的文章中與你再次相遇!

我的微信公眾號:【xdub】,歡迎大家訂閱,我會同步文章到公眾號上。

相關文章