---
# System prepended metadata

title: '期末專案:bouncing ball'

---

# 期末專案:bouncing ball
Author: 3年13班18號 陳奕安

## 介紹

使用螢幕觸控主要球，去碰觸到相同顏色的球，如果一樣就加分，不一樣的話，遊戲就會結束，且球會重新生成再隨機四個角落。

普通難度:球移動速度較慢

困難模式:球移動速度變快

超難模式:球移動速度極快，且球會變大

介紹影片:https://www.youtube.com/watch?v=3bK5VS1iYjA

## 需求分析

我想要做一款遊戲，可以操控球去碰其他球來加分，然後其他球碰到牆或其他球會反彈，遊戲結束時會記錄分數

## Use cases 使用案例 

```plantuml
@startuml
  skinparam actorStyle awesome
  :App: --> (遊戲說明)
  :App: --> (遊戲開始)
  (遊戲說明)--> (選擇難度) 
  (選擇難度)--> (參數設定) 
 
@enduml
```
## 流程圖

```flow
st=>start: 開始
op=>operation: 四個角落生成球
op2=>operation: 移動主控球
cond=>condition: 碰到同顏色的球
cond2=>operation: 遊戲結束
op3=>operation: 紀錄分數和存活時間
light=>end: 加分，碰到的球在四角隨機生成

st->op->op2->cond->cond2->op3
cond(yes)->light->op2
cond(no)->cond2

```
## UI 使用者介面

![](https://i.imgur.com/L3qKFzA.jpg)
![](https://i.imgur.com/CgwOGA9.png)
![](https://i.imgur.com/KQm0YAP.jpg)
![](https://i.imgur.com/4Wg6DVF.jpg)
![](https://i.imgur.com/kDTXfnM.jpg)


## 元件說明

水平配置:讓畫面能更美觀
垂直配置:讓畫面能更美觀
畫布:球形精靈可放置在上面
球形精靈:主控球及其他球
計時器:紀錄存活時間
標籤:顯示分數跟時間，及遊戲說明
按鈕:開始遊戲跟難度選擇，及其他介面間的切換
微型資料庫:儲存最高分數跟最佳存活時間

## 程式截圖

![](https://i.imgur.com/bR396Vi.jpg)
![](https://i.imgur.com/VkgRloR.jpg)
![](https://i.imgur.com/ntu03JN.jpg)
![](https://i.imgur.com/wUy7hK2.jpg)
![](https://i.imgur.com/gxUCzje.jpg)
![](https://i.imgur.com/isw3uq4.jpg)
![](https://i.imgur.com/es9bbFC.jpg)
![](https://i.imgur.com/sKSSkD8.jpg)
![](https://i.imgur.com/bmerQQk.jpg)
![](https://i.imgur.com/ZEWa2XO.jpg)
![](https://i.imgur.com/zatnLcs.jpg)
![](https://i.imgur.com/Tw2oTDZ.jpg)
![](https://i.imgur.com/Y6gA2sw.jpg)
![](https://i.imgur.com/VHSzSvy.jpg)
![](https://i.imgur.com/zWkxkpd.jpg)
![](https://i.imgur.com/0NZV0r4.jpg)
![](https://i.imgur.com/qLvJNYh.jpg)
![](https://i.imgur.com/ExPhOif.jpg)
![](https://i.imgur.com/oOWr4zc.jpg)
![](https://i.imgur.com/sQzcXQv.jpg)
![](https://i.imgur.com/dZSJoZf.jpg)
![](https://i.imgur.com/ExFyWXs.jpg)
![](https://i.imgur.com/L2tbpTo.jpg)
![](https://i.imgur.com/Cw3pac5.jpg)
![](https://i.imgur.com/aFCQGIs.jpg)
![](https://i.imgur.com/CFR17ir.jpg)
![](https://i.imgur.com/5LO6pJi.jpg)
![](https://i.imgur.com/4rvS8my.jpg)

## 結論及心得

透過這次製作過程，我學到很多關於清單、座標跟資料庫的用法，雖然中間遇到困難，最主要是不了解資料庫儲存資料的方法，但在反覆測試，並參考網路上的資料後，找到了解決的方法，因資料庫中只能存取文字，而最後的得分變數若需要將標籤呈現則須將CSV列轉為文字，不然標籤上會都是空白。
  
而球型精靈的碰撞也是一個很複雜的部分，因電腦中所使用的三角函數是以弧度做運算，但人一般是使用角度做計算，所以需要先將弧度轉成角度，否則碰撞後的方向會很奇怪。整體也用了副函式的方法來縮短程式的長度，讓修改上變得更方便、簡潔，這次的專題雖耗費了很多時間跟心力在上面，但也學到了很多問題的解決方法。

## 參考資料

https://www.omdte.com/app-inventor%e5%ad%b8%e7%bf%92%e8%a8%98%e9%8c%8498-%e7%90%83%e5%9e%8b%e7%b2%be%e9%9d%88%e9%81%8a%e6%88%b2-1%ef%bc%8c%e7%a2%b0%e5%88%b0%e5%90%8c%e8%89%b2%e7%90%83%e5%be%97%e5%88%86%ef%bc%8c%e9%80%9f/

https://book.whsh.tc.edu.tw/books/app-inventor-2%E6%95%99%E5%AD%B8/page/app-inventor-2%E7%B7%B4%E7%BF%92%EF%BC%9A%E5%BE%AE%E5%9E%8B%E8%B3%87%E6%96%99%E5%BA%AB%28tinydb%29