Swift Girls aims to give tools for girls and women to build their ideas. https://www.facebook.com/groups/1260405513988915/?fref=ts 專為女生成立的討論社群 ，不定期辦免費講座(基礎課程)，以及一起來 free coding討論等聚會，希望不斷推廣而有更多女生一同透過交流學習，一起了解ios開發並能互相切磋，歡迎對Swift語言有興趣的一起加入！ 發問解答工具 1. Github(程式碼儲存庫), stackOverFlow 2. google 大神 3. 社群發問 這次的範例 https://github.com/Avonee/swiftGirlsChatroom

1. 2 0 1 7 . 1 1 . 1 1
by 雅⽅方
Swift girls (iOS)
4
Chat room DIY

2. S W I F T G I R L S ( I O S)
Swift Girls aims to give tools for girls and women to
build their ideas.
希望不斷推廣⽽而有更更多女⽣生⼀一同透過交流學習，⼀一起
了了解ios開發並能互相切磋，歡迎對Swift語⾔言有興趣的
⼀一起加入！
專為Swift新⼿手展開的第⼀一次”探勘“⾏行行動
雅⽅方比女⼈人更更了了解女⼈人的雅⽅方
也是雅⽅方冰淇淋淋的雅⽅方
雅⽅方⽺羊⾁肉爐的雅⽅方
by 雅⽅方
2 0 1 7 . 1 1 . 1 1

3. S W I F T G I R L S ( I O S)
學習資源 線上網上各式各樣影片⽂文件無所不有！！！
在這裡 可以有老師教練們給你來來問問題
可以有夥伴跟你⼀一起討論 (給你問⽩白癡的問題!?XD)
網上線上 都比不上實際⾯面對⾯面操作實作與立即性的討論
by 雅⽅方
看⼤大⼤大們debug 回家後你們也可以互相討論 ⾃自⼰己debug :)
重點是 能有⼀一起學習的夥伴 ⼀一起成長 :)
2 0 1 7 . 1 1 . 1 1

4. S W I F T G I R L S ( I O S)
深深感受到...
以前看別⼈人寫程式會學到三成功⼒力力,
經過⾃自⼰己下⾺馬打程式可學到七成功⼒力力,
教別⼈人寫程式,
by 雅⽅方
你會學到比你想像的功⼒力力還要多⼗十成！ :)
2 0 1 7 . 1 1 . 1 1

5. S W I F T G I R L S ( I O S)
就是那些年年...
三個師兄師弟輕功⽔水上飄的感⼈人故事...
by 雅⽅方圖片來來源：http://kanema.pixnet.net/blog/post/33866276-150905-葉師⽗父練功之無徒⼀一⾝身輕
2 0 1 7 . 1 1 . 1 1

6. by 雅⽅方
發問解答⼯工具
1. Github(程式碼儲存庫), stackOverFlow
2. google ⼤大神
3. 社群發問
這次範例例Github:
https://github.com/Avonee/swift-girls-meetig_teachin
2 0 1 7 . 1 1 . 1 1
S W I F T G I R L S ( I O S)

7. S W I F T G I R L S ( I O S)
by 雅⽅方
A. ⼯工具介⾯面
完成版⾯配置＆宣告
圖⽚遮罩（補充）
B. 免費開發者
放在⾃⼰的⼿機裡執⾏,實機GO!!!
2 0 1 7 . 1 1 . 1 1

8. 改 變 世 界
by 雅⽅方
2 0 1 7 . 1 1 . 1 1

9. OU R G OA L
by 雅⽅方參參考這次範例例 git hub： https://github.com/Avonee/swift-girls-meetig_teaching
2 0 1 7 . 1 1 . 1 1

10. P RO C E S S
by 雅⽅方
View Controller View Controller.swift 程式與介⾯面連結
connect
排版囉！！！
2 0 1 7 . 1 1 . 1 1

11. by 雅⽅方
View Controller View Controller.swift
到底有蝦米？
—> 宣告 connect
IB = Interface Builder
2 0 1 7 . 1 1 . 1 1

12. S TA R T ! ! !
by 雅⽅方
2 0 1 7 . 1 1 . 1 1

13. ⽬ 標 1 :
完 成 版 ⾯ 配 置 ＆ 宣 告
by 雅⽅方
2 0 1 7 . 1 1 . 1 1

14. by 雅⽅方
⽬ 標 1 : 完 成 版 ⾯ 配 置 ＆ 宣 告
命名資料（取有意義的名字很重要！！！）
ex: aa —> Who are you！？...
I…I’m sorry~我不知道XD
ex: name —-> Who are you！？…
I...i’m~⽤用膝蓋想也知道放名字齁XD
2 0 1 7 . 1 1 . 1 1

15. by 雅⽅方
⽬ 標 1 : 完 成 版 ⾯ 配 置 ＆ 宣 告
let（不可變動-常數）
let name:String = “Swift girls”
—-> “Swift girls”
var name:String = “Swift girls”
name = “Avon”
—->”Avon”
var（可變動-變數）
2 0 1 7 . 1 1 . 1 1

16. by 雅⽅方
⽬ 標 1 : 完 成 版 ⾯ 配 置 ＆ 宣 告
let（不可變動-常數）
let name = “Swift girls”
—> “Swift girls”
var name = “Swift girls”
name = “Avon”
—>”Avon”
var（可變動-變數）
屬 性 可 省 略略 ～
var email = “” ——>就知道你是String了了！
2 0 1 7 . 1 1 . 1 1

17. ⽬ 標 1 : 完 成 版 ⾯ 配 置 ＆ 宣 告
by 雅⽅方
2 0 1 7 . 1 1 . 1 1
1
2 3
1
2
3

18. ⽬ 標 2 :
圖 ⽚ 遮 罩 （ 補 充 ）
by 雅⽅方
2 0 1 7 . 1 1 . 1 1

19. by 雅⽅方
⽬ 標 2 : 圖 ⽚ 遮 罩
2 0 1 7 . 1 1 . 1 1

20. 免 費 開 發 者
by 雅⽅方
實 機 測 試
R E A DY G O ! ! !
2 0 1 7 . 1 1 . 1 1

21. by 雅⽅方
必須xcode & iPhone 都是更更新狀狀態 （相符合版本）
相合才相契～～～>/////<
2 0 1 7 . 1 1 . 1 1

22. by 雅⽅方
⼀一開始需要叫你 fix issue
接著 add Apple ID account
2 0 1 7 . 1 1 . 1 1

23. by 雅⽅方
輸入⾃自⼰己的喔！！！！
或者⽤用xcode —> preferences 打開
2 0 1 7 . 1 1 . 1 1

24. by 雅⽅方
進入之後 可以看到⾃自⼰己的開發者資料
按右下⽅方的“view Detail”
2 0 1 7 . 1 1 . 1 1

25. by 雅⽅方
• create "IOS Development” 產⽣生開發憑證
• ⼿手機部分
設定“信任”⾃自⼰己的開發者帳號所產⽣生的app 就成功囉！ ：）
⼀一般 —> 裝置管理理—> 找⾃自⼰己的Apple ID —> 信任
2 0 1 7 . 1 1 . 1 1

26. Q & A
by 雅⽅方
2 0 1 7 . 1 1 . 1 1

27. C A M E R A G O ! ! !
by 雅⽅方
2 0 1 7 . 1 1 . 1 1

28. by 雅⽅方
拍照
從⼿手機取得照片 儲存照片到⼿手機
C A M E R A 基 本 三 件 事
2 0 1 7 . 1 1 . 1 1

29. by 雅⽅方
記得info.plist
必須告訴使⽤者需要使⽤者權限
取⽤用相機和相簿說明
Error: This app has crashed because it attempted to access privacy-
sensitive data without a usage description…. Info.plist must contain
an NSCameraUsageDescription key with a string value…
2 0 1 7 . 1 1 . 1 1

30. by 雅⽅方
記得info.plist
必須告訴使⽤者需要使⽤者權限
取⽤用相機和相簿說明新版Xcode9 iOS11 需再新增
“把拍照相片加入相簿”取⽤用權限
2 0 1 7 . 1 1 . 1 1

31. UIImagePickerController
•sourceType:
UIImagePickerControllerSourceType
camera - 直接開相機
photoLibrary - 所有相簿 or 內建相簿資料庫 (Default) ex: Photos
savedPhotoAlbum - 所有照片 ex: Moments
•delegate:
UIImagePickerControllerDelegate
UINavigationControllerDelegate
by 雅⽅方
2 0 1 7 . 1 1 . 1 1

32. 實作Camera-1/4
by 雅⽅方
import framework
2 0 1 7 . 1 1 . 1 1

33. by 雅⽅方
實作Camera-2/4
宣告介⾯面
拿照片按鈕
拍照按鈕
2 0 1 7 . 1 1 . 1 1

34. by 雅⽅方
實作Camera-3/4
2 0 1 7 . 1 1 . 1 1

35. by 雅⽅方
實作Camera-4/4
2 0 1 7 . 1 1 . 1 1

36. by 雅⽅方
Firebase x chat room
2 0 1 7 . 1 1 . 1 1

37. by 雅⽅方
Firebase
Firebase 提供及時雲端資料庫（Realtime Database），開發⼈人員不需
要⾃自⼰己建置資料庫及架設伺服器，就能讓iOS, Android, Web 透過
Firebase提供的API儲存或讀取雲端上的資料．
被Google收購後更更推出多項新功能，ex: 分析雲端訊息，檔案儲存，
測試平台...等創新功能．
參參考：https://tw.alphacamp.co/2016/07/22/firebase/
2 0 1 7 . 1 1 . 1 1

38. by 雅⽅方https://firebase.google.com/
Firebase⽂文件
專案區
2 0 1 7 . 1 1 . 1 1

39. by 雅⽅方
管理第三⽅套件
• CocoaPods
• Carthage
• Manually
2 0 1 7 . 1 1 . 1 1

40. by 雅⽅方
CocoaPods
• https://cocoapods.org
• 安裝 CocoaPods
$ sudo gem install cocoapods
• 到⾃自⼰己的專案⽬目錄下，初始化pod
$ pod init
2 0 1 7 . 1 1 . 1 1

41. by 雅⽅方
CocoaPods
• 編輯 Podfile
$ nano Podfile
(或直接打開Podfile)
• 加入套件
pod 'Firebase/Core'
pod 'JSQMessagesViewController'
• 安裝 pod (須關閉Xcode)
$ pod install
2 0 1 7 . 1 1 . 1 1

42. by 雅⽅方
JSQMessagesViewController
• GitHub
https://github.com/jessesquires/JSQMessagesViewController
• 範例例專案
https://github.com/firebase/ios-swift-chat-example
2 0 1 7 . 1 1 . 1 1

43. 實作-firebase建⽴專案
2 0 1 7 . 1 1 . 1 1

44. by 雅⽅方
實作-編輯AppDelegate
• import Firebase
• 在didFinishLaunchingWithOptions設定Firebase
FirebaseApp.configure( )
2 0 1 7 . 1 1 . 1 1

45. by 雅⽅方
實作-⾃製聊天室
• Storyboard 拉UI, 並宣告
UITextView, UITextField, UIButton
• ViewController
import Firebase
class繼承UITextFieldDelegate
2 0 1 7 . 1 1 . 1 1

46. by 雅⽅方
實作-⾃製聊天室（code部分）
2 0 1 7 . 1 1 . 1 1

47. by 雅⽅方
2 0 1 7 . 1 1 . 1 1
實作-⾃製聊天室（code部分）

48. by 雅⽅方
2 0 1 7 . 1 1 . 1 1
實作-⾃製聊天室（code部分）

49. by 雅⽅方
⽤套件⽅法
2 0 1 7 . 1 1 . 1 1

50. by 雅⽅方
實作-套件聊天室
• Storyboard 拉UI, 並宣告
UITextView, UITextField, UIButton
• ViewController
import Firebase
import JSQMessagesViewController
class繼承JSQMessagesViewController
不⽤用拉UI套件都做好囉！
2 0 1 7 . 1 1 . 1 1

51. by 雅⽅方
實作-套件聊天室
直接看範例例喔！！！
2 0 1 7 . 1 1 . 1 1

52. by 雅⽅方
補充
2 0 1 7 . 1 1 . 1 1

53. by 雅⽅方
初 探 P L AY G ROU N D
語 法 介 紹
R E A DY G O ! ! !
2 0 1 7 . 1 1 . 1 1

54. • Conditional Statements
If (if…else…)
Switch (switch…case…)
• For-In Loops
• While Loops
神奇語法 Play ground 遊樂園
2 0 1 7 . 1 1 . 1 1

55. by 雅⽅方
⽬ 標 1 : C O N D I T I O N A L S TAT E M E N T S
2 0 1 7 . 1 1 . 1 1

56. by 雅⽅方
⽬ 標 1 : C O N D I T I O N A L S TAT E M E N T S
If
(if…else…)
Switch
(switch…case…)
只有少數可能的結果
&簡單的條件
適合有多個可能的排列列
&更更複雜的條件
2 0 1 7 . 1 1 . 1 1

57. by 雅⽅方
⽬ 標 1 : C O N D I T I O N A L S TAT E M E N T S
If
(if…else…)
只有少數可能的結果
&簡單的條件
2 0 1 7 . 1 1 . 1 1

58. by 雅⽅方
⽬ 標 1 : C O N D I T I O N A L S TAT E M E N T S
If
(if…else…)
只有少數可能的結果
&簡單的條件
2 0 1 7 . 1 1 . 1 1

59. by 雅⽅方
⽬ 標 1 : C O N D I T I O N A L S TAT E M E N T S
If
(if…else…)
只有少數可能的結果
&簡單的條件
加了了⼀一個(篩選)條件
⽤用 else if
2 0 1 7 . 1 1 . 1 1

60. by 雅⽅方
⽬ 標 1 : C O N D I T I O N A L S TAT E M E N T S
If
(if…else…)
只有少數可能的結果
&簡單的條件
48不符合前⾯面兩兩個條件,就不做任何事情
2 0 1 7 . 1 1 . 1 1

61. by 雅⽅方
⽬ 標 1 : C O N D I T I O N A L S TAT E M E N T S
Switch
(switch…case…)
適合有多個可能的排列列
&更更複雜的條件
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/ControlFlow.html#//
apple_ref/doc/uid/TP40014097-CH9-ID120
2 0 1 7 . 1 1 . 1 1

62. by 雅⽅方
⽬ 標 1 : C O N D I T I O N A L S TAT E M E N T S
Switch
(switch…case…)
適合有多個可能的排列列
&更更複雜的條件
2 0 1 7 . 1 1 . 1 1

63. by 雅⽅方
⽬ 標 1 : C O N D I T I O N A L S TAT E M E N T S
Switch
(switch…case…)
適合有多個可能的排列列
&更更複雜的條件
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/ControlFlow.html#//
apple_ref/doc/uid/TP40014097-CH9-ID120
2 0 1 7 . 1 1 . 1 1

64. by 雅⽅方
⽬ 標 1 : C O N D I T I O N A L S TAT E M E N T S
Switch
(switch…case…)
適合有多個可能的排列列
&更更複雜的條件
2 0 1 7 . 1 1 . 1 1

65. by 雅⽅方
⽬ 標 1 : C O N D I T I O N A L S TAT E M E N T S
Switch
(switch…case…)
適合有多個可能的排列列
&更更複雜的條件
where 的結合應⽤用:
⽤用where來來檢查附加條件
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/ControlFlow.html#//
apple_ref/doc/uid/TP40014097-CH9-ID120
2 0 1 7 . 1 1 . 1 1

66. by 雅⽅方
⽬ 標 1 : C O N D I T I O N A L S TAT E M E N T S
temperature? score(90up, 80~90, 70~80…)..? height?…
2 0 1 7 . 1 1 . 1 1

67. ⽬ 標 2 :
F O R- I N LO O P S
by 雅⽅方
2 0 1 7 . 1 1 . 1 1

68. by 雅⽅方
⽬ 標 2 : F O R- I N LO O P S
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/ControlFlow.html#//
apple_ref/doc/uid/TP40014097-CH9-ID120
1. (…) 包含1~5
2. * 代表乘法
3. print(“(參參數)”)
2 0 1 7 . 1 1 . 1 1

69. by 雅⽅方
⽬ 標 2 : F O R- I N LO O P S
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/ControlFlow.html#//
apple_ref/doc/uid/TP40014097-CH9-ID120
1. [ ,,,]矩陣 array
2. print(“(參參數)”)
2 0 1 7 . 1 1 . 1 1

70. by 雅⽅方
⽬ 標 2 : F O R- I N LO O P S
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/ControlFlow.html#//
apple_ref/doc/uid/TP40014097-CH9-ID120
1. [ ,,,]矩陣,可以放key,value的dictionary
2. print(“(參參數)”)
3. for 迴圈內可以放多個變數
2 0 1 7 . 1 1 . 1 1

71. by 雅⽅方
⽬ 標 2 : F O R- I N LO O P S
5+…+15=?
200+ … +300 = ?
考不倒我拉～～～哈哈哈！！！
2 0 1 7 . 1 1 . 1 1

72. ⽬ 標 3 :
W H I L E LO O P S
by 雅⽅方
2 0 1 7 . 1 1 . 1 1

73. by 雅⽅方
⽬ 標 3 : W H I L E LO O P S
while 當是這個情況下{
執⾏行行動作
}
repeat 重複{
執⾏行行動作
}while 當不是這個情況下停⽌止
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/ControlFlow.html#//
apple_ref/doc/uid/TP40014097-CH9-ID120
2 0 1 7 . 1 1 . 1 1

74. by 雅⽅方
⽬ 標 3 : W H I L E LO O P S
while 當是這個情況下{
執⾏行行動作
}
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/ControlFlow.html#//
apple_ref/doc/uid/TP40014097-CH9-ID120
while 當是30的情況下{
印出...
}
範例例：
2 0 1 7 . 1 1 . 1 1

75. by 雅⽅方
⽬ 標 3 : W H I L E LO O P S
repeat 重複{
執⾏行行動作
}while 當不是這個情況下停⽌止
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/ControlFlow.html#//
apple_ref/doc/uid/TP40014097-CH9-ID120
repeat 重複{
執⾏行行動作
}while 不是30的情況下停⽌止
（（範例例代表現在是30
範例例：
2 0 1 7 . 1 1 . 1 1

76. P L AY G ROU N D 遊 樂 園 應 ⽤ WO W
by 雅⽅方
Game
or⾃製Gif XD藝術美感
2 0 1 7 . 1 1 . 1 1

77. P L AY G ROU N D 遊 樂 園 應 ⽤ WO W
by 雅⽅方
⾃製Gif
named後⾯的名稱是⾃⼰圖⽚的名稱喔！
2 0 1 7 . 1 1 . 1 1

78. Q & A
by 雅⽅方
2 0 1 7 . 1 1 . 1 1