UIKit Framework - Swift

UIKit http://MobileDev.TW http://MobileDev.TW [FI 9GG DWgWlabWc KAB[e >cSmWhac] h[eZ Swift
[email protected] 1

UIKit http://MobileDev.TW http://MobileDev.TW [FI >cSmWhac] iOS 2

UIKit http://MobileDev.TW http://MobileDev.TW 常用的KA元件 +)  操作型元件 (+)  KA:feean 按鈕
(,)  KA9lWce;anecallWc v浮選單 (-)  KAIh[eUZ 開關 (.)  KAIl[VWc 滑動音量控制 (5)  KAIeWbbWc 計數器 (0)  KATWie>[WlV 單行文字輸入 (1)  KATWieL[Wh 多行文字輸入 (2)  KADSeWG[U]Wc 日期時間 (3)  KAG[U]WcL[Wh 滾軸選取 ,)  指示型元件 (+)  KA9Ue[g[ejAnV[USeacL[Wh 等待 (,)  KAGcaYcWddL[Wh 進度顯示 (-)  KA9lWce;anecallWc 警示跳出 (.)  KAGSYW;anecal 分頁 -)  顯示型元件 (+)  KAAmSYWL[Wh 圖片顯示 (,)  KAIUcallL[Wh 捲動顯示 (-)  KATSTlWL[Wh 條列顯示 .)  畫面與流程 3

UIKit http://MobileDev.TW http://MobileDev.TW +)操作型元件你來我往的高互動 4

UIKit http://MobileDev.TW http://MobileDev.TW KA:feean •  按鈕p使用者可以點擊o程式能做出回… •  設定按鈕標題r圖片等屬性 • 
按鈕狀態 5

UIKit http://MobileDev.TW http://MobileDev.TW 按按鈕顯示文字按w按鈕之後ov方顯示區出現文字 1.  2.  6

UIKit http://MobileDev.TW http://MobileDev.TW 按按鈕顯示文字 +)  >[lW à EWh GcajWUe
à 選擇 [FI à 9bbl[USe[an àI[nYlW L[Wh 9bbl[USe[an à EWiem 7

UIKit http://MobileDev.TW http://MobileDev.TW 按按鈕顯示文字 ,)  輸入名稱;l[U]TaIZah à EWie 8

UIKit http://MobileDev.TW http://MobileDev.TW 按按鈕顯示文字 -)  點選deacjTaScVo拖曳t個lSTWl和t個Tfeean至目前唯t的g[Whv 9

UIKit http://MobileDev.TW http://MobileDev.TW 按按鈕顯示文字 .)  按住9leo再點選L[Wh;anecallWc)dh[Xe 10

UIKit http://MobileDev.TW http://MobileDev.TW 按按鈕顯示文字 5)  點選lSTWl((7按住;ecl((7往右拉o設定為FfelWe (( 7命名為lSTWl9cWS 11

UIKit http://MobileDev.TW http://MobileDev.TW 按按鈕顯示文字 0)  點選Tfeean((7按住;ecl((7往右拉o設定為9Ue[an ((7命名為TfeeanTa;l[U]o按w;annWUe 12

UIKit http://MobileDev.TW http://MobileDev.TW 按按鈕顯示文字 1)  L[Wh;anecallWc)dh[Xe àTfeeanTa;l[U] 13

UIKit http://MobileDev.TW http://MobileDev.TW 按按鈕顯示文字 2)  UammSnV&H執行測試 14

UIKit http://MobileDev.TW http://MobileDev.TW Oaf ScW lWScn[nYm •  可視元件 • 
KACSTWl •  KA:feean •  如何在程式中改變可視元件的屬性 •  如何在可視元件的特定事件發生時o執行要做的動作 15

UIKit http://MobileDev.TW http://MobileDev.TW CST)顯示按了幾w •  修改範例讓文字顯示區顯示目前按了幾w 16

UIKit http://MobileDev.TW http://MobileDev.TW CST 顯示按了幾w •  增加t個變數來記錄次數o初始值為* •  按鈕按w後o增加次數t次oz顯示
17

UIKit http://MobileDev.TW http://MobileDev.TW CST 按圖片按鈕顯示文字 •  按按鈕o按鈕的圖片會變twoy顯示文字(自動消失) 18

UIKit http://MobileDev.TW http://MobileDev.TW 佈局畫面 +)  在deacjTaScVv加入t個Tfeeanrt個lSTWl ,)  按鈕設定t張預設的圖片olSTWl的SlbZS值設為* 19

UIKit http://MobileDev.TW http://MobileDev.TW 按鈕事件？理 +)  lSTWl的SlbZS值設為+r設定文字內容 ,)  利用ecSnd[e[anM[eZL[Wh將SlbZS值兩秒鐘降為* 20

UIKit http://MobileDev.TW http://MobileDev.TW v浮選單換顏色 n 9lWce;anecallWc 21

UIKit http://MobileDev.TW http://MobileDev.TW 增加t個TSb GWdefcW到畫面v 22

UIKit http://MobileDev.TW http://MobileDev.TW 設定TSb GWdefcW的FfelWe與9Ue[an 23

UIKit http://MobileDev.TW http://MobileDev.TW 設定TSb GWdefcW的@SnVlWc 24

UIKit http://MobileDev.TW http://MobileDev.TW 設定TSb GWdefcW的@SnVlWc 25

UIKit http://MobileDev.TW http://MobileDev.TW 將eSb手勢加在畫面v 26

UIKit http://MobileDev.TW http://MobileDev.TW KAIh[eUZ 27

UIKit http://MobileDev.TW http://MobileDev.TW CST+)按按鈕切換開關 +)  在deacjTaScV中加入dh[eUZrTfeean ,)  建立程式關聯性 -) 
按w按鈕時o判斷dh[eUZ的狀態o切換成另t種 28

UIKit http://MobileDev.TW http://MobileDev.TW CST CST,)當使用者直接觸控開關切換狀態時o如何得知？ CST-)如何區分畫面v多個開關被切換？
29

UIKit http://MobileDev.TW http://MobileDev.TW (.)KAIl[VWc 30

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KAIl[VWc +)  在deacjTaScV中加入dl[VWcrlSTWl ,)  加入程式關聯性 -) 
當dl[VWc的值改變時o就更新lSTWl所顯示的數值 31 .)  t開始時oCSTWl即顯示目前的Il[VWc數值

UIKit http://MobileDev.TW http://MobileDev.TW CST,)轉向將dl[VWc轉向成直的 32

UIKit http://MobileDev.TW http://MobileDev.TW CST-)顯示增值 •  加t顆按鈕o每按t次odl[VWc的值就增加 33

UIKit http://MobileDev.TW http://MobileDev.TW KAIeWbbWc 34

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KAIeWbbWc +)  在deacjTaScV中加入IeWbbWcrCSTWl ,)  設定IeWbbWc的行為9feacWbWSer;ane[nfafd -) 
建立程式關聯性 .)  當IeWbbWc改變時o設定CSTWl的顯示文字 35

UIKit http://MobileDev.TW http://MobileDev.TW CST, •  利用KAIeWbbWc來控制KAIl[VWco同時顯示數值 36

UIKit http://MobileDev.TW http://MobileDev.TW KATWie>[WlV 37

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KATWie>[WlV +)  佈置deacjTaScV如w圖 UITextField UIButton UILabel
Bar Button Navigation Bar UITextField 38

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KATWie>[WlV ,)  第t個eWieX[WlV設定BWjTaScV TjbW為=(mS[l -)  第二個eWieX[WlV勾選IWUfcW
TWie =necj .)  兩個畫面連接(x是用Tfeean連o從L[Wh;anecallWc 拉出)o設定如w 5)  第t個畫面程式關聯性如w 39

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KATWie>[WlV 0)  新增檔案IWUanVL[Wh;anecallWc)dh[Xeoz 於IeacjTacSV中o設定對…oz建立關聯性如w 40

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KATWie>[WlV 1)  判斷使用者輸入的資訊o確定正確–跳至wt畫面 41

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KATWie>[WlV 2)  設定TWie>[WlV的DWlWYSeWs當使用者打完姓名按 w=neWc時o則拿出打密碼的鍵盤o密碼打完o則收掉鍵盤s 42

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KATWie>[WlV 3)  在L[Wh;anecallWc)dh[Xe中o如何傳遞資料到wt 個畫面 +*) 在IWUanVL[Wh;anecallWc)dh[Xe中將資料顯示出來 43

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KATWie>[WlV ++) 按wDanW可以回到vt個畫面 44

UIKit http://MobileDev.TW http://MobileDev.TW Oaf ScW lWScn[nYm •  畫面連結的另t種方法(可加入判斷式) • 
如何將數值從第t個畫面傳到第二個畫面 •  虛擬鍵盤如何收起來 45

UIKit http://MobileDev.TW http://MobileDev.TW CST,)只顯示名字 •  讓第二頁的歡迎畫面的姓名o只出現WmS[l的8前面 •  zy變成首字大寫 46

UIKit http://MobileDev.TW http://MobileDev.TW CST,)只顯示名字 •  讓第二頁的歡迎畫面的姓名o只出現WmS[l的8前面 •  zy變成首字大寫 47

UIKit http://MobileDev.TW http://MobileDev.TW KATWieL[Wh 48

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KATWieL[Wh +)  佈置deacjTaScV如圖 49

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KATWieL[Wh ,)  程式關聯性 50

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KATWieL[Wh -)  t開始o兩顆按鈕先停止作用 .)  使用者開始修改文字時o先將既有的內容存t份 51

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KATWieL[Wh 5)  使用者在修改文字時o允許使用v面兩顆按鈕o編輯完畢o就停止使用按鈕 52

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KATWieL[Wh 0)  ：使用者按wfnVao就用舊的內容取代目前的內容 1)  使用者按w完成o則收起鍵盤 53

UIKit http://MobileDev.TW http://MobileDev.TW (2)KADSeWG[U]Wc 54

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KADSeWG[U]Wc +)  在deacjTaScVvo加入lSTWlrTfeeanrVSeWG[U]Wc ,)  與程式連結產生關係 55

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KADSeWG[U]Wc -)  VSeWG[U]Wc預設為隱藏rVSeW DaVW .)  加入兩個9Ue[anot個從按鈕ot個從VSeWG[U]Wc
56

UIKit http://MobileDev.TW http://MobileDev.TW CST,)顯示年紀 57

UIKit http://MobileDev.TW http://MobileDev.TW KAG[U]WcL[Wh Component Row 58

UIKit http://MobileDev.TW http://MobileDev.TW G[U]WcL[Wh :Sd[U +)  An IeacjTaScV' SVV
lSTWlrTfeeanrb[U]WcL[Wh ,)  ;cWSeW cWlSe[andZ[b TWehWWn IeacjTaScV!;aVWp

UIKit http://MobileDev.TW http://MobileDev.TW G[U]WcL[Wh :Sd[U -)  9e X[cde' [n[e[Sl
eZW SccSj'd VSeS) .)  9VV those delegate methods related to b[U]WcL[Wh

UIKit http://MobileDev.TW http://MobileDev.TW G[U]WcL[Wh :Sd[U 5)  MZWn eZW Tfeean
Ul[U]d' dZah eZW dWlWUeWV eWie Se lSTWl)

UIKit http://MobileDev.TW http://MobileDev.TW 9VV macW UambanWned! •  9VV ,
macW UambanWned [n eZW b[U]WcL[Wh)

UIKit http://MobileDev.TW http://MobileDev.TW 9VV macW UambanWned! •  SVV ,
macW 9ccSjd) •  G[gW [n[e[Sl gSlfW ea eZWdW , nWh SccSjd)

UIKit http://MobileDev.TW http://MobileDev.TW 9VV macW UambanWned! •  9VV eZ[d
mWeZaV ea dbWU[Xj eZW nfmTWc aX UambanWned ea -) •  TZW nfmTWc aX Hahd [n UambanWne [d VWbWnV an Zah mSnj [eWmd [n UaccWdband[gW SccSj)

UIKit http://MobileDev.TW http://MobileDev.TW 9VV macW UambanWned! •  TZW e[elW
Xac cah Slda VWbWnV an eZW dbWU[X[WV [em [n UaccWdband[gW SccSj) •  MZWn fdWc Ul[U] eZW Tfeean' lSTWl dZahd Sll eZW e[elW Xac dWlWUeWV Hahd [n UaccWdband[gW UambanWne

UIKit http://MobileDev.TW http://MobileDev.TW Kd[nY =maj[ Xac Hah Se G[U]Wc

UIKit http://MobileDev.TW http://MobileDev.TW •  - Xac nfmTWc aX UambanWned [n
b[U]Wcg[Wh' SnV +** Xac nfmTWc aX cahd [n UambanWne Kd[nY =maj[ Xac Hah Se G[U]Wc

UIKit http://MobileDev.TW http://MobileDev.TW •  ;cWSeW - SccSjd ea deacW WSUZ
cah [n WgWcj UambanWned' SnV + SccSj Xac =maj[ [Uand Kd[nY =maj[ Xac Hah Se G[U]Wc

UIKit http://MobileDev.TW http://MobileDev.TW •  An[e[Sl[kW WSUZ [eWmd [n - SccSjd'
deacW cSnVam nfmTWc Xcam * ea 3) Kd[nY =maj[ Xac Hah Se G[U]Wc

UIKit http://MobileDev.TW http://MobileDev.TW •  TZW =maj[ an cah [n WSUZ
UambanWne [d UaccWdbanV ea eZW nfmTWc [n WSUZ SccSj) Kd[nY =maj[ Xac Hah Se G[U]Wc

UIKit http://MobileDev.TW http://MobileDev.TW •  MZWn eZW Tfeean [d Ul[U]WV' mS]Wd
eZW mSUZ[nW ea call' SnV eWll [e'd h[n ac nae) •  HSnVam nfmTWc TWehWWn - l 30' bcWgWne Wmbej cah cWgWSl [n WSUZ UambanWne Kd[nY =maj[ Xac Hah Se G[U]Wc

UIKit http://MobileDev.TW http://MobileDev.TW Oaf ScW lWScn[nYm •  KAG[U]WcL[Wh的運用 • 
遵循GcaeaUalr實作方法 •  用9ccSj儲存資料r取出資料r回傳數量 •  亂數的使用 •  KAG[U]WcL[Wh跳到特定Hah •  自訂方法r呼叫自訂方法 72

UIKit http://MobileDev.TW http://MobileDev.TW ,)指示型元件別讓你的使用者x知所措 73

UIKit http://MobileDev.TW http://MobileDev.TW KA9Ue[g[ejAnV[USeacL[Wh 74

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KA9Ue[g[ejAnV[USeacL[Wh +)  在deacjTaScV中加入AnV[USeacL[WhrTfeean ,)  可以設定AnV[USeac的樣式r顏色r初始狀態r停止時隱藏
-)  產生程式聯結 75

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KA9Ue[g[ejAnV[USeacL[Wh .)  設定按鈕按w後的行為 76

UIKit http://MobileDev.TW http://MobileDev.TW CSTp-秒後載入圖片 +)按w按鈕後o顯示等待指示ou秒後載入圖片 77

UIKit http://MobileDev.TW http://MobileDev.TW 設定圖片顯示 ,)加入t張圖片至專案o以及加入t個AmSYWL[Wh 78

UIKit http://MobileDev.TW http://MobileDev.TW 計時器 -)增加t個整數變數以及t個計時器 79

UIKit http://MobileDev.TW http://MobileDev.TW 按鈕事件？理 .)當按鈕按w後o啟動AnV[USeaco同時~計時o-秒之後o停止AnV[USeaco讓圖片顯示 80

UIKit http://MobileDev.TW http://MobileDev.TW KAGcaYcWddL[Wh 81

UIKit http://MobileDev.TW http://MobileDev.TW 顯示目前進度值以前面練習o加v顯示目前進度值 82

UIKit http://MobileDev.TW http://MobileDev.TW 畫面佈局 +)新增bcaYcWddL[WhobcaYcWdd設定為*r隱藏 83

UIKit http://MobileDev.TW http://MobileDev.TW 程式關聯性 ,)增加mjGcaYcWddL[Wh 84

UIKit http://MobileDev.TW http://MobileDev.TW 按鈕按w後o顯示bcaYcWddL[Wh -)顯示bcaYcWddL[Whr修改e[mWc 85

UIKit http://MobileDev.TW http://MobileDev.TW KA9lWce;anecallWc n 9lWce 86

UIKit http://MobileDev.TW http://MobileDev.TW CST+) KA9lWce;anecallWc n 9lWce +)做t個按鈕o當按鈕被按w時o執行p 87

UIKit http://MobileDev.TW http://MobileDev.TW CST+) KA9lWce;anecallWc n 9lWce ,)利用KA9lWce9Ue[an來設定按鈕文字r樣式以及？理器
88

UIKit http://MobileDev.TW http://MobileDev.TW CST+) KA9lWce;anecallWc n 9lWce -)利用SVV9Ue[an加入按鈕oz將9lWce秀在畫面v 89

UIKit http://MobileDev.TW http://MobileDev.TW CST,)利用9lWce;anecallWc驗證使用者帳號密碼 90

UIKit http://MobileDev.TW http://MobileDev.TW CST,)利用9lWce;anecallWc驗證使用者帳號密碼 +)建立t個按鈕o按w後觸發dZahCaY[n9lWce方法 ,)在方法中o建立KA9lWce;anecallWc的實體o選擇9lWce 樣式o然後加入兩個TWie>[WlV與其設定？理器 91

UIKit http://MobileDev.TW http://MobileDev.TW CST,)利用9lWce;anecallWc驗證使用者帳號密碼 -)加入取消與登入的按鈕 92

UIKit http://MobileDev.TW http://MobileDev.TW CST,)利用9lWce;anecallWc驗證使用者帳號密碼 .)將9Ue[an加至SlWce;anecallWcozy顯示SlWce;anecallWc 93

UIKit http://MobileDev.TW http://MobileDev.TW CST,)利用9lWce;anecallWc驗證使用者帳號密碼 5)在deacjTaScV中加入t個L[Wh ;anecallWcozy從第 t個畫面連線到第二個畫面o設定為GcWdWne DaVSllj 樣式ozyAVWne[X[Wc命名為laY[nIfUUWdd
94

UIKit http://MobileDev.TW http://MobileDev.TW CST,)利用9lWce;anecallWc驗證使用者帳號密碼 0)在L[Wh;anecallWc)dh[Xe中加t個方法p 1)IeacjTaScVo在第二個畫面加t個按鈕o按鈕拉線至橘色的=i[eo出現TSU]TaDS[no點選 95

UIKit http://MobileDev.TW http://MobileDev.TW KAGSYW;anecal 96

UIKit http://MobileDev.TW http://MobileDev.TW 手勢換頁 •  運用手勢來進行換頁 97

UIKit http://MobileDev.TW http://MobileDev.TW KAGSYW;anecal +)在deacjTaScV中加入[mSYWg[WhrbSYW;anecalr 兩個KAIh[bWGWdefcWHWUaYn[kWc(t左rt右)o兩個拉進同t個9Ue[an@SnVlWc 98

UIKit http://MobileDev.TW http://MobileDev.TW g[WhD[VCaSV() ,)設定圖片模式r屬性r第t張顯示圖片oz加v手勢辨識器 99

UIKit http://MobileDev.TW http://MobileDev.TW Ih[bW ？理器 -)判斷是向左還是向右o對…變更GSYW;anecal顯示 o以及圖片(記得加入圖片AmSYW*' AmSYW+' AmSYW,)
100

UIKit http://MobileDev.TW http://MobileDev.TW CST 自動輪播圖片隨時間自己會循環播放 101

UIKit http://MobileDev.TW http://MobileDev.TW g[WhD[VCaSV() 加入計時器 102

UIKit http://MobileDev.TW http://MobileDev.TW 設置t個變數Uafne 初始值為* 計時器每次觸發後o增加Uafneo再 -o循環在 * l
, 103

UIKit http://MobileDev.TW http://MobileDev.TW -)顯示型元件如何呈現出最好的t面 104

UIKit http://MobileDev.TW http://MobileDev.TW (+)KAAmSYWL[Wh 105

UIKit http://MobileDev.TW http://MobileDev.TW CST+)使用[mSYWL[Wh來作動畫 106

UIKit http://MobileDev.TW http://MobileDev.TW CST+)使用[mSYWL[Wh來作動畫 •  運用KAAmSYWL[Wh本身的動畫功能o播放多張圖片 107

UIKit http://MobileDev.TW http://MobileDev.TW Oaf ScW lWScn[nYm •  如何使用KAAmSYWL[Wh • 
KAAmSYWL[Wh如何製作動畫 •  如何從t張大圖剪w部分拿來運用 108

UIKit http://MobileDev.TW http://MobileDev.TW CST,)兩張圖片切換 •  改寫範例o變成兩張獨立的圖片進行切換 109

UIKit http://MobileDev.TW http://MobileDev.TW (,)KAIUcallL[Wh •  使用[GZanW瀏覽超過畫面大小的圖片 •  使用者可以縮小r放大圖片 • 
使用者可以vw左右移動畫面 110

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KAIUcallL[Wh +)  使用deacjTaScVo加入t個KAIUcallL[Wh ,)  建立程式關聯性以及[LSc 111

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KAIUcallL[Wh -)  在g[WhD[VCaSV中o設定AmSYWL[Who加入IUcallL[Wh 112

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KAIUcallL[Wh .)  在g[WhD[VCaSV中o設定IUcallL[Wh的相關參數 5)  在g[WhD[VCaSV中o設定t個CSTWl來顯示目前的縮放倍數
113

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KAIUcallL[Wh 0)  實作g[Wh>acPaam[nYAnIUcallL[Wh4來讓圖片可以縮放 114

UIKit http://MobileDev.TW http://MobileDev.TW CST+)KAIUcallL[Wh 1)  縮放動作完成時o顯示CSTWl來呈現縮放倍數 115

UIKit http://MobileDev.TW http://MobileDev.TW CST,)IUcallL[Wh & GSYW ;anecal 可左右捲動電影海報ozy有指示為第幾張海報 116

UIKit http://MobileDev.TW http://MobileDev.TW CST,)IUcallL[Wh & GSYW ;anecal +)  在畫面v佈局IUcall
L[Wh與GSYW ;anecal 117

UIKit http://MobileDev.TW http://MobileDev.TW CST,)IUcallL[Wh & GSYW ;anecal ,)  在專案中加入數張圖片後o在g[WhD[VCaSV中設
定IUcallL[Wh 118

UIKit http://MobileDev.TW http://MobileDev.TW CST,)IUcallL[Wh & GSYW ;anecal -)  繼續在g[WhD[VCaSV中o把IUcallL[Wh的基本設定完成
119

UIKit http://MobileDev.TW http://MobileDev.TW CST,)IUcallL[Wh & GSYW ;anecal .)  只讓水平方向可以捲動
120

UIKit http://MobileDev.TW http://MobileDev.TW CST,)IUcallL[Wh & GSYW ;anecal 5)  當第[個圖片停留在i為*的位置時o~對…地
將KAGSYW;anecal的UfccWneGSYW設定為[ 121

UIKit http://MobileDev.TW http://MobileDev.TW 常見畫面流程 122

UIKit http://MobileDev.TW http://MobileDev.TW CST+)ESg[YSe[an ;anecallWc •  運用IeacjTaScV建構如w畫面 123

UIKit http://MobileDev.TW http://MobileDev.TW CST,)TST:Sc ;anecallWc •  使用TSTTWV 9bbl[USe[an樣板 • 
然後自行加入第u個TST 124

UIKit http://MobileDev.TW http://MobileDev.TW CST-)TST&ESg •  基於TST(:SdWV結構o加入ESg[YSe[an(:SdWV 125

UIKit http://MobileDev.TW http://MobileDev.TW KA相關程式常忽略的步驟 •  勾選KA元件的兩項屬性 •  KdWc AneWcSUe[an
=nSTlWV •  Dfle[blW TafUZ •  設定DWlWYSeW的對象為自己 •  iii)VWlWYSeW6dWlX5 •  或將該KA元件的VWlWYSeW拉至該L[Wh ;anecallWc •  IWYfW AVWne[X[Wc •  在IeacjTaScV中設定oz注意大小寫 126

UIKit http://MobileDev.TW http://MobileDev.TW 手勢識別器 127

UIKit http://MobileDev.TW http://MobileDev.TW IeacjTaScV預覽裝置顯示 +)開啓輔助編輯器視窗 128

UIKit http://MobileDev.TW http://MobileDev.TW IeacjTaScV預覽裝置顯示 ,)點擊輔助編輯器v方o選擇GcWg[Wh(7deacjTaScV 129

UIKit http://MobileDev.TW http://MobileDev.TW IeacjTaScV預覽裝置顯示 -)點擊輔助編輯器w方的&o增加想要預覽的裝置 130

UIKit http://MobileDev.TW http://MobileDev.TW IeacjTaScV預覽裝置顯示 .)在deacjTaScV中試著移動元件o可看見在各裝置的變化 131

UIKit http://MobileDev.TW http://MobileDev.TW 讓元件在各裝置顯示t致 +)選取要設定的元件後o點擊w方工具列的G[no 將M[VeZ與@W[YZe打勾o然後按w9VV , ;andecS[ned
132

UIKit http://MobileDev.TW http://MobileDev.TW 讓元件在各裝置顯示t致 ,)請系統協助補足欠，的設定 133

UIKit http://MobileDev.TW http://MobileDev.TW 請系統直接設定9fea CSjafe +)選取要設定的元件後o回復至建議設限 134

UIKit http://MobileDev.TW http://MobileDev.TW 虛擬鍵盤 135

UIKit http://MobileDev.TW http://MobileDev.TW TSTlWL[Wh 條列式清單 ((7 各項目詳細內容 136

UIKit http://MobileDev.TW http://MobileDev.TW CST+)TSTlWL[Wh +)  使用DSdeWc(DWeS[l樣板 ,)  在DSdeWcL[Wh;anecallWc中o加入t個陣列來存放水果名稱與水果圖片檔案名稱
137

UIKit http://MobileDev.TW http://MobileDev.TW CST+)TSTlWL[Wh -)  在g[WhD[VCaSV中指派陣列的內容 138

UIKit http://MobileDev.TW http://MobileDev.TW CST+)TSTlWL[Wh .)  修改TSTlWL[Wh的項目數為水果陣列的物件數 139

UIKit http://MobileDev.TW http://MobileDev.TW CST+)TSTlWL[Wh 5)  修改TSTlWL[Wh的項目文字為水果陣列中的對…項目 0)  在deacjTaScV中o第二個畫面加入t個AmSYWL[Wh以及t個接收圖片檔名的變數oz建立畫面與程式關聯性
140

UIKit http://MobileDev.TW http://MobileDev.TW CST+)TSTlWL[Wh 1)  回到第t個畫面的控制檔o告知第二個畫面o使用者點了哪t個項目oz使用這個項目編號來查找水果名稱o指派給第二個畫面的變數 141

UIKit http://MobileDev.TW http://MobileDev.TW CST+)TSTlWL[Wh 2)  第二個畫面的控制檔的g[WhD[VCaSVo設定[mSYWL[W h要載入的圖片 142

UIKit http://MobileDev.TW http://MobileDev.TW CST,)標題 •  修正第二個畫面的標題 143

UIKit http://MobileDev.TW http://MobileDev.TW CST,)標題 +)  在第二個畫面的控制檔修改接收物件為9njFTjWUe ,)  在第t個畫面的控制檔的bcWbScW>acIWYfW中o將該對…字典整個傳遞過去
144

UIKit http://MobileDev.TW http://MobileDev.TW CST,)標題 -)  在第二個畫面控制檔的g[WhD[VCaSV中o用拿到的水果名稱來設定e[elWo~修改圖片檔名的接收方式 145

UIKit http://MobileDev.TW http://MobileDev.TW CST-)加入註解與圖片 146

UIKit http://MobileDev.TW http://MobileDev.TW CST-)加入註解與圖片 +)  加入u張.*i.*的水果小圖至專案 147

UIKit http://MobileDev.TW http://MobileDev.TW CST-)加入註解與圖片 ,)  在g[WhD[VCaSV中o加入水果英文檔名r小圖檔名 148

UIKit http://MobileDev.TW http://MobileDev.TW CST-)加入註解與圖片 .)  在UWll>acHah9eAnVWiGSeZ中o設定表格列的副標題文字以及縮圖 149

UIKit http://MobileDev.TW http://MobileDev.TW CST.)客製化UWll 150

UIKit http://MobileDev.TW http://MobileDev.TW CST.)客製化UWll +)  在deacjTaScV中o將eSTlWL[Wh;Wll的dejlW選成;fdeamo然後自行拉入想要的元件以及排列方式 151

UIKit http://MobileDev.TW http://MobileDev.TW CST.)客製化UWll ,)  選取各個你所加入的KA元件o設定eSY編號 152

UIKit http://MobileDev.TW http://MobileDev.TW CST.)客製化UWll -)  在第t個畫面的控制檔中的UWll>acHah9eAnVWiGSeZ o透過eSY編號來建立程式關聯性ozy將對…所需的內容指派進去 153

UIKit Framework - Swift

UIKit Framework - Swift

More Decks by Ryan Chung

Other Decks in Technology

Featured

Transcript