【I Love Vue 】 Day 29 爱荷华博弈任务(十) - Demo

话不多说,赶紧把我们的作品Demo 给我们 铁人学院的业主吧!!


Demo

进入主画面
https://i.imgur.com/TvJO4tT.gif
我们可以透过主画面跳到设定画面,或是直接进入测验画面。

可补强问题:
我们可以在主画面中使用一个button进入测验
当点击後跳出Dialog询问要直接进入测验或是先进行设定。

这样的设计方式会比较符合当初流程图上的需求。

设定画面
https://i.imgur.com/WqNBuL0.gif
设定所有游戏参数

可补强问题:
我们可以将预设的数值先带入到画面之中,这样也可以让使用者比较清楚了解目前的设定状态。
另外我们也可以将起始分数写入设定,让起始数据也能够透过设定画面进行设定。

游戏画面
https://i.imgur.com/lusEhEZ.gif
我们可以选择任意牌,牌内的面额会计算到总分上,
当剩余执行次数归零时,可以到结算画面看结果。

可补强问题:
在填写受测人员资讯的部分我们可以透过v-if或是v-show来设计,
让上半部在进入画面的时候就先显示,填写完成後则显示下面的部分,
这样可让画面比较有先後顺序的感觉。

结算
https://ithelp.ithome.com.tw/upload/images/20201013/20115941HXbsAc05oH.jpg

可补强问题:
我们可以在这边多显示测验每副牌的参数,和游戏次数。
这样会让业主操作起来更友善一些。


结语

可能有小夥伴会想问,为什麽我们不一开始就把程序功能做完整一点?
做外包或是公司都会有自己的商业考量和时间成本问题,
其实只是因为我懒惰
所以,在开发的时候通常只要把握一个原则-照着规格开发就对了。
(当然,还是有一些例外,如果说是为了流程的完整性还是可以适度地开发规格书外的功能。)

敬请期待,明日精彩大结局~


<<:  DAY28-如何与人协同工作与好好沟通-外国人篇

>>:  如何在图片和按钮上设定圆形 - 最终章

Day15 Open-Match 监控安装

Open-Match 的基础建构采用了 OpenCensus 所提供的 library,因此可暴露 ...

[2021铁人赛 Day12] General Skills 09

引言 昨天的题目学习到进位制以及「 ASCII code <-> 字元」转换, 关於 ...

补充: 建立 Todo list 画面

发现昨天的介绍中漏掉新增 Todo 的画面是怎麽来的,补充一下。 安装 React Material...

30-8 之 Presentation Layer - MVC ( Model-View-Controller )

先给个提醒,这和一般人知道的 MVC 可能不太一样,个人建议是如果你对 MVC 感到很混乱再来看看这...

【Docker图解教学】Kubernetes & Docker的分手肥皂剧

Youtube连结:https://bit.ly/2MbU9cR 前阵子在社群广为流传的议题「轰都...