快速上手
# PinToo快速上手
文件將引導使用者實現從零開始建立HelloWorld程式,從而實現對PinToo基礎操作的瞭解。如果您尚未安裝PinToo請參閱PinToo安裝及解除安裝。在使用PinToo之前,您需要先了解什麼是PinToo,它的作用以及運行的原理。
# 1. PinToo簡介
PinToo是愛招飛推出的一款基於移動設備的快速開發平臺。通過該平臺,您無需瞭解Android的特性就可以快速開發屬於您的APP。在該應用上,您可查詢報表,填寫簡易表單,實現設備的通訊連線,檢視監控錄像……只要你能想到的運用都可以使用該平臺來實現。在PC端進行設計后,可立刻將更新同步至移動設備端,實現無縫升級。
# 2. 運行原理
PinToo 設計器端將程式設計完成後,可通過離線同步的方式將程式發送至指定的設備上實現更新,也可以將數據同步至TARS雲端伺服器,移動設備通過連線雲端伺服器實現更新,PinToo在移動端可以進行簡單數據採集,監控以及管理系統的功能,與TARS保持實時的互動通訊。
# 3. 打開PinToo Design程式
雙擊桌面上的PinToo Design
快捷方式打開程式。
如果是在註冊完成後的首次啟動時,通常會彈出如下圖所示的警報提示,此處需勾選專用網路
以及公用網路
,然後單擊[允許訪問(A)]
。
# 3.1. 登錄
進入登錄界面,預設使用者為admin,密碼為空,使用資料庫名稱為預設,點選[登錄]
按鈕進入到主界面。
# 4. 產品註冊
PinToo 設計器在安裝完成後是未註冊版本,該版本中不能使用儲存等相關功能,如需要使用此功能需進行註冊。詳見PinToo安裝配置中關於註冊部分的說明。
# 5. 第一個移動端程式HelloWorld
在這裡,我們將引導您完成在PinToo上的第一個程式HelloWorld
。
# 5.1. 新增模組
退出PinToo設計器,重新打開PinToo設計器,打開至登錄界面。將PinToo 帳套名稱改為 TEST
,點選 [登錄]
按鈕。
# 5.1.1. 展開功能表欄
點選左上角的按鈕展開功能表項。
# 5.1.2. 進入模組設計模組
在展開的功能表欄中,點選[模組設計]
項,打開模組設計界面。
# 5.1.3. 新增功能表
在該界面下,點選[新增]
按鈕,打開新增模組對話方塊。
新增模組
對話方塊中,填寫模組名稱為Home
,標題為HelloWorld
。
填寫完成後,點選[儲存]
按鈕以完成模組新增。
# 5.2. 模組設計
點選剛才建立的模組專案,點選上方的[設計]
按鈕進入到設計界面。
# 5.2.1. 拖放控制元件
拖放控制元件的操作如下:點選標準
選項卡中的第二個圖示(TfxButton)(①所指示元件),即選擇該元件進行放置,然後點選控制元件設計區域,將控制元件放置於該點選區域的位置中(②所指示位置)。放置完成後顯示效果圖如下。
# 5.2.2. 修改屬性
模組設計界面的左下角顯示目前選中的控制元件的屬性以及事件資訊,現在需要對剛才拖放的按鈕進行屬性修改,比如將按鈕上的字改為其他自定義的內容。
①在控制元件設計區域單擊該按鈕以選中該控制元件,此時屬性列表中顯示的是按鈕對應的屬性內容。②可通過滑鼠滾輪滾動查詢其中的屬性,找到Text
,將其右側的內容由原先的fxButton1
修改爲HelloWorld
。
# 5.2.3. 新增事件
控制元件包含一些操作可用於觸發相應的事件。
①在控制元件設計區域單擊該按鈕以選中該控制元件,②左側的屬性列表上方右側箭頭單擊切換選項卡,切換至Events
列表,該列表中列出了該控制元件可用的事件。③在OnClick
右側的編輯框中雙擊以新增該事件。此時界面會由設計
跳轉至程式
,並在程式編輯欄中顯示編輯的程式資訊,其中包含了fxButton1OnClick
事件。
# 5.2.4. 填寫程式
在Procedure fxButton1OnClick(Sender: TObject);
中的begin
和end;
區域填寫程式,填寫的內容如下:
ShowMessage('HelloWorld');
填寫完成的程式編輯區樣式如下:
# 5.2.5. 儲存除錯
指令碼填寫完成後,點選模組左上角的第二個按鈕(下圖所示①處),將該模板儲存至資料庫。等待該按鈕變為灰色,儲存完成。單擊其左側的按鈕(下圖所示②處)以開啟除錯運行。
除錯運行的界面如下圖所示,點選視窗中的[HelloWorld]
按鈕,彈出新的訊息提示框並顯示HelloWorld
。
在該界面下,點選[確定]
以關閉訊息提示框。接著點選除錯窗體右上角的X
以關閉該視窗返回至設計界面。
# 5.3. 同步數據
# 5.3.1. PC端準備
PC端也要知道主機的IP地址。
按下鍵盤上的Windows+R組合按鍵,打開運行對話方塊。在編輯框中輸入cmd
,單擊[確定]
按鈕,打開命令提示符界面。
在命令提示符中輸入ipconfig
,輸入完成後按下Enter按鍵,以下會列出所有網絡卡的相關資訊,選擇與移動設備處於同一網路的網絡卡,檢視其IPv4地址,例如本示例中顯示的IP地址為192.168.0.122
,請記住您使用命令查詢到的IP地址,在接下來的訪問中會使用到。
# 5.3.2. 設備端設定及登陸
在設備端打開PinToo,在登陸界面處點選左上角打開功能表。
在該界面下,點選WEBSOCKET
選項卡。
在其中輸入地址資訊。此處填寫為PinToo Design設計器所在PC端的IP地址,請在此處輸入實際的地址。輸入完畢后,點選[儲存]
。然後點選右上角的功能表收縮返回至登錄界面。
主頁面將帳套由原先的 PinToo
修改爲 TEST
,點選[登入]
按鈕進入到主頁面。此時的主頁面為空。
# 5.3.3. PC端發佈與同步
快速預覽同步
在PC端點選PinToo Design 的手機按鈕。
彈出智能設備列表,選擇連線的設備,點選 [確定]
按鈕。
# 5.3.4. 測試運行
待智能設備上顯示載入提示后,同步完成,此時可進行操作,點選HelloWorld
按鈕,出現HelloWorld
的提示。
# 6. 結論
通過上述操作,您已經實現了PinToo基礎環境的搭建以及模組的設計運行,如果需要詳細瞭解PinToo中的相關功能可以參閱PinToo功能說明。