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

大家好,我是YIYI,今天我要来制做体重的页面。

点哪些地方可以进到这个页面呢?

第一个是从HOMEPAGE的下排最左侧ICON进入~
https://ithelp.ithome.com.tw/upload/images/20210928/20140979aiqj5YAbUH.png
第二个是从LIST的体重进入~
https://ithelp.ithome.com.tw/upload/images/20210928/20140979MUJeGgyHW9.png

体重介面

介面设计的部分,我想在这页的右上角放一个蓝芽的ICON,用来表示装置以蓝芽连接体重机。
在蓝芽的旁边也有一个手动纪录的功能,为的就是能够让体重机不支援的使用者们可以使用这款APP。
那在数值的部分,我挑选了我认为比较有用的数据放在页面能够一目了然的位置。
包了体重、基础代谢、BMI、肌肉、身体年龄、肥胖度这几项数据。
上方还有列出理想体重、与上次相差多少公斤,能直接看最上方就了解自己和理想体重还差多少。
在初步拉完ICON後页面长这样~
https://ithelp.ithome.com.tw/upload/images/20210928/20140979bALuhdLsrK.png
在上色的时候我是了蛮多种搭配,这是我认为看起来最舒服的样式!/images/emoticon/emoticon37.gif
https://ithelp.ithome.com.tw/upload/images/20210928/2014097915gjwHcC1X.png
今天就到这边,谢谢大家的阅读/images/emoticon/emoticon29.gif


<<:  Day15:刀枪与弓箭

>>:  [Day17] 被检查惹

33岁转职者的前端笔记-DAY 22 成绩计算机练习笔记

流程 1.先观察画面,哪些值需要抓 2.抓HTML的值: a.先宣告变数,变数就是抓HTML的值,也...

5. Html&Css&Javascript(上)

介绍 html(Hypertext Markup Language)是一种标记语言,就是里面的标记有...

存取不可路由(non-routable)的网路资源-Proxy

传统网路意味着当今很少实施的网路技术,例如 10Base2、10Base5、令牌环、令牌总线等。不可...

资安学习路上-网站常见漏洞与 Injection的爱恨情仇3

资料库类型补充 1. SQL 资料库 结构化查询语言(Structured Query Langua...

[Day 5] Reactive Programming - Java 9(Publisher、Subscribers)

前言 java 9的时候新增支援Reactive Stream,所以在介绍Spring Reacto...