資訊管理系

實務專題期末報告

台中旅遊 APP

指導教授：陳健忠 教授

組員名單：張維銘 998C111

黃苡榕 998C132

詹秉岳 998C066

劉思宏 998C024

中 華 民 國 1 0 3 年 5 月

嶺東科技大學

資訊管理系

台中旅遊A

PP

中華民國一○三年五月

誌 謝

本專題能順利完成，首先由衷的感謝專題指導老師陳健忠老師，

感謝他在專題寫作期間的細心教誨與指導，令學生終身受益匪淺。專

題製作中遇到一些困難，指導老師認真地、有耐心地的與組員多次討

論，才能順利的將專題完成，對於陳健忠老師，我們有無限的感激。

謝謝陳健忠老師這些日子的指導。

最後，感謝在專題製作期間曾經幫助過我們的所有老師，以及口

詴委員對我們的鞭策與指正，讓我們的專題能順利的完成，在此本組

特別的感謝，僅致上最高的敬意及謝意。

張維銘 詹秉岳 劉思宏 黃苡榕

謹誌

中華民國 103年 5月於嶺東

I

摘 要

本專題以開發關於旅遊方面的 APP 程式為主，因應目前旅遊與背包客的風氣

盛行，許多人都會利用空閒時間到各地遊玩或出國旅行，而用手機瀏覽旅遊資訊

與地方介紹，會讓旅遊的人更加便利。而旅遊程式除了可以查詢景點和美食外，

路線規劃也是重要的功能之一，本專題利用地圖導航定位功能讓使用者知曉目前

所在位置與附近的美食或景點，和增加景點附近的住宿資訊讓使用者參考選擇。

利用 3D 影像、AR(Augmented Reality)擴增實境來增加圖像的真實感，而 AR 擴增

實境是在螢幕上把虛擬世界套在現實世界中並進行互動，這套技術是為了讓使用

者有不一樣的感受，提供軟體趣味性。

關鍵詞：APP，3D 影像，擴增實境

II

目 錄

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

目 錄 ................................................................................................ II

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

圖目錄 .................................................................................................... V

第壹章 緒論 ........................................................................................... 1

1-1.研究動機 ....................................................................................... 1

1-2.研究目的 ....................................................................................... 2

第貳章 文獻回顧與探討 ....................................................................... 3

2-1.APP 功能比較 ............................................................................... 3

2-2.Eclipse ........................................................................................... 4

2-3.程式語言：Java ............................................................................ 5

2-4.AR 擴增實境 ................................................................................. 6

2-4-1.開發 AR 功能性介紹 ....................................................... 6

2-4-2.Unity(遊戲引擎) ............................................................... 6

2-4-3.Vuforia .............................................................................. 7

2-4-4.AR 擴增實境分類 ............................................................ 8

III

第參章 研究方法 ................................................................................. 10

3-1 研究流程 ..................................................................................... 10

3-2.系統架構 .................................................................................... 11

3-3.相關資料 ..................................................................................... 12

3-4.編寫 Android 程式 ...................................................................... 12

3-5.AR 建置 ....................................................................................... 13

(1)AR 卡建置安裝流程 ........................................................... 13

(2)AR 手機建置安裝流程 ....................................................... 15

3-6.美工圖案繪製 ............................................................................. 16

3-6-1.繪圖流程 ......................................................................... 16

3-7.測詴系統 ..................................................................................... 18

第肆章 系統實作 ................................................................................. 19

第伍章 結論 ......................................................................................... 36

研究限制 ............................................................................................. 36

參考文獻 ............................................................................................... 37

附錄 A ................................................................................................... 38

IV

表目錄

表 2-1.APP 功能比較圖 ......................................................................... 3

表 2-2.兩種擴增實境介紹 ...................................................................... 8

表 3-1.資料表 ........................................................................................ 12

表 A-1.java 檔對應功能表 ................................................................... 39

表 A-2.xml 檔對應功能表 ................................................................... 40

V

圖目錄

圖 2-1. eclipse 圖示................................................................................. 4

圖 2-2. java 圖示 ..................................................................................... 5

圖 2-3.Unity 圖示.................................................................................... 6

圖 2-4.vuforia 圖示 ................................................................................. 7

圖 2-5.開發者和 Vuforia 帄台分工圖 ................................................... 8

圖 3-1.研究流程圖 ................................................................................ 10

圖 3-2.系統架構圖 ................................................................................ 11

圖 3-3.2D 圖科博館 .............................................................................. 13

圖 3-4.2D 圖湖心亭 .............................................................................. 13

圖 3-5.3D 圖湖心亭 .............................................................................. 14

圖 3-6.AR 建置 ..................................................................................... 14

圖 3-7.AR 建置流程 ............................................................................. 15

圖 3-8.Photo Shop CS5 和 Illustrator CS5 圖示 .................................. 16

圖 3-9.繪製背景圖 ................................................................................ 17

圖 3-10.繪製人物圖 .............................................................................. 17

圖 3-10.繪製人物圖 .............................................................................. 17

VI

圖 4-1.台中旅遊 Go 程式 ..................................................................... 19

圖 4-2.台中旅遊 Go 首頁 ..................................................................... 20

圖 4-3.台中旅遊 GO 主頁面 ................................................................ 21

圖 4-4.觀光旅遊區域選擇頁面............................................................ 22

圖 4-5.觀光旅遊搜尋頁面 .................................................................... 23

圖 4-6.觀光旅遊介紹頁面 .................................................................... 24

圖 4-7.觀光旅遊地圖功能 .................................................................... 25

圖 4-8.觀光旅遊一鍵撥號功能............................................................ 26

圖 4-9.觀光旅遊天氣功能 .................................................................... 27

圖 4-10.旅遊住宿搜尋頁面 .................................................................. 28

圖 4-11.旅遊住宿介紹頁面 .................................................................. 29

圖 4-12.觀光美食查詢頁面 .................................................................. 30

圖 4-13.交通資訊選擇頁面 .................................................................. 31

圖 4-14.公車動態資訊查詢頁面.......................................................... 32

圖 4-15.公車轉乘查詢頁面 .................................................................. 33

圖 4-16.現在位置頁面 .......................................................................... 34

圖 4-17.關於台中頁面 .......................................................................... 35

VII

圖 A-1.Java 檔主程式 ........................................................................... 38

圖 A-2.xml 檔主程式 ........................................................................... 40

1

第壹章 緒論

1-1.研究動機

現在背包客風氣盛行，許多人都會利用空閒時間到各地遊玩或出國旅行，早

期可能用地圖或直接問路，但現在科技日新月異，用電腦便可查知許多地方，不

過智慧型手機又逐漸取代電腦的存在，所以本專題開發地方資訊透過手機瀏覽知

道各地旅遊資訊，甚至地方小吃，便於遊客使用。主要的用戶為背包客為主，在

現在 E 世代的影響大家對於智慧型手機的依賴會多過於書本介紹，因為只需滑

動手指便能掌握想要的資訊，即為本 APP 想帶給民眾的簡潔方便性。本 APP 的

資料是網路資訊，並且會一直更新，給使用者最新的景點資料。

本專題以台中地區為主，為讓資料蒐集與各功能設計齊全，提供台中人與到

台中的遊客使用。

(1)APP 下載使用率暴增

智慧型手機銷售量的增加帶動了 APP 的下載數量，根據 Millennial Media 於

2011 年 8 月的研究數據指出，全球下載（手機應用軟體程式）的次數依種類排

名，第一至第五名分別是遊戲、音樂與娛樂、社群、溝通和天氣。從使用者下載

的種類當中，不難看出大多數人最重視的是的行動娛樂附加價值服務。不僅只提

供行動娛樂加值服務外，所提供的服務也滿足了我們日常生活中的不同需求，包

括地圖、時間、美食旅遊，甚至是飲食控制等不同種類，讓這些服務更加融入使

用者的生活當中。[1]

(2)美食旅遊資訊 輕鬆網羅一機搞定

我國新北市政府經濟發展局推出「新北市大玩家」，將新北市主要的 15 個

商圈依特色分成四大主題－優美水岸享浪漫、光陰老街古意行、自然風光愜意遊、

特色美食吃透透，包含資訊包括了美食、購物、交通、住宿、服務中心，甚至是

鄰近公廁和停車場的資訊。更特別的是，此款也提供了一個客製化「即時限地簡

2

訊」服務，使用者只要身處在這 15 大商圈的範圍中，即可收到系統傳送的商家

優惠簡訊，不僅可讓消費者掌握第一手優惠資訊，同時也增加商家的曝光機會，

帶動地方觀光旅遊業的商機。[2]

APP 的應用範圍將會持續推陳出新，除了基本的提升手機功能和工具型外，

能夠吸引使用者青睞進而下載的條件就是能夠符合使用者需求，並且提供更多進

階型的加值服務，未來的應用開發範圍也將會持續增加。

1-2.研究目的

本專題的研究目的是讓民眾有嶄新的 APP 服務，主要提供台中旅遊資訊為

主，讓使用者了解台中的歷史，增加對台中的認知。其中包含查詢台中觀光景點

與美食小吃，內容有詳盡的介紹與店家地圖、電話、天氣可供查看。本 APP 也

提供了知名旅館資訊讓使用者選擇，並含有照片和簡介讓使用者了解其風格特色。

透過本專題的 APP 功能可以連結到台中公車動態暨路網轉乘系統，並可查詢轉

乘的公車號碼和班次，另外結合 Google Map 的規劃路徑系統，直接定位所在位

置以及規劃路線到目的景點，和提供景點附近美食的資訊。

目前市面上旅遊軟體很多，但與 AR 結合較為少見，所以本專題結合 AR 互

動，讓資訊取用更具情境感。有行動裝置並下載相關 AR 程式軟體就能在真實環

境中創造視覺感官的刺激。

3

第貳章 文獻回顧與探討

2-1.APP 功能比較

在比較其他旅遊 APP 後下表 2-1(美美旅遊[3]，i 遊台中[4])，發現還有些功

能可以新增，例如：住宿資訊、天氣資訊等方便實用的功能，和大部分 APP 都

未設置的「關於台中」、「一鍵撥號」；讓遊客更了解台中，以及在 APP 中直接按

下號碼即可撥號，不必硬記號碼再跳出 APP 輸入，是本專題討論後擴充的功能。

而本專題最重要的 AR 擴增實境是現在旅遊 APP 較少的功能，因為 AR 擴增實

境的潮流是在最近才興起，所以本專題針對這點去開發。

表 2-1.APP 功能比較圖

台中旅遊 GO i 遊臺中 美美旅遊

旅遊景點

美食商家

旅遊住宿

關於台中

交通資訊

現在位置

天氣資訊

一鍵撥號

關鍵文字查詢

AR

4

2-2.Eclipse

Eclipse(如圖 2-1)是由 Open Source Community 所創建的開發軟體，並被廣

泛地使用在許多不同的領域。

Eclipse最初是由 IBM公司開發的替代商業軟體Visual Age for Java的下一代

IDE 開發環境，2001 年 11 月貢獻給開源社群，現在它由非營利軟體供應商聯盟

Eclipse 基金會（Eclipse Foundation）管理。

Eclipse 採用的技術是 IBM 公司開發的（SWT），這是一種基於 Java 的窗口

元件，類似 Java 本身提供的 AWT 和 Swing 窗口元件；不過 IBM 聲稱 SWT 比其

他 Java 窗口元件更有效率。Eclipse 的使用者介面還使用了 GUI 中間層 JFace，

從而簡化了基於 SWT 的應用程式的構建。

Eclipse 的外掛模組機制是輕型軟體元件化架構。在富客戶機帄台上，Eclipse

使用外掛模組來提供所有的附加功能，例如支援 Java 以外的其他語言。已有的

分離的外掛模組已經能夠支援 C/C++（CDT）、PHP、Perl、Ruby，Python、telnet

和資料庫開發。外掛模組架構能夠支援將任意的擴充功能加入到現有環境中，例

如配置管理，而決不僅僅限於支援各種程式語言。

Eclipse 的設計思想是一切皆外掛模組。Eclipse 核心很小，其它所有功能都

以外掛模組的形式附加於 Eclipse 核心之上。Eclipse 基本核心包括：圖形 API

（SWT/Jface），Java 開發環境外掛模組（JDT），外掛模組開發環境（PDE）等。

[5]

圖 2-1.eclipse 圖示

5

2-3.程式語言：Java

Java(如圖 2-2)是一種被廣泛運用的程式設計系統。他具有物件導向、跨帄

台性、自動垃圾回收，等三大特點：

(1)物件導向

Java 的特點之一就是物件導向，是程式設計方法的一種。「物件導向程式語

言」的核心之一就是開發者在設計軟體的時候可以使用自訂的型別和關聯操作。

程式碼和資料的實際集合體叫做「物件」。一個物件可以想像成繫結了很多「行

為（程式碼）」和「狀態（資料）」的物體。對於資料結構的改變需要和程式碼進

行通訊然後操作，反之亦然。物件導向設計讓大型軟體工程的計劃和設計變得更

容易管理，能增強工程健康度，減少失敗工程的數量。

(2) 跨帄台性

Java 語言的第二個特性就是跨帄臺性，也就是說使用 Java 語言編寫的程式

可以在編譯後不用經過任何更改，就能在任何硬體裝置條件下執行。這個特性經

常被稱為「一次編譯，到處執行」。

(3) 自動垃圾回收

C++語言被用戶詬病的原因之一是大多數 C++編譯器不支援垃圾收集制。通

常使用 C++編程的時候，程式設計師於程式中初始化對象時，會在主機記憶體

堆疊上分配一塊記憶體與位址，當不需要此對象時，進行解構或者刪除的時候再

釋放分配的記憶體位址。如果對象是在堆疊上分配的，而程式員又忘記進行刪除，

那麼就會造成記憶體洩漏（Memory Leak）。[6]

圖 2-2.java 圖示

6

2-4.AR 擴增實境

2-4-1.開發 AR 功能性介紹

擴增實境（Augmented Reality，簡稱 AR）是一種實地計算攝影機影像

的位置及角度並加上相應圖像的技術，是在螢幕上把虛擬世界套在現

實世界並進行互動。也可以利用攝影機器所拍攝下來的影像，經過程式的分

析後，偵測出欲辨識的對應圖卡或目標影像。計算出其圖卡或目標影像的位置及

角度後，再將相對應的影像圖檔、影片檔、聲音檔，重疊顯示於辨識圖卡或是影

像上的技術。這種技術目的主要是將電腦虛擬物件的資訊附加於現實的世界中，

讓使用者可以在帄凡的影像中看到虛擬、實體影像疊合的擴充實境。此技術也可

以利用遙控桿、鍵盤來操作，然而為了較接近現實的使用情況，通常是透過控制

虛擬的物件與使用者在真實世界中進行互動。

2-4-2.Unity(遊戲引擎)

Unity3D(如圖 2-3)是一個用於創建如三維視訊遊戲、建築可視化、實時三維

動畫等類型互動內容的綜合型創作工具。Unity 類似於 Director，Blender，Virtools

或 Torque Game Builder 等利用交互的圖型化開發環境為首要方式的軟體其編輯

器執行在 Windows 和 Mac OS X 下，可發布遊戲至 Windows、Wii、OSX 或 iOS

帄台。也可以利用 Unity web player 外掛程式發布網頁遊戲，支援 Mac 和 Windows

的網頁瀏覽。它的網頁播放器也被 Mac widgets 所支援。Unity 分成 Free 與 Pro

版。Free 版提供詴用 30 天 Pro 版的功能。而本專題的 AR 功能需利用 Unity3D

進行圖片繪製與定位，讓 AR 卡能確實辨別並顯現出影像。

[7]

圖 2-3.Unity 圖示

7

2-4-3.Vuforia

Vuforia(如圖 2-4)是一個軟件帄台，目的是為了增強擴充實境（AR）應用程

序，Vuforia 擁有技術上的多變和計算機視覺的圖像識別，並提供了廣泛的功能

集和功能，使開發人員可以自由地擴展他們的視野沒有技術限制。並與 iOS，

Android 和 Unity 有 3D 支援，Vuforia 帄台可以讓你編寫一個原生應用程序，可

以在廣泛的智能手機和帄板電腦有大多數用戶。Vuforia SDK 是高通公司奧地利

研究中心有限公司的產品。

Vuforia 同時支援三種帄台，包括：Android， iOS， Unity 等。而 Developing

with Vuforia 有以下幾個特性：

˙快速地偵測標的物。

˙使用雲端進行識別可同時處理高達 100 萬的目標物。

˙針對即時目標物產生，可以讓用戶自行定義。

˙可以進行文字識別。

˙更強健的追踪，當裝置移動時，追踪物件不容易遺失。

˙可同時追踪多達 5 個目標物。

˙在現實世界中的條件有更好的結果如較差光線及目標物部分被覆蓋等。

˙效能佳確保更好和更逼真的圖形上呈現在裝置上。

如圖 2-5.是說明開發者和 Vuforia 帄台兩者的分工，對於開發者主要工作是

在於 APP 內容設計及目標物製作，而 Vuforia 則是提供

Vuforia 引擎(Engine)及目標物管理系統。對於目標物管理，

圖 2-4.vuforia圖示

8

Vuforia 提供兩種資料庫：雲端目標物資料庫及本機目標物資料庫。[8]

圖 2-5.開發者和 Vuforia 帄台分工圖

2-4-4.AR 擴增實境分類

擴增實境又可分為兩種如下表 2-2 所示:

表 2-2.兩種擴增實境介紹

有標記式擴增實境（Marker AR）：

必頇透過特定的標記、圖案以供系統辨

識，透過圖卡的方式進行辨識、定位模

型在相對位置，此標記稱為「圖卡」

（Marker）。左方圖片為使用「圖卡」

的有標記式擴境實境。

無標記式擴增實境（Markerless AR）：

不頇透過特定圖卡樣式（Pattern）即可

達到辨識效果，使用者可以自行選定辨

識圖片（Key Frame）。

9

目前智慧型手機的普遍進而讓 APP 也跟著普遍，在文獻回顧與探討中的敘

述中提到："不僅只提供行動娛樂加值服務外，所提供的服務也滿足了我們日常

生活中的不同需求"。根據 Millennial Media 於 2011 年 8 月的研究數據指出，在

排名中遊戲、音樂、娛樂、聊天、天氣成為了前五名，地圖、美食旅遊等也包含

在內 AR "電腦虛擬物件的資訊附加於現實的世界中，讓使用者可以在帄凡的影

像中看到虛擬、實體影像疊合的擴充實境"。[1]

10

第參章 研究方法

3-1 研究流程

下圖 3-1 所示，本專題以開發旅遊方面的 APP 程式為主，首先確認研究目

的與動機，並開始蒐集相關資料，依據資料開始規劃設計，其中需編寫 Android

程式、建置 AR、繪製 3D 景點圖和美工圖，以及統整資料匯入使之相連成為一

套系統，最後測詴系統後如發生錯誤則重回檢查錯誤，成功即可實際運用。

圖 3-1.研究流程圖

開始

研究目的與動機

蒐集相關資料

規劃與設計

繪製美工圖案 建置 AR 編寫 Android 程式

測詴系統

完成

YES

NO

11

3-2.系統架構

本專題設計的 APP 如下圖 3-2 所示，主要介面有觀光旅遊、旅遊住宿、觀

光美食、現在位置、交通資訊、關於台中、AR 等 7 項。觀光旅遊與旅遊住宿可

以選擇區域，並可用關鍵字搜尋，選擇進去後有完整的地圖、天氣、簡介，並提

供一鍵撥號的功能。觀光美食有台中各店家相關簡介等，提供景點附近著

名美食餐廳或小吃讓使用者選擇。現在位置可以從 google 上顯示自己的位

置。交通資訊可以查詢的公車動態與景點轉乘，也可以用規劃路線規劃出自

己旅遊的路線。關於台中有台中詳盡的簡介，讓使用者了解台中的歷史經歷，增

加對台中的認知。

本專題也利用 AR 擴充實境開發呈現 3D 效果的人機互動功能，

在提供的介面放置一個 AR 選項按鈕，點進去後即可進入掃描畫面，

掃描完 AR 卡後，在手機內即可呈現 3D 效果的功能。

圖 3-2.系統架構圖

12

3-3.相關資料

本專題資料設置在 xml 文字檔裡，部分資訊是政府提供免費 xml 的 opendata

資料，因此本專題加以利用。自身再建立一個 xml 檔來讀取，並利用固定的欄位

名稱來逐一讀取需要的欄位，下表 3-1 為 xml 資料表。

表 3-1.資料表

欄位名稱 資料類型 類型長度

Name 文字 30

Add 文字 20

Town 文字 3

Zone 文字 3

Tel 數字 10

Opentime 數字 4

Toldescribe 文字 200

Picture 超連結 100

Px 數字 10

Py 數字 10

Picdescribe 文字 10

3-4.編寫 Android 程式

先執行 Android 手機程式環境建置步驟：

步驟一：安裝 Java SDK

步驟二：安裝 Eclipse 整合開發環境

13

步驟三：安裝 Android Development Tools(ADT)Eclipse plug-in

步驟四：安裝 Android SDK

依序建置完成後即可開始編寫程式碼

步驟五：Android 程式建置

過程參照附錄 A

3-5.AR 建置

AR 建置分成二種區域 AR 卡建置與手機建置，需安裝 Android SDK &

Eclipse&3Dmax & Illustrator CS5&Unity&vuforia

(1)AR 卡建置安裝流程：

步驟一：安裝 jdk1.6

步驟二：安裝 android-sdk_r12-windows

步驟三：安裝 Unity4.3.1

步驟四：執行 vuforia-unity-android-1-5-10.exe

安裝完後就可用 Unity 開始製作 3D 物件與圖卡部分，利用 Illustrator CS5 繪畫的

2D 帄面圖卡如圖 3-3.2D 圖科博館 3-4.2D 圖湖心亭，以及用 3Dmax 繪畫 3D 圖

如圖 3-5.3D 圖湖心亭把這兩物件套入程式運用 Unity 匯入並加以整合。

14

如圖 3-6，在 Unity 中設置 AR 卡與調整鏡頭、光源等，並設置要顯示的 3D 圖到

AR 卡中，儲存後輸出即可使用。

。

圖 3-3.2D 圖科博館 圖 3-4.2D 圖湖心亭

圖 3-5.3D 圖湖心亭

15

(2)AR手機建置安裝流程：

步驟一.安裝 Cygwin 環境

步驟二.安裝 Android NDK

步驟三.安裝 Vuforia SDK

步驟四.執行 Vuforia Sample Project

Vuforia™是軟件帄台，安裝完成後可讓行動裝置鏡頭移到目的地後浮現完成

配置好的 3D 立體圖形該 Vuforia 帄台採用優越、穩定、高效的技術基於計算機

視覺的圖像識別，並提供最廣泛的功能集和功能。

綜合上敘，首先建置 AR 需先繪製顯示用的 3D 圖與 AR 卡的 2D 圖，將圖

匯進 Unity 後做設置與調整，最後便產生 apk 輸出，apk 即為最後的執行檔，將

檔案放進手機後用 Vuforia 偵測，Vuforia 偵測到設定的 AR 圖卡後會產生 3D 圖，

完成後即可匯入專題 APP 內如圖 3-7。

圖 3-6.AR 建置

16

3-6.美工圖案繪製

使用了 Adobe 的 Photo Shop CS5 和 Illustrator CS5 來繪製本專題美工圖片：

Illustrator CS5 用於背景 使用了內建素材 、鋼筆工具 、漸層工具。

PhotoShop CS5 用於 LOGO 和 APP 人物運用了文字工具、鋼筆工具、填滿筆畫

功能。

圖 3-8.Photo Shop CS5 和 Illustrator CS5 圖示

3-6-1.繪圖流程

圖 3-7.AR建置流程圖

建置 AR 軟體

繪製 3D 圖 繪製 2D 圖

匯入 Unity

產生 apk

17

首先是背景部分，開啟 Illustrator CS5，建立圖層後將背景、天空、草地道

路、雲等如圖 3-9，在天空圖層利用矩形工具拉出所需的大小，使用漸層工具拉

出天空色的漸層。在草地道路圖層，利用鋼筆工具拉出所需的範圍，使用繪圖樣

式的內建素材，圖上草地顏色和道路顏色，再用鋼筆工去繪畫出道路上的線條。

雲圖層利用符號的內建素材拉出雲朵符號，並利用縮放功能以及鏡射功能將雲朵

作出不一樣的變化。

在樹圖層，利用符號的內建素材拉出樹的符號，並利用縮放功能和鏡射功能做出

遠近的感覺。並利用不透明度作出遠近的差異。

圖 3-9.繪製背景圖

開啟 Photo Shop CS5 如圖 3-10 新增圖層”上色”利用筆刷工具和填滿功能。

新增圖層”遮色片”作出陰影的感覺以及毛色，利用筆刷工具刷出線條。

利用鋼筆工具畫出人物線條，分在該屬的圖層。

18

圖 3-10.繪製人物圖

3-7.測詴系統

測詴建置按鈕是否正常，相關連結可否有正常運作，以及進入系統畫面的圖

片和文字敘述是否有跑掉，Google Map定位系統有無偏差和規劃路線是否正常，

而 AR 功能是否能正常顯示 3D 圖等。

19

第肆章 系統實作

在手機中點選 APP 程式『台中旅遊 GO』，本 APP 因有 LOGO 圖所以方便尋

找，如圖 4-1。

圖 4-1.台中旅遊 Go 程式

20

到達程式首頁後畫面，可選擇觀賞首頁圖數秒自動進入或點一下直接進入

到主頁面，如圖 4-2。

圖 4-2.台中旅遊 GO 首頁 圖 4-3.台中旅遊 GO 主頁面

21

本 APP 的主頁面，有觀光旅遊、旅遊住宿、觀光美食、現在位置、交通資

訊、關於台中、AR 等 7 項。可以選擇要查詢的按鈕並連結到所點擊的頁面，圖

4-3。

圖 4-3.台中旅遊 GO 主頁面

22

觀光旅遊的查詢頁面，在選擇區域會列出台中各區區域供選擇，並可透過上

方關鍵字搜尋立即查詢所需要的店家，便能顯示出該店家名稱，如圖 4-4。

圖 4-4.觀光旅遊區域選擇頁面

23

觀光旅遊搜尋後畫面，在點擊『新社區』搜尋後下方會出現相關的地方景點，

如圖 4-5。

圖 4-5.觀光旅遊搜尋頁面

24

觀光旅遊的介紹頁面如圖 4-6，每個景點都有詳盡的介紹與功能，如地圖可

以定位景點位置並顯示地址與店家、點一鍵撥號可以撥出該店家電話號碼、天氣

可以查詢當地天氣概況，簡介內有營業時間、地址、電話與詳盡的景點介紹。

圖 4-6.觀光旅遊介紹頁面

25

在觀光旅遊的介紹頁面中點擊『地圖』按鈕，會連結到 google 地圖顯示該

地方位置，如圖 4-7。

圖 4-7.觀光旅遊地圖功能

26

在觀光旅遊的介紹頁面中點擊『電話』按鈕，會自動輸入該地區電話後到撥

打畫面，如圖 4-8。

圖 4-8.觀光旅遊一鍵撥號功能

27

在觀光旅遊的介紹頁面中點擊『氣象』按鈕，會連結到中央氣象局顯示該地

方的天氣資訊，如圖 4-9。

圖 4-9.觀光旅遊天氣功能

28

旅遊住宿搜尋後畫面，在點擊『新社區』搜尋後下方會出現相關的旅遊住宿

資訊，如圖 4-10。

圖 4-10.旅遊住宿搜尋頁面

29

旅遊住宿的介紹頁面如圖 4-11，每個住宿都有詳盡的介紹與功能，簡介內有

營業時間、地址、電話與詳盡的住宿介紹。

圖 4-11.旅遊住宿介紹頁面

30

觀光美食的搜尋頁面如圖 4-12，提供全台中的美食資訊與各店家簡介，搜尋

時會有圖片參考及該店家電話、地址。

圖 4-12.觀光美食查詢頁面

31

交通資訊頁面如圖 4-13，可以連結到台中公車動態暨路網轉乘系統，有公車

資訊或開車資訊供選擇，公車資訊又可分公車動態、景點轉乘兩種。

圖 4-13.交通資訊選擇頁面

32

公車動態資訊頁面如圖 4-14，可選擇要查詢的公車動態，讓使用者知道公車

到站時間，以及查詢轉乘的公車號碼和班次。

圖 4-14.公車動態資訊查詢頁面

33

公車轉乘查詢頁面如圖 4-15，讓使用者查詢轉乘的公車號碼和次。再輸入完

規劃後按下確定即可即時查詢。

圖 4-15.公車轉乘查詢頁面

34

使用者可用衛星定位查詢目前所在的位置如圖 4-16，並可以放大縮小顯示，

以方便規劃旅遊的路線。

圖 4-16.現在位置頁面

35

關於台中有介紹多個大景點與台中基本簡介如圖 4-17，讓使用者了解台中的

歷史經歷，增加對台中的認知。

圖 4-17.關於台中頁面

36

第伍章 結論

本專題拓展現有的觀光旅遊、觀光美食、旅遊住宿等資訊，供使用者觀看查

詢，其中有一鍵撥號、AR、地圖、天氣、簡介等功能，並有地圖導航定位，供

使用者方便確定位置，而公車資訊功能可讓使用者查詢公車動態與公車轉乘，讓

使用者可以使用開車資訊查詢路線。

本專題達到以下目標：

1. 簡單操作與清新的介面：本 APP 介面清楚明瞭，功能簡單容易上手，

讓使用者能方便使用。

2. 結合觀光旅遊、觀光美食、旅遊住宿：本專題結合觀光旅遊、觀光美食、旅

遊住宿等資訊，讓有需求的使用者一支 APP 就能找到所有想要的資訊。

3. 因應旅遊風氣盛行： 現在許多人都會利用空閒時間到各地遊玩或出國旅行，

本 APP 能滿足外出遊玩的人與背包客的需求。

4. 一鍵撥號、台中簡介等功能的創新：大部分 APP 都未設置的「關於台中」、「一

鍵撥號」；關於台中能讓遊客更了解台中，以及一鍵撥號在 APP 中直接按下

號碼即可撥號，不必硬記號碼再跳出 APP 輸入。

5. AR 擴充實境開發：AR 擴充實境是市面上較少見的功能，本專題

開發此功能勢必讓使用者耳目一新。

研究限制：

AR 擴充實境為本專題的功能之一，但因為研究時間不足，未能研究出將

該功能放進台中旅遊 GO，僅能在獨立的 APP 中執行。

37

參考文獻

[1].趙令文，「Google Android 手機 APP 開發入門」，臺北市，電腦人出版：

城邦文化發行

[2].謝新州，「科技期刊競爭力評價」，華夏出版社

[3].美美旅遊網，Android

http：//mmweb.tw/app/

[4]. i 遊台中，Android

https//play.google.com/store/apps/details?id=tms.tw.governmentcase.taichungtravel&

hl=zh_TW

[5].宮本信二，Eclipse 完全攻略 ： 從基礎 JAVA 到 PDE 外掛開發，新北市，博

碩文化

[6].手機程式開發-擴增實境程式

http：//zh.scribd.com/doc/135058674/Android

[7].Qualcomm® Vuforia™網站

http：//www.qualcomm.com/solutions/augmented-reality

[8].智慧生活科技專業社群 http：

//cheng-min-i-taiwan.blogspot.tw/2013/07/vuforia-ar-vuforia-sdkapp.html

[9]黃義淳，「Max/s Max Design 必備概念‧功能技法‧範例應用‧視訊教學」，碁

峰資訊股份有限公司

[10]陳會安，「新觀念 Android SDK 程式設計範例教本」，旗標出版

[11]洪維恩，「Java 2 JDK 5/6 教學手冊」，旗標出版

38

附錄 A

下圖為 java 主程式建置後畫面

圖 A-1.Java檔主程式

39

Java 程式檔名 程式內容

AboutTaichung.java “關於台中”程式碼

accommodations.java “旅遊住宿”程式碼

attractions.java “觀光旅遊”程式碼

attractionsone.java “觀光旅遊”，“旅遊住宿”

介紹頁面程式碼

Data.java 傳輸資料媒介的程式碼

Foodintroduction.java “觀光美食”程式碼

Fragment1.java “公車資訊”程式碼

Fragment2.java “開車資訊”程式碼

homepage.java “台中旅遊 GO 主頁面”程式碼

MainActivity.java “台中旅遊 GO 首頁”程式碼

mapforget.java 地圖經緯度定位程式碼

maptest.java “現在位置”定位程式碼

tabmanager.java “交通資訊”的標籤程式碼

testview.java “關於台中”內介紹小窗程式碼

traffic.java “交通資訊”的頁面程式碼

xmlhandler.java 呼叫資料與搜尋的判斷式

WH.java.java 相容手機圖片大小程式碼

表 A-1.java 檔對應功能表

40

下圖為 xml 主程式建置後畫面

表 A-2.xml 檔對應功能表

Xml 介面檔名 介面簡述

abouttaichung.xml “關於台中”的頁面

activity_main.xml “台中旅遊 GO 首頁”的頁面

attractions.xml “觀光旅遊”，“旅遊住宿”

的搜尋頁面

attractionsone.xml “觀光旅遊”，“旅遊住宿”

的介紹頁面

foodintroduction.xml “觀光美食”的頁面

fragment1.xml “公車資訊”的頁面

fragment2.xml “開車資訊”的頁面

homepage.xml “台中旅遊 GO 主頁面”的頁面

mapforget.xml 地圖經緯度定位的頁面

maptest.xml “現在位置”定位的頁面

Traffic.xml “交通資訊”的頁面

圖 A-2.xml檔主程式