30天零负担轻松学会制作APP介面及设计【DAY 12】

大家好,我是YIYI,今天我要来制作HOMEPAGE中MONTH与TODAY的切换以及右下角的加号点击後的画面。

HOMEPAGE的切换

在HOMEPAGE的设计上我打算设计三种模式,分别为TODAY、WEEK、MONTH。
之前做好的HOMEPAGE是WEEK的样式。(如下图)
https://ithelp.ithome.com.tw/upload/images/20210921/20140979peY6WRojPf.png

制作TODAY、MONTH

我利用之前做好的HOMEPAGE-WEEK为底当作TODAY、MONTH的初始图,在利用PHOTOPEA做调整。调整完後如下图。
https://ithelp.ithome.com.tw/upload/images/20210921/20140979LzP79vNy9G.pnghttps://ithelp.ithome.com.tw/upload/images/20210921/201409791LAvVuGgBl.png

制作HOMEPAGE按下右下加号键後的介面。

首先,利用前面文章说过的OVERLEY放到PLUS的介面上。
https://ithelp.ithome.com.tw/upload/images/20210921/20140979SLMWORxczi.png
并拉出图片右下方的ICON。要特别注意,要在加号上再放一个加号,因为被OVERLEY遮住的会看不清楚。
https://ithelp.ithome.com.tw/upload/images/20210921/20140979iipX6LFAY8.png

将图片汇出後,利用PHOTOPEA调色,完成後如下图。
https://ithelp.ithome.com.tw/upload/images/20210921/201409793CedoZ4rp4.png

接下来将调整好的图片放到WHIMSICAL,并拉出关联。
https://ithelp.ithome.com.tw/upload/images/20210921/20140979PQxLq1j9EJ.png
今天就到这边~/images/emoticon/emoticon42.gif
谢谢大家的阅读/images/emoticon/emoticon29.gif


<<:  Day 06 JavaScript/Rails AJAX

>>:  元件基本使用

[13th][Day9] Pointer-1

那麽 ... 要如何改动 House.price 的『值』呢? package main impor...

[Day26]C# 鸡础观念- 物件导向(oop)~ 多载(Overload)

很多便利商店都有他们的制服, 穿着一模一样的制服, 就算离开店面, 大家都还是拥有极高的辨识度, C...

我遇到的RWD网页难题

上次文章终於迎来续集 我的第一个RWD网页 这次的网页练习跟上次的网页是同系列的,不过这次可是有记起...

[Cmoney 菁英软件工程师战斗营] IOS APP 菜鸟开发笔记(3)

前言 这两天主要在研究AR套件及Google maps地图套件的定位和标记功能。AR部分原本我是使用...

Day 14 依个资隐私架构如何实作个资保护

在隐私规划上若先有个最上位的个资隐私架构来通盘考量产品服务的个资状况,无论是法规面、个资处理面、资讯...