元培科技大學 - ir.lib.ypu.edu.twir.lib.ypu.edu.tw/bitstream/310904600Q/7328/2/... · 多的資料與方向，感謝教授給予我們的指導，過程中遇到的瓶頸和疑問時，老師

元培科技大學

資訊工程系

專題結案報告

Android 評分&投票系統

Android Scoring & Voting System

姓名： 0981412072 藍妮

0981412073羅光評

0981412079黃靖超

0981412080張育瑋

0981412118蕭誌杰

指導教授：詹宏章教授

中華民國 102 年 1 月

Android評分&投票系統


學生: 藍妮 Student：Ni Lan

學生: 羅光評 Student：Guang-Ping Luo

學生: 黃靖超 Student：Jia-Sian Chen

學生: 張育瑋 Student：Yu-Wei Chang

學生: 蕭誌杰 Student：Jhii-Jie Siao

指導教授：詹宏章 Advisor：Dr. Hung-Chang Chan

元培科技大學資訊工程系

專題結案報告

A Thesis

Submitted to Department of Computer Science and

Information Engineering

College of medical science and technology in partial

Fulfillment of the Requirements

For the Degree of bachelor In

Computer Science and Information Engineering

January 2013

Hsinchu, Taiwan, Republic of China

中華民國 102 年 1 月

102 1 10

i

Android 評分與投票系統

學生: 藍妮指導老師: 詹宏章教授

羅光評

黃靖超

張育瑋

蕭誌杰

元培科技大學資訊工程系學士班專題

摘要

以往在各類比賽的即時分數登錄或票選計票，都是只用人工紙筆或在線上的

方式進行，評審仍需要依賴人工或在座位上輸入才能完成工作。近年來由於許多

人使用智慧型手機，讓許多工作因為可移動性而增加效率。本專題的評分系統是

利用 Eclipse來撰寫 Android 的 App(應用程式)後，讓評審可以在比賽過程中隨時

隨地都可使用，參賽者和主辦單位也能利用手機，隨時掌握目前比賽的狀況。評

分 App的系統設計，是在評審完成登入與評分後，將成績送至主辦單位的網頁

資料庫內。票選活動也是利用 PHP&MySQL 製作的網頁，讓每個人都能輕鬆在

手機上或在網路中完成投票。

ii


Student : Ni Lan advisors: Dr. Hung-Chang Chan

Guang-Ping Luo

Jing-Chao Huang

Yu-Wei Chang

Jhih-Jie Siao

Department of Computer Science and Information Engineering

Yuanpei University

ABSTRACT

In the past, the real-time score or polling statistics in each contests are always by

hands or in progress on internet. The reviewers still finish the work manually or

key-in in their seat statically. In recent years, most people use the smart phone, so that

the mobility makes more efficiency in many works. We implement an Android App

with coding by Eclipse in the project. Wherever or wherever, the App let the

reviewers can finish their jobs in the contest, and the contestant and the organizer can

acquire the information of the contest in real-time. After the reviewers logined in and

sent the score in the system, the grade will be save in a database on a website.

Everyone can join the vote activity, which using the PHP&MySQL website, on their

smart phone or on the internet.

iii

誌謝

首先感謝指導教授：詹宏章教授辛苦的教導，在專題製作過程中，提供相當

多的資料與方向，感謝教授給予我們的指導，過程中遇到的瓶頸和疑問時，老師

也能立刻幫我們解決以及提供我們一些書本和協助我們討論與溝通，使專題順利

進行。同時也要感謝同組組員的團結心以及彼此包容和尊重，專題讓我們學習到

團結合作的重要性。還有其他系上的老師給予寶貴的建議，讓我們此專題更加完

善。最後謝謝系上提供一個優良的品質與環境讓我們能夠專心地製作專題。

iv

目錄

摘要................................................................................................................................ I

ABSTRACT ................................................................................................................. II

誌謝............................................................................................................................. III

目錄............................................................................................................................. IV

表目錄......................................................................................................................... VI

圖目錄........................................................................................................................ VII

第一章導論 ............................................................................................................... 1

1.1 研究背景與動機 ............................................................................................... 1

1.2 研究目的 ........................................................................................................... 1

1.3 研究方法 ........................................................................................................... 2

1.4 相關軟硬體使用配合情形 ............................................................................... 3

第二章文獻探討 ....................................................................................................... 4

2.1 ANDROID介紹 ................................................................................................... 4

2.1.1 Android App 應用程式 .............................................................................. 4

2.1.2 Android 應用程式的組成 .......................................................................... 5

2.2 弘光科技大學-學生專題管理系統 ................................................................ 11

第三章研究方法 ..................................................................................................... 12

3.1 研究步驟 ......................................................................................................... 12

3.2 網站規劃 ......................................................................................................... 13

3.3 會員系統 ......................................................................................................... 14

3.3.1 會員系統分析.......................................................................................... 14

3.3.2 會員系統設計.......................................................................................... 14

3.3.3 會員系統安全性...................................................................................... 14

3.3.4 會員系統測試.......................................................................................... 15

3.4 投票系統 ......................................................................................................... 15

3.4.1 投票系統分析.......................................................................................... 15

3.4.2 投票系統設計.......................................................................................... 15

3.4.3 投票系統安全性...................................................................................... 15

3.4.4 投票系統測試.......................................................................................... 16

3.5 小組頁面 ......................................................................................................... 16

3.5.1 小組頁面分析.......................................................................................... 16

3.5.2 小組頁面設計.......................................................................................... 16

v

3.5.3 小組頁面安全性...................................................................................... 16

3.5.4 小組頁面測試.......................................................................................... 17

3.6 評分系統 ......................................................................................................... 17

3.6.1 評分系統分析.......................................................................................... 17

3.6.2 評分系統設計.......................................................................................... 17

3.6.3 評分系統安全性...................................................................................... 18

3.6.4 評分系統測試.......................................................................................... 18

老師老 3.7 E-R MODEL (實體-關係模型) ............................................................ 18

3.7.1 資料表欄位.............................................................................................. 18

3.7.2 資料表欄位設計...................................................................................... 19

3.7.3 合併查詢.................................................................................................. 20

3.8 ANDROID評分 APP .......................................................................................... 21

3.8.1 Android 系統分析 .................................................................................... 21

3.8.2 Android 系統設計 .................................................................................... 23

3.8.3 Android 系統測試 .................................................................................... 24

3.8.4 Android 資料儲存 .................................................................................... 26

3.8.5 傳送分數說明.......................................................................................... 27

第四章結果探討 ..................................................................................................... 28

4.1 期末成果說明 ................................................................................................. 28

4.1.1 期末成果-網頁 ........................................................................................ 28

4.1.2 期末成果-Android App ............................................................................ 35

4.2 結論 ................................................................................................................. 43

參考文獻...................................................................................................................... 44

附錄一 Q&A ............................................................................................................ 45

附錄二 ANDROID 程式碼 .................................................................................... 46

登入畫面的程式碼.................................................................................................. 46

選擇組別畫面的程式碼.......................................................................................... 48

進入配分畫面的程式碼.......................................................................................... 50

評分的程式碼.......................................................................................................... 53

召集人版本的查看畫面程式碼.............................................................................. 57

附錄三工作分配表 ................................................................................................. 59

附錄四甘特圖 ......................................................................................................... 60

附錄五工作進度表 ................................................................................................. 61

附錄六自傳 ............................................................................................................. 71

vi

表目錄

表 2-1 ACTIVITY的控制方法 ...................................................................................... 9

表 3-1 會員資料表 .................................................................................................... 19

表 3-2 組別資料表 .................................................................................................... 19

表 3-3 配分資料表 .................................................................................................... 20

表 3-4 評分資料表 .................................................................................................... 20

表 3-5 ANDROID_SCORINGACTIVITY.JAVA測試 ......................................................... 24

表 3-6 LOGINMAIN.JAVA測試 .................................................................................... 24

表 3-7 CATEGORY.JAVA測試 ...................................................................................... 24

表 3-8 SEEKBAR.JAVA測試......................................................................................... 25

表 3-9 F1.JAVA測試 ................................................................................................... 25

表 3-10 LOGIN.JAVA測試 ........................................................................................... 25

表 3-11 CATEGORY.JAVA測試 ..................................................................................... 26

表 3-12 LOOK1.JAVA測試 .......................................................................................... 26

表附錄一工作分配表 .............................................................................................. 59

vii

圖目錄

圖 1-1 網頁架構 .......................................................................................................... 2

圖 1-2 QR CODE ........................................................................................................... 3

圖 2-1 ANDROID版本用戶比例 .................................................................................. 4

圖 2-2 ANDROID系統架構 .......................................................................................... 5

圖 2-3 ACTIVITY機動程式 .......................................................................................... 6

圖 2-4 機動程式的生命週期 ...................................................................................... 7

圖 2-5 ANDROID作業系統工作管理流程 .................................................................. 8

圖 2-6 弘光科技大學學生專題管理系統 ................................................................ 11

圖 3-1 研究步驟 ........................................................................................................ 12

圖 3-2 網站架構 ........................................................................................................ 13

圖 3-3 E-R MODEL(實體-關係模型) ......................................................................... 18

圖 3-4 評審版流程 .................................................................................................... 22

圖 3-5 主辦單位版流程 ............................................................................................ 22

圖 3-6 評審版架構 .................................................................................................... 23

圖 3-7 主辦單位版架構 ............................................................................................ 23

圖 4-1 首頁畫面 ........................................................................................................ 28

圖 4-2 會員登入畫面 ................................................................................................ 28

圖 4-3 密碼輸入錯誤跳轉畫面 ................................................................................ 29

圖 4-4 評審首頁畫面 ................................................................................................ 29

圖 4-5 專題生首頁畫面 ............................................................................................ 30

圖 4-6 一般生首頁畫面 ............................................................................................ 30

圖 4-7 投票類別 ........................................................................................................ 31

圖 4-8 網頁投票 ........................................................................................................ 31

圖 4-9 評分類別 ........................................................................................................ 32

圖 4-10 網頁評分(輸入正確) ................................................................................... 32

圖 4-11 網頁評分(輸入錯誤).................................................................................... 33

圖 4-12 網頁配分評分錯誤 ...................................................................................... 33

圖 4-13 小組畫面 ...................................................................................................... 34

圖 4-14 上傳檔案格式錯誤 ...................................................................................... 34

圖 4-15 ANDROID主畫面 .......................................................................................... 35

圖 4-16 ANDROID登入畫面 ...................................................................................... 35

圖 4-17 ANDROID登入失敗畫面 .............................................................................. 36

圖 4-18 ANDROID登入成功畫面 .............................................................................. 36

圖 4-19 ANDROID選擇類別畫面 .............................................................................. 37

圖 4-20 ANDROID配分畫面 ...................................................................................... 37

圖 4-21 ANDROID配分錯誤畫面 .............................................................................. 38

viii

圖 4-22 ANDROID正確配分畫面 .............................................................................. 38

圖 4-23 ANDROID評分畫面 ...................................................................................... 39

圖 4-24 ANDROID計算平均畫面 .............................................................................. 39

圖 4-25 ANDROID評分錯誤畫面 .............................................................................. 40

圖 4-26 ANDROID成功傳送資料庫畫面 .................................................................. 40

圖 4-27 ANDROID主辦單位首頁畫面 ...................................................................... 41

圖 4-28 ANDROID主辦單位登入畫面 ...................................................................... 41

圖 4-29 ANDROID主辦單位選擇類別畫面 .............................................................. 42

圖 4-30 ANDROID主辦單位觀看成績畫面 .............................................................. 42

圖附錄一甘特圖 ...................................................................................................... 60

1

第一章導論

1.1 研究背景與動機

往常在比賽時的評分方式還有投票方式都是用人工方式閱票、評分，這樣效率較低，

且需要較多人力。PHP它是一個可以跟使用者互動的動態網頁，讓網頁不會這麼的死板。

而我們這組製作的線上投票系統主要是利用 PHP 與MySQL來製作。這樣可以節省許多

時間與人力，且更便利。此外，我們也針對了 Android 的部分做了另外的探討，希望可

以利用 Android 系統實作 App來結合智慧型手機讓即時評分這個部分可以更加完善。

1.2 研究目的

1. 讓評分與投票能夠減少人力來完成，建構網站並配合手機來讓老師、學生更有效率來

完成投票或評分。

2. 網站設計會員系統並設立權限，以權限來進行管理使用者，還有給與會員權限來執行

網站不同功能。

3. 在網站上進行投票可節省人力資源及時間，且能即時在投票系統內查看票數、得票率

等。

4. 配合目前市佔率很高的智慧型手機所使用的作業系統，來撰寫 Android 程式，培養手

機程式開發技術，讓未來出路多一條選擇。

2

1.3 研究方法

大部分投票與評分系統都是以人工方式來執行，而我們將利用 PHP 與 MySQL來製

作網路上的投票與評分的系統，並且使用 Dreamweaver 來設計網頁，使網頁美工上面看

起來不單調，另外，使用 Android 系統來製作手機上的 App，讓即時評分功能更加普及

化。

圖 1-1 網頁架構

3

1.4 相關軟硬體使用配合情形

(一)軟體：

1. 使用WAMP 5.1.36。

2. 使用 PHP 5.3.0網頁格式。

3. 利用MySQL 5.1.36 來建立資料庫。

4. 使用 Dreamweaver 5 設計 PHP 網頁。

5. 使用 Photoshop 5 修改圖檔。

6. 使用 Eclipse Indigo 3.7.2 來撰寫 App程式。

7. 使用 JDK 1.6來建立 JAVA開發環境。

8. 使用 ADT 18.0.0 創建一個應用程式的使用者介面。

9. 手機使用 Android 2.3.3 版作業系統。

10. 平板電腦使用 Android 3.0 版作業系統。

11. 網站首頁：Http://120.106.201.204/scoring/nbhome/jump.html，其 QR碼如下：

圖 1-2 QR code

12. 手機版網站首頁：HTTP://120.106.201.204/scoring/home/junp.html

(二)硬體：

電腦：

1. 處理器：建議至少 Pentium 4，500MHz。

2. 系統記憶體 (RAM)：建議至少 3GB。

3. 硬碟：建議可用空間 5GB以上。

4. 網頁伺服器與資料庫伺服器 IP 位址：120.106.201.204。

手機：

1. Android 2.3.3版以上作業系統手機。

2. 手機應用程式占記憶體總共 440KB。

3. 手機使用機種：HTC ONE X。

4. 手機使用機種：Samsung Galaxy SII。

5. 平板使用機種：ASUS Nexus 7。

http://120.106.201.204/scoring/nbhome/jump.html

http://120.106.201.204/scoring/home/junp.html

4

第二章文獻探討

2.1 Android介紹

Android 是一個以 Linux 為基礎的半開放原始碼作業系統，主要用於移動設備，由

Google 和開放手持設備聯盟開發與領導。用戶使用系統版本比例截止至 2013 年 1 月 5

日，不同的 Android 作業系統版本的用戶比例[1]。

圖 2-1 Android 版本用戶比例

2.1.1 Android App應用程式

Android以 Linux為核心的 Android行動平台，使用 Java作為程式語言，使介面到功能，

都有層出不窮的變化。App 是 Application 的縮寫，而 Application 就是應用程式的意思。

下圖 2-2 為說明 Android 的系統架構。藍色區塊為應用程式、管理與服務元件。綠色區

塊為資料庫元件。黃色區塊為作業系統的執行時期元件。紅色區塊為系統核心與驅動元

件[2]。

http://zh.wikipedia.org/wiki/Java

http://zh.wikipedia.org/wiki/%E4%BB%8B%E9%9D%A2

5

圖 2-2 Android 系統架構

2.1.2 Android應用程式的組成

Android 系統的應用程式，是由下列四大項組合而成。

1. 機動程式(Activity)。

2. 服務程式(Service)。

3. 廣播接收程式(Broadcast Receiver)。

4. 資料內容提供(Content Provider)。

以下小節將分別介紹。

6

Activity機動程式

本節主要介紹 Activity與其控制方法和生命週期、工作管理流程。以下資料參考自

[3]，Android 作業系統的機動程式是基本的處理工作單元，大部分的機動程式都會有一

個相對應的畫面。如圖 2-3 所示，使用者看到的是顯示畫面(Layout)，顯示的資訊及輸

入輸出都是由 Activity 負責執行。一個 Android 的應用程式通常是由複數機動程式所組

成，當用戶切換顯示畫面時，Android 作業系統提供一個稱為 Intent 的方法來完成。

圖 2-3 Activity機動程式

Android 作業系統可以是在執行(Running)、暫停(Pause)或停止(Stop)狀態，如圖 2-4

機動程式狀態遷移的生命週期(Lifecycle)。

User

View Activity

Layout畫面

Activity

機動程式

7

圖 2-4 機動程式的生命週期

1. 執行(Running)狀態：當程式在執行狀態時，是在前景(foreround)處理中，螢幕則會

出現對應的畫面。

2. 暫停(Pause)狀態：在暫停狀態時，其他程式會超越原本的狀態，所以螢幕會顯示其

他機動程式的對應畫面，但該程式還是可在畫面上看見(沒有佔據所有螢幕)，暫停

的程式在待命中隨時可以回到執行狀態 onResume，但當記憶體不足會被強制結

束。

3. 停止(Stop)狀態：其他程式會超越他，螢幕上完全看不到該停止的程式，他是在背

景(background)待命中，也可在被呼叫 onRestart，但當記憶體不足會被強制結束。

8

Android 和即時作業系統(RTOS：Real Time Operation System)的工作管理相類似。

因為中央處理器同時只能執行一件機動程式，其他以建立的機動程式會處於停止狀態或

暫停狀態，如圖 2-5 Android 作業系統工作管理流程。

圖 2-5 Android 作業系統工作管理流程

Android 有提供以下方法來切換狀態，可提升作業效率：

OnCreat()、OnStart()、onRestart()、onResume()、onStop()、onDestroy()和即時作業系統

的工作管理相似，中央處理器同時只能夠處理一件好機動程式，其它已經建立的機動程

式會處於停止狀態或待命中暫停狀態(ready to run)。

1. 收到 onPause()會回到待命中。

2. 收到 onStop()會跳到停止，在停止狀態收到 onRestart()時會同時動，OnStart()將程式

回到待命中的暫停狀態。

3. 收到 onDestroy()則機動程式就結束了。

4. 在停止或待命中暫停狀態的程式，當記憶體不足時會強制結束。

9

接下來介紹 Activity 所提供的控制方法，如下表 2-2 所示。在需要強制結束時可使

用 finish()方法來達成。當不知道程式是否使用 finish()方法結束時，可使用 isfinish()來判

斷，在 onPause()下採用此方法，來判定使否要保持住目前狀態。當系統記憶體不足時，

會呼叫這 onLowMemory()方法，讓系統空出更多的記憶體。大部分程式會被要求放棄記

憶體，實施記憶體重新整理(garbage collection)是必要的。

表 2-1 Activity的控制方法

控制方法說明

Public void finish() 強制結束機動程式

Public void isfinish() 判定機動程式是否已結束

Public void onLowMemory() 記憶體不足時會使用此方法

Service服務程式

服務程式是一個在背景運轉的程式，不提供顯示畫面作為和使用者之間的介面。服

務程式在應用程序的主執行序上運轉，不會影響其他活動和用戶介面操作。

Broadcast Receiver廣播接收程式

廣播接收程式可用來接受訊息和廣播通知做出反應。很多廣播通知都會是來自

Android 作業系統，如電池耗盡時、網路連接有變化時等。應用程式也可廣播訊息，如

完整下載資料時，通知程式可以開始擷取等。

Content Provider資料內容提供

Android 作業系統提供經由資料內容提供方法來公開資料，可以公開資料到資料內

容容器內，其他應用程式經由授權後可以讀取。資料內容提供是一個可選的機制，提供

對資料內容的資料讀取和寫入。

Intent

Intent物件視為是程式和 Android 系統互動的媒介，當程式需要另一個 Activity來完

成工作時，便可以建立一個 Intent 物件，填入所需的資料，最後呼叫 startActivity()方法

將此 Intent 物件傳送給 Android 系統。Android 系統收到 Intent 物件後，再根據其中的資

訊啟動適當的 Activity或程式來進行處理。

Bundle

除了 Activity 之間的切換之外，常常需要在呼叫另一個 Activity 的同時傳遞資料，

所以就必須要利用 android.os.Bundle 物件封裝資料的能力，將需傳遞的資料或參數，藉

由 Bundle來傳遞於不同 Intent之間。

SeekBar

SeekBar 控制項可以透過拖動滑桿改變目前的值，可利用 SeekBar 來設定具有一定

10

範圍的變數值。

Toast

Toast 元件的功能就是在螢幕上彈出一個訊息視窗告知使用者某個訊息。

Shared Preferences

Android 作業系統所提供的一種簡單機制，用來儲存和檢索一些關鍵變數內容，比

如當關機時，需要儲存一些資料，以便下次開機時能夠立即讀取這些資料。

HTTP

HTTP 是 Internet 中廣泛運用的協定，幾乎所有的電腦語言和 SDK都會不同程度的

支援 HTTP。

HTTP GET 與 HTTP POST

GET方法是把直接將參數加到 URL(Uniform Resource Locator)上，而 POST 方法可

傳遞大量資料，且有經過加密，安全性相對的高。

11

2.2 弘光科技大學-學生專題管理系統

此專題題目為學生專題管理系統[4]，指導老師為游原龍老師，組員：曹婕渝、吳宛

芝、許菁芳、陳怡靜，此專題完成時間為中華民國九十九年一月。

使用相關軟體為作業系統：Windows XP、MySQL 4.0.12-nt、Dreamweaver MX2004、Flash

MX2004、Photoimpact 11、PHP 1.8、Word、IE。

圖 2-6為此專題的網站首頁，跟本專題一樣有區分使用者權限，登入後能做個別不

同的操作，上傳專題書面報告、海報檔，下載資料，投票，評分等。本專題還製作了

Android 版本提供評審更方便的選擇。

圖 2-6 弘光科技大學學生專題管理系統

12

第三章研究方法

3.1 研究步驟

如圖 3-1，本專題研究步驟，先收集相關資訊，分析出本專題要點，並做所有相關

資料彙整後，開始建立資料庫，並撰寫網頁及 Android 程式，網頁和手機程式寫好後，

實際操作，並把 App放到手機上做操作，測試程式方面有沒有問題，測試完成後再做系

統整合之後成果發表。

圖 3-1 研究步驟

1. 網站部分我們將在 3.2-3.6節做詳細的說明。

2. 資料庫部分我們將在 3.7節做詳細的說明。

3. Android 部分我們將 3.8節做詳細的說明。

13

3.2 網站規劃

本專題會先建構網站，如圖 3-2來規劃網站。在首頁登入後，區分權限來限制操作，

參賽者可進到小組頁面進行上傳、下載文件資料。學生可進到投票區，來票選喜愛的專

題。評審可進到評分系統，來進行專題評分，且評分完隨即算出總分，並送到資料庫內

儲存。管理者所有功能都可進入，且可直接在頁面上執行管理操作。

圖 3-2 網站架構

14

3.3 會員系統

下列我們將介紹會員系統分析、系統設計、安全性和系統測試，而我們也參考[5,6]

裡所介紹的會員系統判斷 Session，好讓使用者依照權現進行登入。

3.3.1 會員系統分析

會員系統是大部分網站不可或缺的一套系統，而我們將對以下四項來進行分析。

1. 需要登入頁面來進行登入。

2. 需要會員資料表(member)來抓取會員資料登入會員。

3. 每種會員將會與不同權限登入，能使用的系統也將會不同。

4. 網站功能目前只開放給系內同學使用，所以不對外開放註冊。

3.3.2 會員系統設計

會員設計分為以下四項，首先要先有會員資料表，並且每個頁面都須做限制頁面，

並且給予權限。

1. 資料庫建立，並區分為學號、帳號、密碼、姓名、電話、權限、信箱與組別代碼等。

2. 使用者權限設定依照帳號類別給予，如：限制頁面。

3. 登入帳號成功會跳回首頁，反而登入失敗時，會跳回登入頁面重新輸入帳號與密碼

在次登入，並提示帳號或密碼錯誤。

4. 會員登入帳號為學號，密碼則是生日。

3.3.3 會員系統安全性

如果未登入使用者，Session 將為空值，並無法使用其他系統功能。

1. 使用 Session 記住目前登入的使用者。

2. 依照所有權限區分，權限 1為管理員，權限 2 為評審，權限 3為專題生，權限 4為

一般生。

15

3.3.4 會員系統測試

依照資料庫的設定來做測試，並且測試頁面是否跳轉，而我們將對以下四項來進行

測試。我們將會以各種權限的使用者登入看看。

1. 測試所有不同權限帳號可不可以順利登入，並且可不可以使用其本身的投票或評分、

小組頁面功能。

2. 測試登入成功或不成功頁面會不會自動跳轉。

3. 壓力測試，測試看看可以同時多少會員登入系統。

4. 限制頁面，如沒登入會員直接輸入其他頁面網址將會回首頁做登入。

3.4 投票系統

下列我們將介紹投票系統分析、系統設計、安全性和系統測試，而我們也參考[7]

裡所介紹的 update，使大家所投的票可以正確寫入資料庫內。

3.4.1 投票系統分析

投票限制為每一類別限制只能投選一票，如果重複投票將會跳出提示視窗顯示已投

過票，並做下列四項來加以分析。

1. 需要選擇類別頁面來進行選擇類別組投票。

2. 需要投票資料表(member)來抓取各類別的組別名稱。

3. 頁面區分為三種：嵌入式系統類、網路應用類及夜四技。

4. 投票頁面分為三個頁面，首先先選擇類別，選完類別之後進到投票頁面，最後票數

結果將只有主辦單位看的到。

3.4.2 投票系統設計

所有投票組別將以資料庫內資料抓取出來，投完票後再寫回資料庫內，並且針對以

下四項做設計。

1. 登入會員進到投票頁面即可進行投票。

2. 投票完成之前會彈出確定訊息，確定之後回傳到資料庫，並回到首頁。

3. 每人每類別各為一票，投過票數的會員將無法再次投票。

4. 如果想再次重複投票，則會出現已投票過的訊息，並且跳回到首頁。

3.4.3 投票系統安全性

利用 Session 紀錄使用者登入的帳號，並且把所投的組別寫入資料庫，資料庫內如

果有投票過後的資料，將無法再次投票，並跳出提示視窗。

16

3.4.4 投票系統測試

投票完畢後檢查資料庫內有沒有投票後結果，大量人數進行投票時資料庫寫入會不

會出現當機情形。測試方法我們則實際登入一般生跟專題生的測試帳號來測試可不可以

正確投票並寫入資料庫內。

1. 投票後票數是否會回傳到資料庫。

2. 投票成功提示視窗是否會正常跳出。

3. 一次大量進入投票頁面是否會出現當機或 LAG的情況。

4. 是否會抓取資料表內的組別名稱。

3.5 小組頁面

下列我們將介紹小組頁面系統分析、系統設計、安全性和系統測試，而我們也參考

[7]所介紹的 upload 來做上傳物件，並限制檔案大小及格式。也參考[14,15]裡所介紹的

glob，利用 glob 所取得檔案列表所取得資料夾內的檔案，再以超連結的方式做下載。

3.5.1 小組頁面分析

小組頁面須要能上傳及下載所上傳的檔案，並且限制檔案大小和檔案格式。

1. 需要有小組頁面進行上傳、下載資料。

2. 上傳小組資料(如:海報、書面文件、ppt 檔、pptx 檔、doc檔、docx檔)。

3. 每個小組將會有各自的資料夾上傳或下載各自的檔案。

3.5.2 小組頁面設計

小組頁面上方設計為可上傳區，可上傳各自組別的海報、書面文件和投影片…等檔

案，下方則設計為下載區，可下載自己或組別成員所上傳的東西。

1. 小組頁面只有應屆專題生才可使用，組別分配依照各組組別名單，上傳或下載也是

依照各組的資料夾。

2. 同時可上傳資料為 3個，格式和檔案大小均有限定，格式為 ppt、pptx、doc和 docx

檔，檔案最大為 30Mb。

3. 上傳檔案後頁面會自動跳轉更新，下面下載區則會馬上更新上傳的檔案，點擊後即

可下載。

3.5.3 小組頁面安全性

小組頁面使設計給應屆專題生使用，所以我們再登入時會先判斷 Session 紀錄的組

別代碼及權限，各組別只能看到自己相對應的資料夾。

17

3.5.4 小組頁面測試

測試自己組別所上傳的檔案會不會上傳到各自的資料夾內，提示視窗是否會自動彈

出給予提示。測試方法我們將登入專題生的測試帳號上傳或下載檔案。

1. 上傳檔案時超過檔案大小是否會跳出視窗提示。

2. 上傳檔案時格式錯誤是否會正常上傳，或是跳出視窗提示。

3. 檔案下載部分超連結是否有辦法正確執行下載功能。

3.6 評分系統

此專題的評分部份，設計步驟分為系統分析、系統設計、評分系統安全性、評分系

統測試，而我們也參考[7]所介紹的陣列來做，並且也使用了 insert 和 update 來新增或更

新資料庫內的配分與評分成績。

3.6.1 評分系統分析

資料表要先有二張資料表，一張為配分表，另一張為評分的資料表，配分和最後成

績都須寫入資料庫內，成績計算至小數點第二位。

1. 需要配分及評分資料庫。

2. 配分依照成果展、口試書面文件、上台報告表現、專題完成度，四項成績。

3. 需要判斷配分、評分是否有錯誤，錯誤則跳出提示視窗。

4. 評分正確後回傳到資料庫內。

3.6.2 評分系統設計

評分須先做配分後進行評分，評分須判斷四項配分相加起來是否等於一百，或沒有

依照各項成績配分規則去配分，評分方面則是判斷小於零或大於一百為錯誤。

1. 各項配分規則為成果展(0~20%)、口試書面文件(25~35%)、上台報告表現(20~30%)

及專題完成度(30~40%)。

2. 評分過後將資料回傳到資料庫。

3. 評分資料表劃分為：口試委員編號、類別編號、組別代碼、成果展、文件、口試上

台、完成度、總分。

4. 如有兩組成績相同者，則以成果展成績、投票票數再來看現場評審投票成績為優先

順序為主。

5. 如果配分超過預設範圍，按下計算總分會顯示出錯誤訊息。

6. 輸入成績欄位最多輸入為三位數字。

7. 若各項成績輸入超過一百，會顯示錯誤訊息。

8. 輸入皆正常按下開始評分的按鈕，就直接在本頁面計算出成績(四捨五入到小數點

二位)。

9. 按下送出成績則回傳至資料庫內。

18

3.6.3 評分系統安全性

安全性方面依照 Session、權限及組別代碼判斷可以評選哪個類別的成績，其他類

別將無法進行評分。

3.6.4 評分系統測試

測試方面則針對成績計算正不正確，提示視窗會不會正確彈出，資料能不能正確寫

入資料庫內。而評分的測試方法，我們利用登入評審的測試帳號登入，看看可不可以正

確評分，並寫入資料庫內。測試項目如下：

1. 評分後按下送出成績是否會回傳到資料庫。

2. 配分錯誤是否會跳出錯誤視窗。

3. 評分錯誤是否會跳出錯誤視窗。

4. 按下成績計算後會不會自動算出成績。

5. 評分後出現例外情況是否正常處理。

3.7 E-R Model (實體-關係模型)

此圖為四張資料表之間關聯圖，這邊我們參考[7,16]建立我們資料庫，並且參考了

資料型態。

圖 3-3 E-R Model(實體-關係模型)

3.7.1 資料表欄位

實體指的是四張資料表，有會員、組別、投票、配分、評分。

1. 會員資料表欄位：會員編號、學年度、帳號、密碼、姓名、電話、手機號碼、權限、

信箱與組別代碼、日四技_嵌入式、日四技_網路組、夜四技。

2. 組別資料表欄位：組別代碼、中文題目、英文題目、指導老師、學年度、總票數、

平均成績、名次。

3. 配分資料表欄位：口試委員編號、類別編號、成果展配分、文件配分、上台配分、

19

完成度配分。

4. 評分資料表欄位：口試委員編號、類別編號、組別代碼、成果展、文件、上台、完

成度、總分。

3.7.2 資料表欄位設計

表 3-1 會員資料表

欄位解釋資料型態欄位長度

Sno 會員編號 Varchar 15

AYear 學年度 Varchar 5

ID 帳號 Varchar 10

Pwd 密碼 Varchar 10

Name 姓名 Varchar 5

Phone 手機號碼 Varchar 10

Level 權限 Varchar 5

TeamNo 組別代碼 Varchar 5

Morning_Android 日四技_嵌入式系統類 Varchar 255

Morning_Internet 日四技_網路應用類 Varchar 255

Night 夜四技 Varchar 255

表 3-2 組別資料表



CSubject 中文題目 Varchar 255

ESubject 英文題目 Varchar 255

Director 指導老師 Varchar 5

AYear 學年度 Varchar 3

Vote 總票數 Varchar 255

Avg 平均成績 Float 6

Rank 名次 Varchar 2

20

表 3-3 配分資料表


Committee 口試委員編號 Varchar 15

Category 類別編號 Varchar 2

Exhibition 成果展配分 Float 6

Document 文件配分 Float 6

Speak 上台配分 Float 6

Achievement 完成度配分 Float 6

表 3-4 評分資料表


Committee 口試委員編號 Varchar 15

Category 類別編號 Varchar 3


ExhibitionScore 成果展 Float 6

DocumentScore 文件 Float 6

SpeakScore 上台 Float 6

AchievementScore 完成度 Float 6

Total 總分 Float 6

3.7.3 合併查詢

以下為評審評分時會使用到的合併查詢：

1. 會員與組別資料表的合併(會員資料表的組別代碼參考至組別資料表的組別代碼)。

2. 配分與會員資料表的合併(配分資料表的會員編號參考至會員資料表的會員編號)。

3. 評分與配分資料表的合併(評分資料表的口試委員編號、類別編號參考至配分資料

表的口試委員編號、類別編號)。

21

3.8 Android評分 App

下列我們將介紹 Android 系統分析、系統設計、系統測試、資料儲存和傳送分數說

明，參考[16-25]內容，如 App畫面(Layout)的配置，使用 Linear Layout 或是 Table Layout

等的選擇，以及類別檔的撰寫，Intent、Bundle 的使用方法，SeekBar 的監聽，使用 Shared

Preferences 的方式儲存資料在記憶體內。

3.8.1 Android系統分析

我們在 Android 系統上將會實作兩個 App，區分為評審版與主辦單位版，下列項目

為本專題 Android 方面，預期到達的功能：

1. 本專題會製作兩個 App，一個為所有評審使用的評分版，此版本可在本專題網站上

登入後，進行下載的動作。另一個為主辦單位的版本，僅供主辦單位使用，能夠讓

比賽的評比狀況及投票結果在此版本上做即時觀看的動作。

2. 進入評審版 App 時，若要進行評分動作，需先輸入帳號密碼，來驗證身分，確保比

賽權益。

3. 離開評分系統時，會儲存優先資料到記憶體上，下次開機時，可以馬上讀取到資料。

4. 配分完畢後，按下繼續評分，會把使用者配置的數值做檢查及儲存的動作，且傳送

至資料庫內。

5. 評分完，按下按鈕，若分數大於一百或小於零，會跳出錯誤視窗，若無錯誤則會傳

送到網站資料庫內。

6. 主辦單位的版本也是需先登入，在進到選擇類別的畫面，任選一類，馬上抓取網頁

資料庫的資訊做顯示的動作。

圖 3-4為手機評分版的流程圖，在網站上下載 apk檔，後執行安裝，即可開始使用。

進入 App畫面後，下方有兩個按鈕，START鈕為開始評分，按下即切換畫面。LINK鈕

則是連結至本專題網站。選擇 START後，畫面會顯示兩個文字輸入框，使用者輸入帳

號密碼，進行登入。失敗並不會切換畫面，且在此畫面下方提示帳密錯誤。登入成功後，

切換至選擇類別頁面，此畫面會依照評審權限去篩選可顯示的按鈕。假如選擇嵌入式系

統類，畫面上會顯示配分頁面，依照需求配置配分。輸入配分後，按下繼續評分按鈕，

如果配分超過限制，會跳出提示訊息，並且停在此頁面，如沒超過限制，即可切換下一

個畫面。輸入各組別的各項分數，按下計算總分，如果分數小於零或大於一百，會無法

計算總分，並且跳出訊息來提示使用者。皆無錯誤，即可按下傳送。

22

圖 3-4 評審版流程

圖 3-5為主辦單位版的流程圖，輸入帳號密碼登入後，按下選擇類別鈕，畫面上會

立即抓出主辦單位頁面所需的資料，如：各個口試委員的名稱、票數等。

圖 3-5 主辦單位版流程

23

3.8.2 Android系統設計

Android 系統方面有兩項 App，圖 3-6為評審使用的版本，圖 3-7為主辦單位版，而

我們的初步構將以下列架構圖來展示：

圖 3-6 評審版架構

圖 3-7 主辦單位版架構

24

Android App的部分，我們依照以下三項來做粗略的規劃：

1. 在 App頁面設計一個開始畫面，按鈕有 START(目前以專題競賽為主)，按下即可進

入登入畫面，LINK 鈕則是直接連到本專題網站。

2. 選擇 START按鈕→登入帳號密碼→進入可選擇你要評比的組別→輸入配分→輸入

各項成績→傳送成績。

3. LINK→連結到專題網站。

3.8.3 Android系統測試

Android 的 App我們將以兩大項的評審版及主辦單位版，以個別的 Android 類別做

詳細的測試計畫，並包含測試項目與測試結果：

評審版：

本 App是使用實機測試，手機型號為 SUMSANG SII。程式編寫軟體為 Eclipse，使

用此軟體來連結實機作測試，使用管理者的評審權限帳號來做測試。

表 3-5 Android_scoringActivity.java 測試

測試項目測試結果

按下 START鈕，是否會切換畫面。會切換畫面。

LINK鈕，連結至本專題網頁的首頁。會連至本專題畫面。

表 3-6 loginMain.java 測試


進入此畫面時，會先將先前所儲存的資料

放置 EditText 內。

離開畫面會先做儲存動作，再次進入此畫

面會自動填入先前儲存的數值。

按下 login 鈕，若帳密有一為空值，下方

TextView會顯示提示訊息。

帳密兩者其一為空值，會正確顯示訊息。

按下 login 鈕，帳密若輸入錯誤，則會停留

在此畫面，不會切換畫面。

帳密錯誤不會切換畫面。

按下 login 鈕，帳密若輸入正確，且具有評

審委員的權限，則會跑出 Toast 訊息。

會跑出 Toast 訊息，且切換至下一畫面。

按下 LAST 鈕，畫面回至

Android_scoringActivity.java。

按下按鈕會回到正確的畫面。

Shared Preferences 在離開畫面時會確實儲

存帳號密碼，且顯示在 EditText 內。

離開畫面再返回，先前所打的帳號密碼會

顯示在 EditText 內。

表 3-7 Category.java 測試


依照評審的權限來顯示此畫面的按鈕，隱會依照所給的權限去顯示可按按鈕。

25

藏不可評分的類別按鈕。

按下 LAST 鈕，畫面回至 loginMain.java。按下按鈕會回到正確的畫面。

表 3-8 seekbar.java測試


四個 SeekBar可拉動，旁邊的 TextView即

時監聽 SeekBar，且需要符合範圍顯示。

TextView會即時監聽 SeekBar 的動作。

四項配分若未剛好達到一百分，按下

NEXT會先檢查，並跳出 Builder警告視

窗，不會切換畫面。

未達條件會顯示警告視窗。

四項配分剛好一百分，會將配分數值傳送

至網頁資料表 partition 內。

通過條件會將四項配分寫入資料表

partition。

按下 LAST 鈕，畫面回至 Category.java。按下按鈕且會回到正確的畫面。

表 3-9 f1.java測試


畫面會先抓取使用者 ID，還有將上頁配分

傳送至此畫面的指定 TextView上顯示。

ID 會正確顯示在 TextView上，前一頁的

配分會被傳送過來，顯示在畫面上方。

按下 Count 鈕，可在此頁試算分數，算到

小數點第二位。

能夠正確計算分數，取到小數第二位。

Write鈕會將所有分數做檢查的動作，若分

數有大於一百或小於零，會跳出警告視窗

提示使用者。

能夠檢查所有欄位，且會顯示警告視窗。

若分數都符合條件，Write鈕會將所有分數

傳送至網頁資料表 Score內。

能夠將所有欄位寫入網頁資料表 Score內。

按下 LAST 鈕，畫面回至 f1.java。按下按鈕且會回到正確的畫面。

Shared Preferences 在離開畫面時會確實儲

存所需數值，且顯示在 EditText 內。

離開畫面再返回，先前所打的數值會顯示

在 EditText 內。

主辦單位版：

本 App是使用實機測試，平板型號為 ASUS Nexus7。程式編寫軟體為 Eclipse，使

用此軟體來連結實機作測試，使用管理者的評審權限帳號來做測試。

表 3-10 login.java測試


帳號密碼若有一為空值，下方 TextView則

會顯示錯誤訊息。

帳密錯誤會顯示錯誤訊息提示使用者。

帳密無誤會顯示 Toast 訊息，且切換畫面。能夠正確驗證帳密，且切換畫面。

26

表 3-11 category.java 測試


按下個別的組別鈕，會切換至該組別的查

看畫面。

會顯示正確畫面。

按下 return鈕，會切換至 login.java。會顯示正確畫面。

表 3-12 look1.java測試


正確抓取所有資訊及分數。能夠成功抓取網頁上的資料。

按下返回會回到選擇組別畫面。會回到正確畫面。

3.8.4 Android資料儲存

儲存的資料都是程式所私有的，所以如果其它程式需要使用該資料，必須使用資料

儲存方法[3]。資料共用一共有四種方式，依照須要來選擇，本專題目前需使用 Shared

Preferences 來儲存，因為此方法寫法較簡單，且在離開程式時，將資料優先儲存至記憶

體上，待下次使用時，可馬上讀取這些資料。

1. Shared Preferences 離開時儲存優先資料方法：在關機時儲存重要資料到記憶體上，

下次在開機時，可馬上讀取資料，方便作業。Activity的生命週期結束時進入 onStop

執行儲存動作。此方法較適合儲存小量資料。無法在多個程式間使用 Shared

Preferences 資料。

2. File文件檔案儲存方法：採用傳統方法來保存，應用程式可將文件檔案直接儲存在

手機的記憶體裡，讓其他程式來讀取檔案。

3. SQLite資料庫：Android 提供的資料庫。

4. Network：透過網路自伺服器讀取檔案(下載)，將檔案寫入伺服器(上傳)。

27

3.8.5 傳送分數說明

圖 3-8 傳送分數說明圖

輸入分數完按下傳送分數的按鈕，會先將所有分數寫入離開時的 SharedPreferences

內，再把所有數值放置陣列內，如上圖 3-8左上所示，先逐一讀取陣列內的數值，判斷

只要有一個數值，大於一百或小於零，會在此畫面跳出警告視窗，提醒使用者重新檢查

輸入的數值。若以上檢查皆無誤，則隨即連上網路，如圖 3-8左下，使用 POST 傳送，

須將資料放置陣列內，用此陣列傳送出去。而接收端是使用 PHP 撰寫的網頁，接收所

有參數值，如圖 3-8 右下，接者使用網頁下資料庫語法。如圖 3-8 右上判斷使用者所傳

送的參數，是做更新動作還是新增資料至資料庫。

28

第四章結果探討

4.1 期末成果說明

本專題主要分為兩大部分，網頁成果與 Android App的成果，如下列所示。

4.1.1 期末成果-網頁

圖 4-1為首頁畫面，登入之後依照不同會員權限進入畫面，依照每種會員權限可進

行投票、評分或小組頁面等不同的系統，而我們的所有公告則顯示在公告區。

圖 4-1 首頁畫面

圖 4-2 為圖 4-1 會員登入的畫面，輸入正確帳號密碼之後，帳號設定為學號，密碼

則是自己的生日，點選登入，即可登入系統。

圖 4-2 會員登入畫面

29

圖 4-3輸入錯誤的帳號或密碼，則會跳轉至輸入帳號或密碼錯誤頁面從新輸入，直

到正確輸入帳密才會登入成功。

圖 4-3 密碼輸入錯誤跳轉畫面

圖 4-4為評審權限登入後的首頁，評審可再網路上進行評分，也可以在網頁上下載

利用 Android 程式設計的評分 App，評審資料庫權限設定為 2。

圖 4-4 評審首頁畫面

30

圖 4-5為專題生登入後的首頁，專題生能使用的系統分為兩大類，投票區可以票選

出自己喜歡的組別，小組頁面則可供自己組員上傳或下載各自的海報、書面報告和投影

片，專題生資料庫權限設定為 3。

圖 4-5 專題生首頁畫面

圖 4-6為一般生登入後的首頁，一般生只能使用投票的部分，一般生資料庫權限設

定為 4。

圖 4-6 一般生首頁畫面

31

如圖 4-7投票頁面區分為三種，嵌入式系統類、網路應用類與夜四技。選擇其中一

種後即可開始進行投票，如圖 4-8。

圖 4-7 投票類別

如圖 4-8所示可看到選擇類別所有組別，表單則直接從資料庫抓取，可減少往後組

別新增或修改處理時間，投票時間結束後將會計算票數，之後將由主辦單位公佈投票結

果的名次。

圖 4-8 網頁投票

32

如圖 4-9評分畫面會先從選擇類別開始，各口試委員依照登入權限，篩選畫面上的

按鈕能否按下，選擇類別之後進到評分頁面。

圖 4-9 評分類別

圖 4-10 首先需要先輸入此類別成績的配分，四項配分需加起來等於一百，且每項

評分欄不可輸入小於零或大於一百的數，按下開始評分按鈕，此畫面右側欄位可先試算

總分，按下送出成績鈕，則會將配分、評分跟總分送進資料庫內。

圖 4-10 網頁評分(輸入正確)

33

如圖 4-11，評分的部份，分數輸入完，按下開始評分鈕，會先判斷分數是否符合要

求，首先配分會先判斷後再評分的數值，分數小於零或大於一百，則為不正確的分數，

如圖 4-12。通過配分與分數的檢查，會將所填數值寫入至網頁資料庫內。

圖 4-11 網頁評分(輸入錯誤)

圖 4-12 網頁配分評分錯誤

34

專題生只能分別進到自己的組別，其他使用者皆不能登入，只開放給應屆專題生使

用，進去後畫面如下圖 4-13，各組只可在自己組別頁面上傳、下載各自的檔案。檔案限

定為.pptx(包含.ppt)檔和.docx(包含.doc)檔，其他檔案則會出現檔案錯誤視窗，檔案若超

過 30MB則會跳出提示視窗，如圖 4-14。

圖 4-13 小組畫面

圖 4-14 上傳檔案格式錯誤

35

4.1.2 期末成果-Android App

圖 4-15為 App主畫面，一共有兩個按鈕，開始評分、連結到本專題網站。按下 START

按鈕會使用 Intent 方法來跳到下一個頁面。LINK按鈕則是連結到本專題網站。

圖 4-15 Android 主畫面

圖 4-16為登入畫面，需先在兩個 EditText 登入使用者帳號，使用者名稱可以輸入英

文，密碼欄位則會用黑點表示，來保護使用者權益。若先前已登入過，則會先抓取儲存

在記憶體內的資訊，再放置此畫面的文字框中。

圖 4-16 Android 登入畫面

36

圖 4-17若是帳號密碼有一個欄位為空，下面的 TextView會有提示訊息。且停留在

此畫面，不做登入的動作。

圖 4-17 Android 登入失敗畫面

圖 4-18按下 LOGIN 按鈕，會將帳號跟密碼用 HTTP GET方法傳送先連至網頁。串

接在網址上，比對會員資料表內是否有此使用者的帳密資料，在網頁上會顯示成功訊息，

再回到此類別的程式碼內，用字串搜尋成功字樣，有搜尋到即跳轉至下一畫面。如圖 4-19。

圖 4-16、4-17、4-18的程式碼請見 P.46-P.48。

圖 4-18 Android 登入成功畫面

37

圖 4-19畫面上有三大類別，會依照使用者可評分的類別去篩選可以看見的項目按

鈕，例如只評嵌入式系統類的口試委員，此畫面則不會看到另外兩個類別的按鈕。此帳

號是測試帳號，所以可看到所有組別，方便做測試。圖 4-19的程式碼請見 P.48-P.49。

圖 4-19 Android 選擇類別畫面

圖4-20系上專題可以配置四項配分，我們使用SeekBar來分配配分，右方的TextView

可以看到目前拉動的分數值。

圖 4-20 Android 配分畫面

38

圖 4-21為按下 NEXT 按鈕，會抓取 4項配分的 TextView，判斷加起來是否剛好一

百。若是未達成條件，則會跳出警告視窗，且停留在此頁面。

圖 4-21 Android 配分錯誤畫面

圖 4-22為判斷配分無誤後，會抓取口試委員的帳號與類別去做判斷，若資料庫內

的配分表，已有此位口試委員的此類別的配分資訊則會更新資料庫，否則新增一筆配分

的紀錄。圖 4-20、4-21、4-22的程式碼請見 P.50-P.53。

圖 4-22 Android 正確配分畫面

39

圖4-23畫面上方的TextView可以看到剛才畫面所配置的四項配分數值，使用Bundle

方法傳遞配分，且顯示在此畫面上，讓使用者查看，此頁面可上下滑動。

圖 4-23 Android 評分畫面

圖 4-24按下 Count 鈕，則會計算此組的平均分數，但僅此在此畫面供查看用，並未

寫入到資料庫內。

圖 4-24 Android 計算平均畫面

40

圖 4-24所示當按下 Write鈕，會先將所有數值更新至手機記憶體內，這樣即可在此畫

面做更新 Shared Preferences 的動作，再轉存至陣列內，用迴圈去判斷說此陣列內是否有

小於零或是大於一百的數值。符合以上條件則會彈出警告視窗提醒使用者檢查數值，如

圖 4-25所示。

圖 4-25 Android 評分錯誤畫面

圖 4-24通過檢查後，先建立與網路的連線，使用 HTTP POST 方法，將所有要傳送

的資料放置陣列內，再傳送至 PHP 網頁端，使用網頁端去下 MySQL 資料庫語法，判斷

此口試委員是有已有此類別的分數，若有則做更新的動作，反之則做新增。完成動作後

此畫面會跳出 Toast 的訊息如圖 4-26所示。圖 4-23、4-24、4-25、4-26的程式碼請見

P.53-P.56。

圖 4-26 Android 成功傳送資料庫畫面

41

圖 4-27為主辦單位版首頁，當按下 start 鈕可進入到下一個頁面，如圖 4-27 所示。

圖 4-27 Android 主辦單位首頁畫面

圖 4-28為主辦單位版登入頁面，登入帳號跟評審的登入帳號相同，同樣是使用管

理者的評審權限測試帳號。

圖 4-28 Android 主辦單位登入畫面

42

圖 4-29為主辦單位版選擇觀看類別頁面，選擇完後可以觀看該類別資訊，如圖 4-30

所示。

圖 4-29 Android 主辦單位選擇類別畫面

圖 4-30為主辦單位版觀看目前成績、票數、平均、排名等資訊。圖 4-30的程式碼

請見 P.57-P.58。

圖 4-30 Android 主辦單位觀看成績畫面

43

4.2 結論

以往投票及評分都是採取人工的方式來閱票和計算成績，這樣會消耗許多人力，如

果題目大的話，則需要更多的人力來做計算，這樣相當的不方便，所以我們製作了網頁

及手機 App 來使用。本專題的評分系統是利用 Eclipse 來撰寫 Android 的 App 後，讓評

審可以在比賽過程中隨時隨地都可使用，參賽者和主辦單位也能利用手機，隨時掌握目

前比賽的狀況。網頁部分則是利用 PHP 及 Dreamweaver 來撰寫，讓沒有智慧型手機的

人可以使用網頁來做投票及評分。另外我們也使用了 PHP 網頁與MySQL資料庫存取投

票結果及配分和評分的結果。我們也製作了小組上傳及下載頁面，可供應屆專題生來使

用，可上傳海報、書面文件和投影片…等檔案，也可下載其他組員或自己所上傳過的檔

案。

以下分為四大項功能來做討論。

會員系統：

提供系上師生帳號密碼，能夠登入網站或是評審可使用的 Android App。未來只要

在資料庫新增資料，即可使用。

投票系統：

會員權限為一般生或專題生，可在本專題網站上登入後，做投票的動作。並且會執

行檢查該帳號在此類別是否投過，以防止重複投票。

小組頁面：

提供應屆專題生繳交書面、海報檔及其他專題相關檔案所使用，此小組畫面只有該

組組員可以觀看、上傳及下載。

評分系統：

評分部分我們區分為兩大部分，網站評分系統與 Android App。登入網站後，是評

審權限才可看到評分選項，在選擇類別頁面，會依照可評分的組別來顯示，配分畫面也

有檢查機制，防止配分錯誤。評分頁面填完分數，按下按鈕則會開始檢查所有分數是否

符合要求。Android App 分為兩種評審版與主辦單位版，評審版為評審評分用，主辦單

位版則是讓主辦單位查看所有評比狀況。

44

參考文獻

[1] Android 統計數據發布 Jelly Bean 超 10%，

HTTP://mobile.yesky.com/268/34401768.shtml。

[2] 吳奕鈞，郭宗瑋，陳國榮，許睿暐，許遠岳，Android 遊戲製作，

HTTP://210.59.95.19/mis9822/02.htm。

[3] 林城，Google Android 應用程式開發實戰第三版，碁峰，2011年 9月。

[4] 曹婕渝，吳宛芝，許菁芳，陳怡靜，學生專題管理系統，

HTTP://192.192.246.244/~prj/overyear_singlepro.php?no=77。

[5] 陳會安、學貫，PHP 與MySQL網頁設計範例教本，2009年 11月。

[6] 林梓涵，PHP + MySQL網頁程式設計與資料庫，碁峰，2009年 6月。

[7] 陳惠貞、陳俊榮，PHP5&mysql 程式設計第二版，學貫，2006年 11 月。

[8] 凱文瑞克，PHP5 與 mysql5 入門學習指南，旗標，2006年 2月。

[9] 李啟宏，網頁設計驚嘆號 DREAMWEAVER PHP X 互動網站直擊，精誠資訊，2009

年 8月。

[10] 李啟宏，網頁設計驚嘆號 DREAMWEAVER PHP X 至高的網頁特效，精誠資訊，2009

年 8月。

[11] 昱得資訊工作室，Dreamweaver&PHP 資料庫實例應用，旗標，2010 年 8月。

[12] Jeffrey bardzell，DreamweaverMX2004 動態網站開發，旗標，2005年 4月。

[13] 蔡哲明，Dreamweaver8 與 PHP 網頁資料庫設計實務，文魁資訊，2006 年 8月。

[14] stackoverflow，php file upload how to restrict file upload type ，

HTTP://stackoverflow.com/questions/7322137/php-file-upload-how-to-restrict-file-uploa

d-type。

[15] FILEXT，What are the Microsoft Office MIME Types?，

HTTP://filext.com/faq/office_mime_types.php。

[16] 西澤夢路，MySQL+PHP 資料庫網頁，博碩文化，2009年 2月。

[17] 徐志龍、陳昱勛、鄭名傑、陳小鳳， Google Android SDK開發範例大全第三版，

精誠， 2011年 4 月。

[18] 楊丰盛，佳魁，Android 應用開發揭秘， 2010 年 11 月。

[19] 蓋索林，Google!Android 3 手機應用程式設計入門第四版，松崗，2011 年 8月。

[20] 董士偉、王威翔、洪才庭、林明璋，Android 2 SDK 開發入門與應用，松崗，2010

年 7月。

[21] 孫傳雄，HTTP://blogchinatimes.com/tomsun/archive/2010/09/07/536320.html，Android

教學，孫傳雄研究室，2010年 9月。

[22] 王安邦，Android 4.X 應用程式開發之鑰，上奇資訊，2012年 6月。

[23] 孫宏明，Android 4.X 手機/平板電腦程式設計，碁峰，2012年 1月。

[24] 鄧文淵，Android 初學特訓班，碁峰，2012 年 6月。

[25] 于智鵬、林彥君，Android 關鍵技術，博碩文化，2011年 7月。

http://filext.com/faq/office_mime_types.php

http://filext.com/faq/office_mime_types.php

45

附錄一 Q&A

劉仁筑老師：

1. Q：建議組別以上網抓取資料的方式動態進行頁面建立。

A：主辦單位的版本，在查看所有評比狀況的頁面，全是使用字串搜尋來抓取所需

資料。

2. Q：建議使用模組的方式建立給不同類型的評分系統。

A：網頁部分都是抓取網頁資料庫的內容去做應用的動作，App版本也可直接抓取

新的資料。

詹宏章老師：

3. Q：程式碼加外框。

A：已修正，由附錄頁碼 46頁開始至 58頁，加上外框。

4. Q：架構圖附上相對的 Activity名稱

A：已修正圖示，頁碼 34頁

王德順老師：

5. Q：報告內容第 27 頁多了一個”，”號。

A：已經修正完成，頁碼 27頁。

6. Q：報告內容有多處錯誤，請自行修正。例：第 14頁。

A：已經全部檢查完成並修改。

方文聘老師：

7. Q：英文摘要格式建議修正。

A：頁碼 ii 頁，已經修正完成。

8. Q：各段建議除了條列，需再加詳細說明。

A：已經加上說明文字。

9. Q：建議組別可有介面編修。

Ａ：我們有建立管理者頁面，可使用管理者來做修改組別，如開放給一般使用者自

行修改，怕會有人亂改組別名稱，所以經過討論決定全部將由管理員做修改。

46

附錄二 Android 程式碼

登入畫面的程式碼

loginMain.java

//3.0以後的版本連接上網路需要加以下程式碼

StrictMode.setThreadPolicy(new

StrictMode.ThreadPolicy.Builder().detectDiskReads().detectDiskWrites().detectNetwork().pe

naltyLog().build());

StrictMode.setVmPolicy(new

StrictMode.VmPolicy.Builder().detectLeakedSqlLiteObjects().detectLeakedSqlLiteObjects().

penaltyLog().penaltyDeath().build());

login_b1.setOnClickListener(new OnClickListener(){

public void onClick(View v) {

// 將以宣告過的URL字串還有登入畫面上讓使用者輸入帳號密碼的文字框用

AppEND串接起來

final String url = new StringBuffer(server_addr).append("?ID=")

.append(id.getText().toString().trim())

.append("&Pwd=")

.append(pwd.getText().toString().trim()).toString();

//宣告兩個字串用來檢查兩個文字框是否為空的若帳號或密碼有一個為空那登入畫

面下方的textview則會顯示帳密輸入錯誤的字樣

final String idcheck，pwdcheck;

idcheck=id.getText().toString().trim();

pwdcheck=pwd.getText().toString().trim();

if (idcheck.isEmpty() || pwdcheck.isEmpty()){

ttt.setText("帳密輸入錯誤!!");

}

else{

try{

//初始化HttpClient

HttpClient httpClient = new DefaultHttpClient();

//建立HttpGet物件將要請求的URL放入HttpGet物件中

HttpGet httpGetRequest = new HttpGet(url);

//使用httpClient.execute方法發送HTTPGET請求且傳回HttpResponse物件

47

HttpResponse response =httpClient.execute(httpGetRequest);

//判斷請求回應狀態碼狀態碼若為200表示服務端成功回應了使用者端的請求

if(HttpStatus.SC_OK == response.getStatusLine().getStatusCode())

{

//使用getEntity方法獲得回傳結果指定給字串responseMsg

String responseMsg = EntityUtils.toString(response.getEntity());

//使用網頁做登入的動作若是登入成功會顯示login success的文字

//在responseMsg搜尋login success ，responseMsg字串從0開始尋找

int b = responseMsg.indexOf("login success");

//t.setText("b="+b);

//搜尋的結果是會在畫面原始碼的127的位置上搜尋到login success的文字若B等於127

那就表示已成功登入了

if( b==127 ){

Toast.makeText(getApplicationContext()， "成功登入"，Toast.LENGTH_LONG) .show();

Intent intent_login = new Intent();

intent_login.setClass(loginMain.this，Category.class);

loginMain.this.finish();

startActivity(intent_login);

}

}

else

{

Toast.makeText(getApplicationContext()， "登入失敗"，

Toast.LENGTH_LONG) .show();

}

}catch (Exception e)

{

}

}

}

});

login_b2.setOnClickListener(new Button.OnClickListener(){


Intent intent_login = new Intent();

intent_login.setClass(loginMain.this，Android_scoringActivity.class);

48

startActivity(intent_login);

loginMain.this.finish();

}

});

}

//在離開畫面時將輸入帳號密碼的文字框儲存在SharedPreferences的物件內

protected void onStop(){

super.onStop();

SharedPreferences settings = getSharedPreferences(SETTING_FILE，0);

settings.edit()

.putString(save_ID，id.getText().toString())

.putString(save_Pwd，pwd.getText().toString())

.commit();

}

選擇組別畫面的程式碼

Category.java

//取得先前SharedPreferences所輸入的帳號指定給字串 save_id


String save_id = settings.getString(save_ID， cc);

ct =(TextView)findViewById(R.id.ct);

//ct.setText(save_id);

s1_button1 = (ImageButton) findViewById(R.id.s1_button1);

s1_button2 ...

//取得HttpPost 建立httppost的物件將字串C的網址放入

HttpPost httppost = new HttpPost(c);

try {

//用DefaultHttpClient().execute方法把回應的HttpResponse 指定給httpResponse

HttpResponse httpResponse = new DefaultHttpClient().execute(httppost);


if(httpResponse.getStatusLine().getStatusCode()==200)

{

49

//使用getEntity方法獲得回傳結果指定給字串responseMsg

String responseMsg = EntityUtils.toString(httpResponse.getEntity());

//在字串responseMsg用indexOf方法搜尋save_id 在篩選出此帳號的可評類別

String a=responseMsg.substring(responseMsg.indexOf(save_id));

String a1 =a.substring(a.indexOf("<td>"));

a1=a1.substring(4，a1.indexOf("</td>"));

ct.setText(a1);//把篩選出的結果放置TEXTVIEW

int ai=Integer.parseInt(a1);//做字串轉數字的轉換

switch (ai)

{

case 1 :

//若為1 表示只可評嵌入式類其他兩類的按鈕則會做INVISIBLE隱藏的動作

ct.setText("01");

s1_button2.setVisibility(View.INVISIBLE);

s1_button3.setVisibility(View.INVISIBLE);

break;

case 2 :

.....

}

}

else

{

Toast.makeText(getApplicationContext()，

"error:"+httpResponse.getStatusLine().toString()，Toast.LENGTH_SHORT) .show();

}

}catch(ClientProtocolException e)

{

e.printStackTrace();

}

catch(IOException e)

{


}

50

進入配分畫面的程式碼

Seekbar.java

public void onCreate(Bundle savedInstanceState)

{

super.onCreate(savedInstanceState);

setContentView(R.layout.seek);

seek1_1=(SeekBar)findViewById(R.id.seekBar1_1);

宣告...

//取得先前在此畫面所配置的配分


String Seek1_1_text =settings.getString(seek1_text， bb);




// 把字串Seek1_1_text等4項轉為整數

tv1=Integer.parseInt(Seek1_1_text);




//將字串Seek1_1_text等4項配分放入TEXTVIEW內

seek_tv1.setText(Seek1_1_text);




//按鈕"next"的動作

ImageButton seekbar_b2 =(ImageButton)findViewById(R.id.seek_b2);

seekbar_b2.setOnClickListener(new Button.OnClickListener()

{

public void onClick(View v)

{

51

//配分需剛好加起來為一百

if(tv1+tv2+tv3+tv4==100)

{

TextView seek_tv1 =(TextView)findViewById(R.id.seek_tv1);





String save_id = settings.getString(save_ID， cc);

Intent intent_seekbar_b2 = new Intent();

intent_seekbar_b2.setClass(seekbar.this，f1.class);

//建立HttpPost的物件取名為httppost 將網址放入物件內

HttpPost httppost = new HttpPost(addr_update_p);

//使用post連線需用NameValuePair[]陣列儲存

List <NameValuePair> params = new ArrayList <NameValuePair>();

//添加要傳遞的參數

params.add(new BasicNameValuePair("ID"，save_id));

params.add(new BasicNameValuePair("Category"，"01"));

params.add(new BasicNameValuePair("Exhibition"，

seek_tv1.getText().toString().trim()));...

try {

//設定Httppost請求參數

httppost.setEntity(new UrlEncodedFormEntity(params， HTTP.UTF_8));

//使用execute方法發送HTTPPOST請求並傳回HttpResponse物件



{


Toast.makeText(getApplicationContext()， "成功傳送配分至網頁資料庫內

",Toast.LENGTH_LONG) .show();

}else{

Toast.makeText(getApplicationContext(),"error:"+httpResponse.getStatusLine().toStr

ing(),Toast.LENGTH_SHORT) .show();}

}catch...

52

//宣告一個Bundle物件將要傳送的值放入

Bundle bundle_seekbar_b2 = new Bundle();

bundle_seekbar_b2.putString("key_seek_tv1",seek_tv1.getText().toString());...

//接著將Bundle放到剛才宣告的Intent內

intent_seekbar_b2.putExtras(bundle_seekbar_b2);

startActivity(intent_seekbar_b2);

seekbar.this.finish();

}else{

//若沒有剛好四項配分達到一百則會跳出警告視窗Builder

Builder builder=new Builder(seekbar.this);

builder.setTitle("警告!");// builder視窗的小標題

// builder視窗的內文

builder.setMessage("目前四項分數加總未剛好達到一百，請重新配分。");

builder.setPositiveButton("關閉", null); // builder視窗的按鈕

builder.show();

}}});

//按鈕"回上頁"

ImageButton seek_b1 = (ImageButton) findViewById(R.id.seek_b1);

seek_b1.setOnClickListener(new Button.OnClickListener()

{.... }});

setupViewComponent();

}

//SEEKBAR的內容

private void setupViewComponent(){

seek1_1=(SeekBar)findViewById(R.id.seekBar1_1);

...

seek1_1.setOnSeekBarChangeListener(seekBarOnChangeLis1);...}

//監聽SEEKBAR1的動作再轉成字串並放在對應的TEXTVIEW內

SeekBar.OnSeekBarChangeListener seekBarOnChangeLis1 = new

SeekBar.OnSeekBarChangeListener() {

public void onProgressChanged(SeekBar seekBar，

int progress, boolean fromUser) {

seek_tv1.setText(Integer.toString(progress));

String seek_tv1_a = Integer.toString(progress);

tv1 = Integer.parseInt(seek_tv1_a);

}

public void onStartTrackingTouch(SeekBar seekBar) {

53

}

public void onStopTrackingTouch(SeekBar seekBar) {

}

};....

//在此畫面停止時將四項配分儲存


super.onStop();


....

SharedPreferences settings = getSharedPreferences(SETTING_FILE,0);

settings.edit()

.putString(seek1_text, seek_tv1.getText().toString())

...

.commit();

}

評分的程式碼

f2.java

public void onCreate(Bundle savedInstanceState)

{


setContentView(R.layout.f2);

f2_button1 = (ImageButton)findViewById(R.id.f2_b1);...

//取得上一頁所放入Bundle內的東西指定給字串

Bundle bundle_seekbar2_b2 =this.getIntent().getExtras();

Seek1_text = bundle_seekbar2_b2.getString("key_seek2_tv1");...

TextView f2_tv01=(TextView)findViewById(R.id.f2_tv01);...

f2_tv01.setText(Seek1_text);...

//取得SharedPreferences內的字串放到畫面上對應的TextView


String save_id = settings.getString(save_ID, cc);

TextView TT_ID=(TextView)findViewById(R.id.TT_SNO2);

TT_ID.setText(save_id);

String f2team01_et1 =settings.getString(f2_Team01_et1, cc); ...

EditText f2_team01_et1 =(EditText)findViewById(R.id.f2_team01_et1);..

54

f2_team01_et1.setText(f2team01_et1);...

//按鈕count 按下時的動作

f2_button2.setOnClickListener(new Button.OnClickListener(){


TextView f2_tv01=(TextView)findViewById(R.id.f2_tv01);...

//把四項配分除於一百在指定給double變數

double score1 = Float.parseFloat(f2_tv01.getText().toString())/100;




//把一組的四項分數放到FLOAT變數內

float team01_1 = Float.parseFloat(f2_team01_et1.getText().toString());




// 宣告一個NumberFormat物件取名為nf 括號內為小數點個數

NumberFormat nf = NumberFormat.getInstance();

nf.setMaximumFractionDigits(2);

nf.setMinimumFractionDigits(2);

//做分數的運算

double team01_score

=((score1*team01_1)+(score2*team01_2)+(score3*team01_3)+(score4*team01_4)) ;

f2_team01_score.setText(String.valueOf(nf.format(team01_score)));...

});

//按下傳送分數的按鈕

f2_button4.setOnClickListener(new Button.OnClickListener(){


String f2_T1_1="f2_t1_1";...

//將目前評分的文字框全部寫入到SharedPreferences內


EditText f2_team01_et1 =(EditText)findViewById(R.id.f2_team01_et1);...

settings.edit()

.putString(f2_T1_1，f2_team01_et1.getText().toString())...

.commit();

String save_id = settings.getString(save_ID, cc);

String f2_t1_1 =settings.getString(f2_T1_1, cc); ...

55

TextView f2_test=(TextView)findViewById(R.id.f2_test);

//把所有分數放入字串陣列內

String[][] arr2={{f2_t1_1,f2_t1_2,f2_t1_3,f2_t1_4},

...};

//宣告與字串陣列相同 size之FLOAT陣列

float arr22[][] = new float [9][4]; int z,j,s = 0;

for (z=0; z<9; z++)

{

for(j=0;j<4;j++)

{

arr22[z][j] = Float.parseFloat(arr2[z][j].toString());

//若陣列內有小於零或大於一百的分數會跳出警告視窗

if((arr22[z][j]<0) || (arr22[z][j]>100))

{

Builder builder=new Builder(f2.this);

builder.setTitle("警告!");

builder.setMessage("目前有分數大於一百或是小於零，請重新檢查。");

builder.setPositiveButton("關閉"， null);

builder.show();

s=1;//將S設為1 在跳出

break;

}else{

}}}

if(s==0){ //建立post連線

HttpPost httppost = new HttpPost(addr_update);

//post 運作需用NameValuePair[]陣列儲存

List <NameValuePair> params = new ArrayList <NameValuePair>();

// 添加要傳遞的參數

int y=0;

for(int i=1;i<=9;i++)

{

params.add(new BasicNameValuePair("ID",save_id));

params.add(new

BasicNameValuePair("TeamNo",String.valueOf(1001002000+i)));

params.add(new BasicNameValuePair("Category","02"));

params.add(new BasicNameValuePair("Exhibition",Seek1_text));

params.add(new BasicNameValuePair("Document",Seek2_text));

params.add(new BasicNameValuePair("Speak",Seek3_text));

56

params.add(new BasicNameValuePair("Achievement"，Seek4_text));

//i-1是因為陣列從0開始

y=0;

params.add(new BasicNameValuePair("ExhibitionScore",arr2[i-1][y]));

params.add(new BasicNameValuePair("DocumentScore",arr2[i-1][y+1]));

params.add(new BasicNameValuePair("SpeakScore",arr2[i-1][y+2]));

params.add(new BasicNameValuePair("AchievementScore",arr2[i-1][y+3]));

try {

//使用HTTPPOST連線將params傳送出去

httppost.setEntity(new UrlEncodedFormEntity(params， HTTP.UTF_8));



{


}else{

Toast.makeText(getApplicationContext(),

"error:"+httpResponse.getStatusLine().toString(),Toast.LENGTH_SHORT) .show();

}

}catch(ClientProtocolException e) {e.printStackTrace();}

catch(IOException e) {e.printStackTrace();}}

Toast.makeText(getApplicationContext(), "成功傳送分數至網頁資料庫內

",Toast.LENGTH_LONG) .show();

}}});}

@Override

//也是將所有評分的文字框儲存


super.onStop();

EditText f2_team01_et1 =(EditText)findViewById(R.id.f2_team01_et1);

...


settings.edit()

.putString(f2_Team01_et1， f2_team01_et1.getText().toString())

...

.commit();

}

57

召集人版本的查看畫面程式碼

look1.java

public void onCreate(Bundle savedInstanceState){


setContentView(R.layout.look);

look1_btn=(Button)findViewById(R.id.look1_btn);….

try{

//初始化HttpClient

HttpClient httpclient=new DefaultHttpClient();

//建立HttpGet物件將要請求的URL放入HttpGet物件中

HttpGet httpGetRequeest=new HttpGet(addr);

//使用httpClient.execute方法發送HTTPGET請求且傳回HttpResponse物件

HttpResponse response=httpclient.execute(httpGetRequeest);


if(HttpStatus.SC_OK==response.getStatusLine().getStatusCode())

{

//使用getEntity方法獲得回傳結果指定給字串responseMsg 此處要抓取中文會有亂碼

所以在後面加上編碼

String responsemsg=EntityUtils.toString(response.getEntity()，"Big5");

//篩選responsemsg將所有評審名稱抓出

String a1 = responsemsg.substring(responsemsg.indexOf("<td width=15%>"));

a1=a1.substring(a1.indexOf(">"));

String a1_1 =a1.substring(1，a1.indexOf("</td>"));

look_tt2.setText(a1_1);….

//組別1

String t1 = a5.substring(a5.indexOf("<tr valign=middle style=font-size:20

height=50><td>"));

t1=t1.substring(t1.indexOf("<td>"));

String t1_1 = t1.substring(4,t1.indexOf("</td>"));

tt1_1.setText(t1_1);…

}else{

look_tt1.setText("error");

}

}catch(ClientProtocolException e){

58


}catch(IOException e){e.printStackTrace();}

look1_btn.setOnClickListener(new Button.OnClickListener(){


Intent intent_look1_btn = new Intent();

intent_look1_btn.setClass(look1.this, category.class);

startActivity(intent_look1_btn);

look1.this.finish();

}});

59

附錄三工作分配表

表附錄一工作分配表

藍妮羅光評黃靖超張育瑋蕭誌杰

資料蒐集 V V V V

教育訓練 V V V V

撰寫計劃書 V V V V

資料庫管理 V V

PHP-會員系統 V V

PHP-投票系統 V V

PHP-評分系統 V V

PHP-上傳系統 V V

PHP-小組頁面 V V

PHP-主辦單位頁面 V V

Android-程式撰寫 V

撰寫期中報告 V V V

撰寫期末報告 V V V

整合測試 V V V V

成果報告 V V V V V

60

附錄四甘特圖

工作項目

/月份

3

月

4

月

5

月

6

月

7

月

8

月

9

月

10月 11月 12月

資料蒐集

教育訓練

撰寫計劃書

PHP

網站架構

資料庫

Android

App

整合測試

成果報告

圖附錄一甘特圖

61

附錄五工作進度表


101年 3月專題工作進度表

專題名稱 Android 評分與投票系統日期 3/30

項次工作進度負責組員

1

工作項目資料蒐集

藍妮

羅光評

黃靖超

蕭誌杰

預定日期起迄 101年 3月 1日至 101年 3月 10日

目前進度或問

題進度：收集相關資料，並整理。

解決方案

2

工作項目教育訓練

藍妮

羅光評

黃靖超

蕭誌杰

預定日期起迄 101年 3月 11 日至 101年 3月 25日

目前進度或問

題進度：教育訓練並與老師討論。

解決方案

3

工作項目撰寫計畫書

藍妮

羅光評

黃靖超

蕭誌杰


目前進度或問

題進度：撰寫期中的計畫書。

解決方案

指導老師簽名

62


101年 4專題工作進度表



1

工作項目再次與老師進行教育訓練

藍妮

羅光評

黃靖超

蕭誌杰

預定日期起迄 101年 4 月 1 日至 101年 4 月 15日

目前進度或問

題進度：再次與老師進行教育訓練。

解決方案

2

工作項目 PHP 網站架構資料庫

藍妮

羅光評

黃靖超

蕭誌杰

預定日期起迄 101年 4 月 16日至 101 年 4月 30日

目前進度或問

題進度：PHP 基本練習。

解決方案尋找 PHP 相關書籍並且實際練習。

3

工作項目

預定日期起迄

目前進度或問

題

解決方案

指導老師簽名

63





1

工作項目 PHP 網站架構資料庫

蕭誌杰

黃靖超

預定日期起迄 101年 5 月 1 日至 101年 5 月 15日

目前進度或問

題 PHP+MySQL無法連接到資料庫。

解決方案書名：PHP 與MySQL 網頁設計範例教本，參考此書

的資料庫範例以及詢問老師解決方案。

2

工作項目 Android 評分版

藍妮


目前進度或問

題可計算成績，App畫面轉成橫的，Layout 會跑掉。

解決方案參考書籍，書名為：Google!Android 3 手機應用程式設

計入門，使用此書的範例來測試。

3

工作項目

預定日期起迄

目前進度或問

題

解決方案

指導老師簽名

64





1

工作項目網頁製作-會員登入

羅光評

蕭誌杰


目前進度或問

題取得網頁抓資料表Member權限問題。

解決方案參考課本範例，使用 Sesseion 紀錄登入權限。

2


羅光評

蕭誌杰


目前進度或問

題 Session 自動抓取使用者名稱

解決方案參考課本 Session 的範例。

3

工作項目

預定日期起迄

目前進度或問

題

解決方案

指導老師簽名

65





1


蕭誌杰


目前進度或問

題

進度：使用 Session 記錄登入的會員，並在網頁右上方

顯示會員登入名稱(資料庫欄位 Name)。

問題：登入會員權限判斷。

解決方案製做跳轉頁面(home1.php)，再另用 switch case判斷權

限，再跳轉到各自頁面。

2

工作項目網頁製作-投票

羅光評

蕭誌杰


目前進度或問

題

進度：使用資料庫抓取組別名稱，投完票後回傳至資

料庫。

問題：每類別只能投一票，必須判斷是否有重複投票。

解決方案利用判斷語法判斷資料庫欄位是否為空，投票過後想

再次投票將會跳出彈跳視窗提醒。

3

工作項目

預定日期起迄

目前進度或問

題

解決方案

指導老師簽名

66





1

工作項目網頁製作-小組頁面-上傳

羅光評

蕭誌杰


目前進度或問

題可以上傳檔案，但是格式跟檔案大小無法限制。

解決方案更改 php.ini，並上網查詢範例且詢問老師。

2

工作項目網頁製作-小組頁面-下傳

羅光評

蕭誌杰


目前進度或問

題超連結圖案有出來，但是無法下載。

解決方案重複檢查程式語法，並檢查超連結語法位置。

3

工作項目

預定日期起迄

目前進度或問

題

解決方案

指導老師簽名

67





1

工作項目手機 App製作

藍妮

預定日期起迄 101年 09月 01日至 101 年 9月 30日

目前進度或問

題

目前更新的組別代碼是寫固定的，如何在按下 button

時，抓取須更新的組別代碼在更新。

解決方案改成用迴圈跑所有組別代碼，做更新的動作。

2

工作項目網頁製作-評分-配分

羅光評

預定日期起迄 101年 09月 01日至 101 年 9月 30日

目前進度或問

題

配分無法達到每項配分方式，但是可以 4項相加剛好

等於 100。

解決方案語法多 4項判斷式。

3

工作項目

預定日期起迄

目前進度或問

題

解決方案

指導老師簽名

68





1

工作項目 Android

藍妮


目前進度或問

題組別代碼有 1至 10組，如何一次更新

解決方案組別代碼 1至 10組，改成使用迴圈做更新的動作。

2


藍妮


目前進度或問

題使用網頁接收手機端傳送的參數。

解決方案

先寫 PHP 網頁接收端，簡單印出傳送到的參數，確定

無誤後再把資料用 SQL語法更新 or新增至網頁資料

庫。

3

工作項目網頁製作-評分-評分

羅光評

蕭誌杰


目前進度或問

題

可以評分與配分相乘，抓到總成績並寫入資料庫，但

是配分可以小於 0大於 100

解決方案參考 PHP 與MySQL網頁設計範例教本，多個條件判

斷式。

指導老師簽名

69





1


藍妮


目前進度或問

題

原本是在 p1.java內一次更新兩筆資料，但資料量大不

容易撰寫。

解決方案區分配分表與分數表，去做各自的新增或更新。

2


藍妮


目前進度或問

題手機登入端，即使帳號亂打也可進到下個頁面。

解決方案

連接至 PHP 頁面時，先將網頁所有字串取出，用字串

搜尋去比對回傳內容，index of去取出正確內容位址，

用 if判斷是否有成功搜尋到，如有則成功跳至下一頁。

3

工作項目網頁製作-主辦單位版本

羅光評

蕭誌杰


目前進度或問

題

從資料庫抓取成績計算並扣掉評審自己帶的組別成

績。

另外排名也自動排名並且寫入資料庫裡。

解決方案

與老師討論並參考 PHP 與 MySQL網頁設計範例教本

書籍跟網路範例，使用 select 和 update語法來達到效

果。

指導老師簽名

70




1

工作項目網頁製作-修改成果展意見

羅光評


目前進度或問

題製作管理員介面及帳號。

解決方案與老師討論並參考 PHP 與 MySQL網頁設計範例教本

書籍跟網路範例。

2

工作項目網站及 Android App 測試

藍妮

蕭誌杰


目前進度或問

題

網站：登入不同使用者測試各項功能。

Android：實際把 App放到手機上做測試，看功能完不

完善。

解決方案不斷重複測試檢查有沒有問題。

3

工作項目網頁製作-主辦單位版本

藍妮

蕭誌杰


目前進度或問

題修改期末結案報告。

解決方案修改後請老師檢查，並且加以更改。

指導老師簽名

71

附錄六自傳

藍妮的自傳

一、家庭背景

出生於宜蘭，風景優美，鄉下純樸，讓我時常保持清境及樂觀的態度。家裡有五人，

父親從事建築工程，監督所有進度，是整個工程的負責人，時常需要加班，或是處理很

多細節。我很佩服父親，因為要管理所有現場進度，還有一些突發狀況，會培養許多處

理事情的態度跟能力。即使工作繁忙，父親也會進修一些相關的能力，讓我了解在工作

之餘也是要努力充實自己，以應付工作的內容。母親則是家管，家裡所有打點都是母親

在負責，在有限的金錢內滿足家庭需求，又或者是每天負責洗衣煮飯的工作，也算是很

盡責。我也時常幫忙家裡，學習各種生活技能。家中還有一個哥哥跟弟弟，哥哥是國立

澎湖科大出身，出社會後在廣達擔任測試工程師，累積一兩年經驗後，跳槽到和碩。從

小哥哥就影響著我，他大學主修資訊工程。或許是這樣耳濡目染下，我就讀大學時也選

擇了資訊工程，兩人也會互相交流，提升自我。弟弟目前才讀國中，但是卻有著不像年

齡的脾氣與態度，雖然嘴巴壞，但是心地善良。也在老師的支持下擔任班長一職，成績

也名列前茅，是我驕傲的弟弟，而且有個幾乎不生氣的性格。我小時候脾氣不佳，會為

了小事生氣，也時常欺負弟弟，但是他都不會生氣，很穩重。也讓我知道管理情緒的重

要，所以每個人都有我能學習的優點，提醒我時時刻刻要讓自己更好、更完善。

二、個人特質

我個人其實有蠻多不足的地方，性格較為頑固，對於自己認為正確的事情，會很堅

持，但也不會不知變通。適合的表現適當的態度，學習表現認真的態度，該做的是表現

負責的態度，人際上表現和善的態度。很多事情是無法避免的，那就表示自己自身的心

態是非常重要的，事情不會只有一個面向，用什麼角度去觀察，就顯現什麼。所以保持

樂觀積極正面是我時常要求自己的，或許還無法做到完美，像是遇到挫折，遇到難過的

事，也是會沮喪一下。但如何讓自己振作，用正向的想法去迎接挑戰，正是我一直要求

自己保持的心態。

三、求學歷程

高中：

進入國立羅東高工的電子科就讀，為了畢業，有去考一張工業電子丙級。在準備的

過程中，我發現自己沒有對此科系有多少興趣，所以在選填志願時，選擇了目前很有淺

力的科系-資訊工程系。

大學：

考取私立元培科技大學，一上大學也是沒花太多時間念書，所以一年級二年級成績

72

一直都不理想，到了三年級才有些起色。從班上三十幾名到第二名，其中所花的辛苦，

我很清楚，才明白到了前頭，付出的努力一定要比別人多上許多。這時我才察覺，自己

所要的目標是什麼，且知道自己比別人慢很多步，但我不一直拘泥於過去。以前一直渾

渾噩噩的生活，到現在為了專題、為了升學，我覺得生活過得踏實，每天都為了自己而

付出努力。

大三製作專題，是使用 Eclipse來撰寫 Android 的程式，從許多困難及挑戰中，才讓

我對 Android 產生興趣，也樂於跟老師討論。

四、求學態度

大四有一堂課叫做資訊工程實務，由系上的方文聘老師來教課，老師要求我們兩三

周就要製作一個小專題，分組由老師隨機分配。一開始其實很不能接受這樣的分法，因

為組內總有不想做事的人，但是除了專業知識之外，如何跟夥伴合作也是必要學習的一

門課。

我擔任專題的組長，也負責撰寫 Android 的程式，當中遇到很多困難，我會先自己

查找資料，還是無法解決，才會詢問組員或是老師。也從中了解到如何恰當的表達自己

的想法跟問題，而且要虛心接受批評，反省自身，在從中發掘解決辦法，激勵自己達成。

以前一直覺得程式很枯燥乏味，但從製作專題的過程中，有遇到難題，解決問題的成就

感是我一直持續下去的動力。

五、自我期許

想繼續升學，念研究所的最大主因，是想再提升自我，充實專業知識跟技術。希望

在求學過程中，面對迎來的挑戰，能夠不膽怯，且勇敢挑戰，一步步讓自己達到目標，

並且補足自己的專業知識，能夠面對未來的求職。

73

黃靖超的自傳

我叫『黃靖超』，出生於濃厚客家文化的苗栗縣，客家人的最大特色就是勤儉，能

夠吃苦耐勞，因此身為客家人的我，也秉持著這樣的客家精神。家中有爺爺、奶奶、父

親是送貨員、母親在電子廠上班，哥哥在保來得公司上班，而我現在就讀於元培科技大

學。家境普通，生活和樂，母親從小就教導我們要好好讀書，學有所長，將來才有能力

在社會上與人競爭。很感謝母親對我的養育之恩，並期待自己不會辜負父母的期待。

從小到高中，曾擔任許多幹部，例如班長、風紀、體育股長等等，其中最喜歡的就

是體育股長這個幹部了，因為我本身很喜歡運動，帶領全班做體操、拉筋會令我很驕傲。

在社團方面，則是參加了籃球社，社團參予也使得讓我擴展了許多人際關係，至於在課

業方面，從小母親便讓我去上一些英語課程，使我對英語慢慢起了興趣，也讓我有了一

些英語基礎，所以每次上英語課我都抱著愉快的心情去學習。

我會積極進取，虛心學習，希望藉由學校的師資教育，培養多重的技能，因應現在

社會的需求，因此我需要多多充實更多新的知識，邁向另一個領域。

74

羅光評的自傳

我叫羅光評，出生於桃園縣，家中成員有奶奶、爸爸、媽媽、哥哥還有照顧奶奶的

看護，在家中我排行老么，我的個性比較隨和獨立自主，爸爸和媽媽都在工廠上班，雖

然天天都加班很忙，但對於我和哥哥的照顧還是無微不至，從小到大爸爸對於我們的教

育方式很自由民主，做什麼事都會在旁邊支持我們也會適當的給予我意見，我平常最喜

愛的休閒嗜好是舞蹈，舞蹈能夠讓一整天所有的壓力全部都發洩在舞蹈上，它能夠使我

心情愉快，最重要的是它能夠讓我學習到對舞者的尊重。然而，我有個目標能夠在目前

的階段上站上世界舞台上發光發熱。

目前就讀於元培科技大學資訊工程系，讀本科系讓我學習到很多本科系的專業知識，

以及編寫程式，思考的方式也跟著不一樣。

未來畢業後想出國到國外打工，遊學，看看外面的世界順便充實自我。在求學的過

程中我成績一路都平平，在小學時曾擔任衛生股長，負責管理班上的環境整潔因此讓我

學習到更多的東西，讓我更有責任心去對待每件事情。

75

張育瑋的自傳

一、家庭背景:

我的名字是張育瑋，出生於苗栗縣頭份鎮，家中只有兩個小孩，就是我跟一個大我

一歲的哥哥，父母親是從事商業，從小就生活在一個幸福的家庭，目前我跟哥哥都在就

讀大學四年級。

二、成長過程:

從小我就是一個比較活潑頑皮的小孩，國小國中幾乎都是在玩樂的狀態下渡過，不

過到了高中才慢慢變得成熟，了解升學的重要，我讀的是電子科，高中時期就開始接觸

比較多有關於電子方面的東西，學習焊接電路板跟電子學還有數位邏輯，而在高中的時

候我也考到人生的第一張證照，是電腦硬體裝修丙級，後來在高二的時候也考到了電腦

硬體裝修乙級，也讓我順利推甄上元培，在大學我學到更多有關電腦的資訊電子技術，

也考取了兩張微軟的證照。

三、未來計畫

在人生的路上就是要不斷的學習，多培養自己的專長，態度方面也非常重要，父親

也常常跟我說態度決定一切，還有待人處事的道理，不管面對任何人都要尊重，讓別人

感受到我是個好相處的人，對於溝通方面也會也很大的幫助，現在的社會非常的競爭，

所以要每天得充實自我，大學畢業後希望能進入到自己能接受的職場上班。

76

蕭誌杰的自傳

我叫蕭誌杰，出生於苗栗縣竹南鎮，我家人口簡單，父親平常工作是木工-工頭，

母親則是在濾心公司上班，家裡的小孩還有個哥哥跟弟弟，哥哥目前在服務國家(當兵)，

弟弟則跟我一樣還在讀書，從小父親對我們的教育方式很特別，如同朋友般，所以溝通

上並沒有代溝，家裡充滿了和諧的氣氛。

從小我就不是個很會讀書的小孩，凡事都只要求及格就好，所以在成績上並不是很

理想，高中開始讀的學校都是以私立的為主，但是父親並不會管太多，總是說有認真就

好，但是高 3開始因為有了升學壓力，開始認真的學習，並且也考取了電腦硬體裝修乙

級技術士，因為高 3每天留下來晚自習，使我的成績突飛猛進，班排名從二十幾名進升

到了前五名，也順利考取了大學，大學成績一開始也不是很理想，後來慢慢習關大學生

活後，成績也慢慢的愈來愈好。

我是個個性倔強的人，凡是只要訂立目標就會想辦法去完成，或許這樣有好有壞，

但是以目前來看壞的部分大於好的，平常的我話也特別多，好像隨便來個人都可以有話

題聊，或許這樣防衛心比較低，也比較容易受到小人設計。

大學畢業後會選擇家裡附近的竹南科學園區附近上班，我希望能夠進入資訊產業相

關工作，並且需要加強一下自己的英文能力，包括聽、說、讀、寫，這些我都非常的薄

弱，另外還會對自己在大學所學的知識進行更進一步的了解。

Documents

元培科技大學 - ir.lib.ypu.edu.twir.lib.ypu.edu.tw/bitstream/310904600Q/7328/2/... · 多的資料與方向，感謝教授給予我們的指導，過程中遇到的瓶頸和疑問時，老師