崑山科技大學 電腦與通訊系四技部 專題製作報告 影像大頭貼之遠端遙控 The remote control of image head stickers 學生 : 林明冠 (4000D122) 指導老師 : 曾昭雄 中華民國一百零四年三月

Similar documents
PowerPoint 簡報

投影片 1

* 2

iziggi

01 用 ActionScript 3.0 開始認識 Flash CS3 Flash 是應用在網路上非常流行且高互動性的多媒體技術, 由於擁有向量圖像體積小的優點, 而且 Flash Player 也很小巧精緻, 很快的有趣的 Flash 動畫透過設計師的創意紅遍了整個網際網路 雖然很多人都對 Fl

84

X6-04_How_do_I_write_a_com_port_communicate_program_of_XPAC_tc

EX-Z80

工程师培训

1



輕鬆學 Dreamweaver CS5 網頁設計..\Example\Ch0\ \.html..\example\ch0\ \mouse.txt..\example\ch0\ \ _Ok.html 學習重點 JavaScript 複製程式碼 mouse.txt Ctrl+C Ctrl+C 0-4

中山大學學位論文典藏.PDF

Chapter 3 Camera Raw Step negative clarity +25 ] P / Step 4 0 ( 下一頁 ) Camera Raw Chapter 3 089

APP 103 學 年 度 嶺 東 科 技 大 學 資 訊 網 路 系 專 題 研 究 報 告 嶺 東 中 華 民 國 一 四 年 五 月 1

(Microsoft Word - wes _\246p\246\363\250\317\245\316LED\277O\305\343\245\334\252\254\272A.doc)

FETnet - Acer Iconia Tab  (A500 Wi-Fi 版) 平板電腦操作指南


( )... 5 ( ) ( )

DeskJet F2180 DeskJet F4185 Deskjet F4280 DeskJet D2460 OK N/A N/A DeskJet 1660 OK ( 無提供 Win 2000 驅動 ) N/A N/A PSC 1315 Photosmart 2575 Photosmart C13

Autodesk Product Design Suite Standard 系統統需求 典型使用用者和工作流程 Autodesk Product Design Suite Standard 版本為為負責建立非凡凡產品的設計師師和工程師, 提供基本概念設計計和製圖工具, 以取得令人驚驚嘆

Microsoft Word - 結案報告.doc

使用手冊

113

09 F9 128 peer to peer, P2P file transfer protocol bittorrent 10 P2P P2P GNU/ Linux P2P CC 單機版的智慧財產權 vs. 人權戰爭 1980 DVD content


<A4E2BEF7B4FAB8D5B3F8A F52322E786C7378>

Microsoft Word - 發布版---規範_全文_.doc

概 述 随 着 中 国 高 等 教 育 数 量 扩 张 目 标 的 逐 步 实 现, 提 高 教 育 质 量 的 重 要 性 日 益 凸 显 发 布 高 校 毕 业 生 就 业 质 量 年 度 报 告, 是 高 等 学 校 建 立 健 全 就 业 状 况 反 馈 机 制 引 导 高 校 优 化 招

鱼类丰产养殖技术(二).doc

疾病诊治实务(一)

名人养生.doc

<4D F736F F D2040B9C5B871A661B0CFABC8AE61C2A7AB55ACE3A8735FA7F5ABD8BFB3B9C5B871A661B0CFABC8AE61C2A7AB55ACE3A8732E646F63>


中老年保健必读(十).doc

27 i

% % ,542 12,336 14,53 16,165 18,934 22,698 25, ,557 7,48 8,877 11, 13,732 17,283 22,

海淀区、房山区(四)

穨ecr1_c.PDF

穨2005_-c.PDF

北京理工大学.doc

尲㐵.⸮⸮⸮⸮⸮

东城区(下)

果树高产栽培技术(一).doc

物质结构_二_.doc

第一節 研究動機與目的

i

水力发电(九)

中国古代文学家(八).doc

景观植物(一)

Microsoft Word - 目录.doc

园林植物卷(三).doc

19q indd

厨房小知识_一_

中南财经大学(七).doc


赵飞燕外传、四美艳史演义

厨房小知识(五)

最新监察执法全书(十八).doc

园林植物卷(十二).doc

华东师范大学.doc

國立中山大學學位論文典藏

乳业竞争_一_

最新执法工作手册(十).doc

untitled

最新执法工作手册(十六)

中国政法大学(六).doc

胎儿健康成长.doc

bnbqw.PDF

nb.PDF

untitled

第三章

1. 本文首段的主要作用是 A. 指出 異蛇 的藥用功效 說明 永之人爭奔走焉 的原因 B. 突出 異蛇 的毒性 為下文 幾死者數矣 作鋪墊 C. 交代以蛇賦稅的背景 引起下文蔣氏有關捕蛇的敘述 2. 本文首段從三方面突出蛇的 異 下列哪一項不屬其中之一 A. 顏色之異 B. 動作之異 C. 毒性之

Microsoft Word - edu-re~1.doc

Microsoft Word - 08 单元一儿童文学理论

南華大學數位論文

Microsoft Word 一年級散文教案.doc

米食天地教案

第32回独立行政法人評価委員会日本貿易保険部会 資料1-1 平成22年度財務諸表等

項 訴 求 在 考 慮 到 整 體 的 財 政 承 擔 以 及 資 源 分 配 的 公 平 性 下, 政 府 採 取 了 較 簡 單 直 接 的 一 次 性 減 稅 和 增 加 免 稅 額 方 式, 以 回 應 中 產 家 庭 的 不 同 訴 求 ( 三 ) 取 消 外 傭 徵 費 6. 行 政 長

(f) (g) (h) (ii) (iii) (a) (b) (c) (d) 208

<4C50352D B971B8A3B35DB3C6A655B2D5A9FAB2D32E786C73>


案號 :LP 京年升 : 16-LP 第一組個人電腦 鎮億年 : 16-LP 項次契約金額廠牌型號產地品名共同規格 acer Veriton M2640G 臺灣 ASUS MD330 臺灣 MSI 微星科技捷元 GENUINE ProDesk 400 G3

Test Report tamio R3 Netis WF2409E Model TP-LINK TL-WR841HP ASUS RT-N12+ B1 LB-LINK BL-WR2000 v1.0.4 v Firmware v v2.0.8 v1.0.6 Date 20

封面-12

项目背景

项目背景

TPM BIOS Infineon TPM Smart TPM Infineon TPM Smart TPM TPM Smart TPM TPM Advanced Mode...8

中華民國第 四 十 七 屆中小學科學展覽會

CH01.indd

AutoCAD 用戶如何使用 ArchiCAD

APA Preliminaries Text Reference 1. Cover Page 2. Title Page 3. Signature Page 4. Advisor s recommendation letter 5. Approval page 6. Copyri

Microsoft Word - Delta Controller ASCII_RTU_TC

二零一零至一一年施政报告 - 施政纲领

OSI OSI 15% 20% OSI OSI ISO International Standard Organization 1984 OSI Open-data System Interface Reference Model OSI OSI OSI OSI ISO Prototype Prot

AndroidUsersGuide.book

Microsoft Word - 手冊.docx

內文教學區 ( ) ( ) ( ) ( )

Transcription:

崑山科技大學 電腦與通訊系四技部 專題製作報告 影像大頭貼之遠端遙控 The remote control of image head stickers 學生 : 林明冠 (4000D122) 指導老師 : 曾昭雄 中華民國一百零四年三月

摘 要 系上有個影像大頭貼作品, 它有選擇相框 拍照 將拍好的照片寄到 e-mail 等功能, 雖然它的功能很多元化, 但是每次要操作時, 都要親自走到電腦螢幕前面操作, 這個部分無庸置疑 確實是一個不太方便的地方, 所以計畫使用智慧型手機 ( 或平版電腦 ) 為影像大頭貼設計一個專屬遙控器, 以解決使用上的不方便 本專題為了增加影像大頭貼使用上的方便性, 用手機設計一個 遙控器, 以遠端遙控的方式控制影像大頭貼 專題的內容可分為兩大部分, 第一個部分是在智慧手機上撰寫 APP, 讓使用者直接在手機上操控, 再透過藍芽通訊將控制命令傳給影像大頭貼 ; 第二個部分是在影像大頭貼撰寫 C# 程式, 將使用者的命令轉換成影像大頭貼的動作

致 謝 此次參與的專題研究, 要感謝的是本專題的指導老師 曾昭雄老師, 當初大學二年級下學期的時候要找專題老師的時候, 因為個人因素找不到組員, 所以隻身尋找專題指導老師, 原本是有點擔心會不會一般老師不太願意收一個人的專題組別, 後來曾昭雄老師收我這個隻身一人一組的專題生後, 去年九月便開始投入了此次的專題研究 一個人的專題是有比較辛苦, 因為專題裡面很多事情都要自己去想辦法處理, 但是從中還是有學到很多東西, 畢竟不論真的學到的東西是多是少, 從中學到的東西終究會變成自己的 ; 而且研究過程遇到問題的時候, 老師都會蠻耐心的指導我, 所以本專題能夠順利完成, 是真的很感謝專題指導老師的指教

目錄 頁次 摘要 致謝 目錄 圖目錄 I-II III-IV 第一章緒論 1 1.1 前言 1 1.2 製作動機 1 1.3 研究過程 2 1.4 本專題會用到的硬體和軟體設備 3 第二章製作系統相關 : 軟體簡介 4 2.1 淺談藍芽 4 2.2 Android 簡介 5 2.3 什麼是 CmoreCloud? 7 2.4 Android 手機取得遙控電腦的關鍵 8 2.5 Cmore 打包到手機 8 2.6 淺談 C# 10

I 第三章製作系統相關 :COM PORT 遠端連線 11 3.1 淺談 COM PORT 11 3.2 什麼是 RS232? 12 3.3 RS232 工作原理 13 第四章系統製作 14 4.1 流程方塊圖 14 4.2 影像大頭貼操作流程 16 4.3 用 CmorePaas 設計一個手機遙控器 16 4.4 用 COM PORT 原理藉 C# 寫出遠端遙控的程式 19 4.5 透過藍芽讀取發出的 Hex 指令 24 4.6 用 photoshop 製作影像大頭貼專用底圖 29 第五章大頭貼系統設定 34 第六章結論 39 參考文獻 40 附錄 ( 參賽獎狀 ) 41

II 圖目錄 頁次 圖 2.1 acer 筆記型電腦 win 7 系統裡的藍芽裝置管理 5 圖 2.2 Google Play 網頁 6 圖 2.3 CmoreCloud 雲端操作介面 7 圖 2.4 APK QR Code 是個打包軟體方便的設計 9 圖 2.5 Microsoft Visual C# 2010 Express 介面 10 圖 4.1 影像大頭貼要跟 COM PORT 和藍芽做系統結合 15 圖 4.2 系統整合後的操作流程 16 圖 4.3 用小畫家畫出的手機操作介面 17 圖 4.4 IFTTT 資料新增 17 圖 4.5 好用的命令字串 18 圖 4.6 平板電腦實測安裝結果 19 圖 4.7 在 C# 環境畫出視窗設計 20 圖 4.8 PC 內建藍芽讀取的 COM PORT 位置 24 圖 4.9 BlueSoleil Space 桌面捷徑 25 圖 4.10 BlueSoleil Space 的工作環境 25 III

圖 4.11 Transformer TF101 藍芽裝置變成綠色 26 圖 4.12 在 Transformer TF101 按下右鍵 27 圖 4.13 系統初期測試結果示意圖 28 圖 4.14 程式執行結果放大示意圖 28 圖 4.15 Adobe Photoshop 7.0 工作環境介面 30 圖 4.16 設定成 圖層 0 30 圖 4.17 用 photoshop 將要入鏡的範圍挖空 31 圖 4.18 學校底圖 ( 相框風格 ) 32 圖 4.19 學校底圖 ( 融合風格 ) 32 圖 4.20 學校底圖 ( 明信片風格 ) 33 圖 4.21 三張插畫風格 ( 均跟畢業相關 ) 33 圖 5.1 系統執行檔 34 圖 5.2 將設計好的相框底圖放進指定資料夾 35 圖 5.3 此 Photo 檔案用來新增相框底圖檔 35 圖 5.4 <Frame> 跟 </Frame> 之間將底圖檔名加進去 36 圖 5.5 Subject 為主旨,Body 為內容 36 圖 5.6 選擇相框 37 IV

圖 5.7 拍攝中請微笑 37 圖 5.8 將拍好的照片直接在上面做文字編輯 38 圖 5.9 傳送電子郵件 38 V

第一章 緒論 1.1 前言 除了現在的智慧型手機 平板電腦技術發達 趨向普及之外, 再加上資源取得方便, 而且撰寫手機程式的軟體可以在網站自行下載取得, 不需要另外付費, 所以運用手機當成專屬遙控器是成為可以發展的技術之一 而且不論是手機 ( 平版電腦 ) 或是個人桌上型電腦 ( 筆記型電腦 ), 藍芽已經是很普及的無線連接的裝備了 1.2 製作動機 為了增加影像大頭貼使用上的方便性, 參與了這個專題研究, 製作出一個 遙控器, 期望將這操作便利的影像大頭貼變得更加便利 ; 就像電視機和冷氣機不都有一個可以做操控的遙控器嗎? 如果沒有遙控器的話, 那麼每次要操作的時候就要花時間走到電器面前, 雖然操作的當下是不會耽誤太多時間, 但如果把走到前面操作電器的時間長期做個累積, 其實還是很耗時間, 而且時間久了也會覺得這樣很麻煩, 這就是為什麼要替影像大頭貼製作一個 遙控器 的原因 1

1.3 研究過程 一開始製作手機 APP 軟體的時候是選擇用 eclipse 軟體編寫, eclipse 不只是專門用來做 java 語言開發, 更可以用來做手機 android 的軟體開發, 所以一開始個別寫下了 藍芽連結 模擬滑鼠操控模式 還有 連上 IP 位置 的不同 java 程式碼寫法, 但將這三則程式碼做整合以後, 發現到有一些問題需要排除, 但是參與本次的專題不只是要做 APP 軟體, 還需要用 Visual C# 來製作 PC 的 COM PORT 通信 ( 這邊的 PC 會先用筆電做測試, 測試完以後, 把程式應用在影像大頭貼 ), 雖然中間遇到了跑程式的時候發生的逾時問題導致程式無法順利得跑完, 後來用別的方法解決方式之後, 逾時問題大概在 2014 年 4 月中旬解決了 ; 至於平板電腦的手機操作介面, 為了不花太多時間再處理程式語言出現的 Bug 上, 這裡的手機 APP 設計部分是用製作 APP 雲端平台的 CmoreCloud 來製作 2

1.4 本專題會用到的硬體和軟體設備 硬體 : 本系的影像大頭貼設備 x1 藍芽迷你接收器 ( 規格 V4.0) x1 軟體 : CmoreCloud (APP 軟體開發 ) Microsoft Visual C# 2010 Express BlueSoleil Space Adobe Photoshop 7.0 3

第二章 製作系統相關 : 軟體簡介 2.1 淺談藍芽 藍芽技術在 1994 年開始蓬勃發展, 最早技術是應用在行動電話和免提裝置之間的無線通訊, 只是藍芽普及的時間大約是在 2010 年, 那個時期的藍芽強調的是 省電, 而且各大手機廠牌出廠的手機 還有各大廠牌電腦新出的電腦產品, 幾乎都有藍芽連結和傳輸的功能, 藍芽便開始在生活中普遍應用 藍芽的應用如下列特點 : 一 電腦與周邊裝備的無線連線, 如 : 滑鼠 鍵盤 二 在一定的距離內, 電腦與電腦之間的無線網路 三 運用藍牙做檔案傳送, 例如手機和手機之間可以傳送音樂 照片 四 以前的有線裝置慢慢轉型成無線裝置, 例如條形碼掃描器 4

圖 2.1 acer 筆記型電腦 win 7 系統裡的藍芽裝置管理 2.2 Android 簡介 Android, 中文俗名 安卓, 是以 Linux 作業系統為核心的行動平台, 最初由安迪 魯賓開發, 作業系統通常是安裝在智慧型手機和平版電腦上, 從最早出來的 Android 1.0 到現今普遍的 Android 4.3 最新出來的 Android 4.4, 它們的共通點是可以直接用手指觸控想要執行的指令, 而且還能上網下載自己想要安裝的手機 APP 軟體 藉此可以觀察出一個事實 : 開發 APP 軟體在這個時代已經相當普 遍, 只是開發 APP 的方式也很多種, 如用 elipse 做 java 開發 android 應用程式 用 Objective-C( 在 apple 手機適用 ), 或者是下一章節要探 5

討的 CmoreCloud 做 APP 手機軟體開發, 也是一個開發 APP 程式的 選擇 圖 2.2 Google Play 網頁 網址如下 :https://play.google.com/store/apps/top?hl=zh-tw 6

2.3 什麼是 CmoreCloud? CmoreCloud 是位於新竹的長茂公司出產的製作手機 APP 的雲端操 作介面, 它簡化了部分編輯手機程式的步驟, 因此不需要花太多時間 在編輯程式碼上, 直接在此介面設定需要使用的指令即可 要學會操作 CmoreCloud, 首先要先有以下的設計和學習過程 : 一 要先對準備設計的 APP 程式有所構思和創意想法 二 編輯手機 APP 程式會出現的手機頁面, 存成 jpeg 檔 三 申請好的帳號密碼, 登入 CmorePaaS 四 每頁手機頁會出現的畫面 製作 IFTTT 功能設定 圖 2.3 CmoreCloud 雲端操作介面 7

2.4 Android 手機取得遙控電腦的關鍵 用手機取得遙控電腦的關鍵在於 Com Port 通信指令, 要讓兩台不 同硬體 不同性質 不同軟體的機器取得連結, 讓手機 APP 可以順利 操作影像大頭貼 因為本科系設計的影像大頭貼軟體是用 C++ 設計的, 所以原則上 PC 的 Com Port 通信以 C# 為主, 會選 C# 的原因是 C# 適合為獨立和嵌入式的系統或是軟體編寫程式, 影像大頭貼正是個獨立性的應用軟體, 而 Android 手機 ( 平版電腦 ) 是個獨立性的作業系統, 而且 C# 是由 C++ 進化的程式碼, 比較不會有衝突 2.5 Cmore 打包到手機 CmoreCloud 有一個叫做 線上打包 APK QR Code 的功能, 製作完一個手機軟體後, 會產生一個 APK 的 QR Code, 此時用手機 ( 平板電腦 ) 下載專門感應條碼的軟體, 然後拍照下來, 接著便會自動下載然後安裝到手機 ( 平板電腦 ), 前提是手機 ( 平板電腦 ) 要有網路連線 8

圖 2.4 APK QR Code 是個打包軟體方便的設計 9

2.6 淺談 C# C# 的發音為 C Sharp, 是微軟公司在西元 2000 年發行的, 擁有類似 Visual Basic 的快速開發能力, 但又擁有像 Java 相似的軟體開發方式, 它適合獨立和嵌入式的系統編寫程式, 這次寫的 COM PORT 程式是用 C# 來撰寫, 可以將這個程式嵌入在影像大頭貼裡面實現遙控模式, 下一章會詳細介紹 COM PORT 圖 2.5 Microsoft Visual C# 2010 Express 介面 10

第三章 製作系統相關 :COM PORT 遠端連線 3.1 淺談 COM PORT 電腦系統的 COM PORT 有 9 腳位與 25 腳位兩種規格, 這邊以 9 腳 位做一個深入探討 從 Pin1 到 Pin9 都有不同的功能, 要同時運用九個功能去完成一 個 C# 遠端連線程式 :( 轉換為 COM 1 到 COM 9) Pin1 (CD) Carrier Detect 電腦讀到載波被偵測 Pin2 (RXD) Receiver 接收 data Pin3 (TXD) Transmit 傳送 data Pin4 (DTR) Data Terminal Ready 電腦傳達給數據機進行傳輸 Pin5 (GND) Ground 地線 Pin6 (DSR) Data Set Ready 資料一切準備就緒 Pin7 (RTS) Request To Send 將資料送出 11

Pin8 (CTS) Clear To Send 傳資料過來 Pin9 (RI) Ring Indicator 數據機通知電腦有電話打來 3.2 什麼是 RS232? 全名 EIA-RS-232, 是美國電子工業聯盟 (EIA) 制定的序列資 料通訊的介面標準, 通常用在電腦串列埠連線 RS232 最常見的設定有三個主要元素 : 鮑率 (Baud Rate) 同位檢 查 (Parity Check) 停止位 (Stop Bit) 鮑率指從一個裝置發到另一個裝置的位元率, 本專題剛好會用到一個裝置發到另一個裝置的部分, 故鮑率算是本專題中非常重要的元素 ; 同位檢查是用來驗證資料的正確性, 當傳輸資料的途中發生錯誤的時候, 同時會發出錯誤的警告, 並且保護好資料不會因為錯誤造成系統損壞 ; 停止位是在每個位元組傳輸之後發送的, 用來幫助接受訊號和要接收資料的硬體做一個同步的動作 12

3.3 RS232 工作原理 RS232 的特色是使用一個起始位元後面緊跟 7 或 8 個資料位元, 然後是可選的奇偶校驗位元, 最後是一或兩個停止位元 由此可知, 發送一個字元至少需要 10 位元, 帶來的一個好的效果 是使全部的傳輸速率, 發送訊號的速率以 10 劃分 本專題正是要運用 COM PORT 中的 RS232 的傳輸工作原理去製作一 個硬體跟硬體互相連接的系統, 好讓手機可以遠端控制影像大頭貼, 下一章會介紹本專題的系統製作過程 13

第四章 本專題的系統製作 4.1 流程方塊圖 這個部分主要是在陳述本專題要弄遠端控制的系統流程, 因為藍芽取材方便 ; 就算不是智慧型手機, 也會有藍芽功能, 例如幾年前還算盛行的 Sony E ricsson 照相手機, 記得以前有陣子有照相手機的時期, 會用藍芽跟同學交換資料 ; 而這次要做的影像大頭貼遠端監控軟體也會運用到藍芽交換資料的特點, 可見藍芽的方便性超乎想像 ; 不像紅外線成本過高 也不像 Wifi 有時候會因為不穩定而斷線 手機硬體的部分, 是選擇用研究室的平板電腦去操作, 因為現在 用的手機並沒有藍芽功能 不過手機硬體和 PC 硬體兩端都要有藍芽感應的方式, 使得配置成 功, 不然只有一端硬體有藍芽功能, 很明顯還是不夠的 14

圖 4.1 影像大頭貼要跟 COMPORT 和藍芽做系統結合 15

4.2 影像大頭貼操作流程 本影像大頭貼是直接用手指去觸控螢幕, 不過完成了遠端控制的 系統之後, 他會多一個偵測藍芽的功能, 然後如果有找到裝置的化變 可以順利用平板電腦操作影像大頭貼, 沒找到裝置的話反之 圖 4.2 系統整合後的操作流程 4.3 用 CmorePaas 設計一個手機遙控器 首先畫出一張 320x480 大小的 APP 介面 ( 左箭頭是上一頁相框 右箭 頭是下一頁相框 ) 16

圖 4.3 用小畫家畫出的手機操作介面 登入 CmorePaas 手機設計的雲端網頁, 將圖 4.3 上的五個按鈕在 Cmore IO 介面設定五個 Hex 傳輸值 (733113 733213 733313 733413 733513): 圖 4.4 IFTTT 資料新增 17

設定上一頁所敘述的五個傳輸值的原理是 : 當我發送一個指令的時候, 因為要使用藍芽功能去做一個遠端控制, 這個時候藍芽的命令數值就得扮演一個很重要的角色了, 這也是 ComrePaas 操作便利的地方, 因為它省去了許多密密麻麻的程式碼 接著會自動產生命令字串, 接著就要手動將那些命令字串套用在手機 操作按鈕上 ( 僅要手動框出感應範圍即可 ) 圖 4.5 好用的命令字串 將設定好的手機 APP 打包 ( 參考圖 2.4) 成 APK 檔, 就這樣一個 APP 手機 軟體就這樣誕生了! 18

圖 4.6 平板電腦實測安裝結果 4.4 用 COM PORT 原理藉 C# 寫出遠端遙控的程式 用 CmoreCloud 製作出來的手機軟體去發出指令的時候, 那個遙控程式 就必須讀取我傳出的數值, 這就是這個程式的操作原理 首先安裝好 Microsoft Visual C# 2010 Express 後, 將它開啟, 將程式名稱命名為 MainForm2, 然後先在 MainForm2.cs[ 設計 ] 的部分畫上程式要有的功能 : 上面的大框框主要是用來顯示傳達的指令數值, 下頭的功能分別為要選的通訊埠 (COM1~COM9) 要使用的鮑率 同步位元 資料位元 (7 或 8) 結束位元 還有 COM PORT 開 / 關 19

圖 4.7 在 C# 環境畫出視窗設計 以下的程式碼因為有些長, 故擷取其中一段比較重要的程式段落 : 20

這段程式碼的主要意思是會先通過 RS232 中 COM PORT 的虛擬設備, 然後使用藍芽做一個具體連線, 這邊先預設其中一個設備名稱為 COM8, 另一個設備名稱為 COM4, 但實際上連線以那台電腦讀取到的 COM PORT 位置為主 ; 接著開始尋找通訊埠, 如果找不到的話, 那麼這個程式將不會繼續執行, 如果有找到通訊埠並且連線成功的話, 便會進入下一個程式執行階段 : 接收可變長度封包, 接著判斷共收到多少資料, 再用 Invoke 事件處理資料函數 因為電腦要讀懂上述在 CmorePaas 設定的 Hex 數值, 所以需要寫入一 個可以轉換成 Text 文字的數值, 好讓電腦可以判讀那五組 Hex 數值, 以下 ASCII 數值轉換如下 : 21

733113 s1 733213 s2 733313 s3 733413 s4 733513 s5 在設計這個 C# 程式的時候, 中間有遇到嚴重的逾時問題 ( 程式執行到一半室窗會跳開, 這個時候便會出現一個錯誤訊息 逾時問題 System.TimeoutException timeoutexception 未處理作業逾時, 後來知道除了程式碼太雜亂, 還有寫法也有一些錯誤, 因為一開始是用 polling IO 微處理機的寫法, 但因為是要在電腦 Windows 系統執行, 所以需要換另外一種事件處理函數的寫法來撰寫程式, 否則 timeout 作業逾時問題還是會卡在原點, 然後終究沒有辦法解決, 因此最後程式碼修改後, 下面其中一段便是能否執行成功的關鍵 : 22

把 COM PORT 讀取處 鮑率 同位元 同位檢查 停止位等連接 COM PORT 的功能寫的非常詳細而且精簡, 這樣不但解決了程式碼行數太多 讀取很慢的情況, 還可以順利的解決那段時間在研究的逾時問題 23

4.5 透過藍芽讀取發出的 Hex 指令 這個部分必須兩邊都要開啟藍芽, 然後去做一個連線, 其實一開 始 PC 硬體的部分是先用內建的藍芽, 因為就像前面 1.1 前言的章節提 的, 藍芽生活取得方便, 然後下圖便是內建藍芽讀取 COM PORT 的視窗 : 圖 4.8 PC 內建藍芽讀取的 COM PORT 位置 內建的藍芽並沒有辦法跟 Cmore 的手機軟體藍芽的部分成功的連線, 是因為兩者系統無法相容的關係, 因此雖然 PC 本身就有藍芽功能, 但為了可以成功跟 Cmore 做連線, 用筆記型電腦裝置安裝了這套叫做 BlueSoleil Space 的軟體 : 24

圖 4.9 BlueSoleil Space 桌面捷徑 安裝完畢並且重新開機後, 便能正常使用 BlueSoleil Space 圖 4.10 BlueSoleil Space 的工作環境 上圖的 Transformer TF101 是要連接的藍芽裝置 ( 因為這裝置要拿 來當影像大頭貼的遠端遙控器 ), 因此將此裝置跟筆記型電腦藍芽裝置 25

配置好, 然後將平板電腦內打包好的影像大頭貼 APP 程式打開連結藍 芽後,BlueSoleil Space 上顯示的 Transformer TF101 手機圖案便 會從藍色轉換為綠色 圖 4.11 Transformer TF101 藍芽裝置變成綠色 接著在工作介面顯示的 Transformer TF101 裝置按一下滑鼠右鍵, 當按下右鍵後有顯示一個選項 中斷連線藍芽序列埠 (COM4), 就表示這個時候的 BlueSoleil Space 不只跟要配對的藍芽裝置連線成功, 也有成功地支援 COM PORT 連線, 不過前提是要在 BlueSoleil Space 26

設定好連接 COM PORT 的時候不需要經過授權, 不然很容易連線不成 功 ; 而在這邊, 連接感應到的 COM PORT 為 COM4 圖 4.12 在 Transformer TF101 按下右鍵 接著進一步做出初期成果, 因為要實現手機 APP 的 Hex(16 進位 ) 指令傳達到電腦 Text(10 進位 ) 的情境, 因此, 比如我要傳達 733113 的 Hex 指令, 那麼當指令傳送到筆記型電腦上的時候, 就會轉換為 s1(10 進位 ),733213 便轉換成 s2 733313 轉換成 s3 以此類推 27

圖 4.13 系統初期測試結果示意圖 圖 4.14 程式執行結果放大示意圖 28

4.6 用 photoshop 製作影像大頭貼專用底圖 大概在 2014 年 5 月中旬的時候, 因為考量到本系影像大頭貼庫存的創意底圖不足, 無法適用於各種慶典活動上, 尤其四年級學長姐畢業潮將近, 在這邊, 我針對畢業典禮做出相關主題的相框底圖, 不但可以讓使用者在選擇相框底圖的時候有更多的選擇, 更可以在今年學長姐的畢業典禮上讓本系上的影像大頭貼派上用場 相框底圖設計這邊我選擇 photoshop, 因為 photoshop 可以自行設計像素 ( 這裡的像素均設為 1024x768), 也可以加入一些創意特效, 重點是可以把同一張圖 不同元素的圖層合而為一, 然後將要入鏡的範圍挖空處理, 不過前提是要把相框底圖存檔成 png 檔, 因為影像大頭貼可以放入的相框底圖檔案僅能支援 png 檔 29

圖 4.15 Adobe Photoshop 7.0 工作環境介面 這邊的重點比較偏向於挖空入鏡的部分, 右下角的 背景 要設 定成 圖層 0 圖 4.16 設定成 圖層 0 30

接著運用套索工具和魔術棒工具選取要挖空的範圍, 然後用 delete 鍵將要挖空的範圍刪除, 存成 png 檔 下圖是其中一個相框底圖將要入鏡的範圍挖空後呈現的狀態 : 圖 4.17 用 photoshop 將要入鏡的範圍挖空 本學期製作了十三張跟畢業相關的畢業相框底圖, 以這十三張相 框底圖分類為四種風格 : 31

圖 4.18 學校底圖 ( 相框風格 ) 圖 4.19 學校底圖 ( 融合風格 ) 32

圖 4.20 學校底圖 ( 明信片風格 ) 圖 4.21 三張插畫風格 ( 均跟畢業相關 ) 33

第五章 大頭貼系統設定 (1) 先把大頭貼程式直接放在 D 槽 圖 5.1 系統執行檔 (2) 將底圖放在 Photo 中 Content 資料夾, 檔名按照順序從 own1 到 own13 34

圖 5.2 將設計好的相框底圖放進指定資料夾 (3) 打開 bin 資料夾裡面的 Photo 檔, 按下右鍵的 編輯, 將底圖 檔名加進去 圖 5.3 此 Photo 檔案用來新增相框底圖檔 35

圖 5.4 <Frame> 跟 </Frame> 之間將底圖檔名加進去 (4)<E Mail> 編輯當照片傳到電子信箱的時候會出現的主旨和內容 圖 5.5 Subject 為主旨,Body 為內容 36

圖 5.6 選擇相框 圖 5.7 拍攝中請微笑 37

圖 5.8 將拍好的照片直接在上面做文字編輯 圖 5.9 傳送電子郵件 38

第六章 結論 長達一年的專題製作就這樣告一段落, 雖然過程中會遇到一些問題, 但在老師耐心指導下, 終於完成本次專題製作, 也明瞭 RS232 不只是一個九孔插頭, 它甚至可以拿來應用在軟體執行上, 而這一次, 用來實現在影像大頭貼地遠端監控上 本專題主要是用 CmoreCloud & C# 來弄出可以依照不同的 ASCII 碼遠端操控的影像大頭貼遙控器, 其次是設計相框底圖 如果可以, 希望可以將這一年弄的東西, 如期有一個專屬遙控器 可以替影像大頭貼傳達指令 39

參考文獻 [1] Visual Basic 與 RS232 串列通訊控制 ( 汰捷資訊范逸之 陳立元 賴俊朋編著 ) [2] http://zh.wikipedia.org/wiki/wikipedia:%e9%a6%96%e9%a1%b5 ( 維基百科 ) [3] http://baike.baidu.com/ ( 百度百科 ) [4] http://www.sunfar.com.tw/dirdesc.aspx?dict_no=c0125 [5] http://www.dotblogs.com.tw/billchung/archive/2012/01/04/64319.aspx 40

附錄 ( 參賽獎狀 ) 41