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/SwiftGirls2018

1. 2018.04.14
by 雅⽅方
Swift girls (iOS)
Workshop-Day1
collection view & open source 串串接 & Apple Map

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

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

4. 經過⾃自⼰己下⾺馬打程式可學到七成功⼒力力,
深深感受到...
以前看別⼈人寫程式會學到三成功⼒力力,
教別⼈人寫程式,
by 雅⽅方
你會學到比你想像的功⼒力力還要多⼗十成！ :)
Swift girls (iOS)
2018.04.14

5. 那些年年...
三個師兄師弟輕功⽔水上飄的感⼈人故事...
by 雅⽅方圖片來來源：http://kanema.pixnet.net/blog/post/33866276-150905-葉師⽗父練功之無徒⼀一⾝身輕
2018.04.14

6. by 雅⽅方
發問解答⼯工具
1. Github(程式碼儲存庫), stackOverFlow
2. google ⼤大神
3. 社群發問
這次範例例Github:
https://github.com/Avonee/SwiftGirls2018
2018.04.14

7. ⼯工作坊
2018.04.14 SAT.
10:00-11:00
⾃自介+⼤大綱
熟悉Xcode介⾯面
串串接到⼿手機（實機）
11:00-12:00
Autolayout+實作⼩小功能
12:00-13:30
午餐
13:30-18:00
教學 collection view + 串串接API
2018.04.15 SUN.
10:00-12:00
教學 Apple Map
12:00-13:30
午餐
13:30-16:30
working
16:30-17:30
Demo
2018.04.14

8. by 雅⽅方
A. ⼯工具介⾯面
完成版⾯配置＆宣告
B. 免費開發者
放在⾃⼰的⼿機裡執⾏,實機GO!!!
2018.04.14

9. 改變世界
by 雅⽅方
2018.04.14

10. process
by 雅⽅方
View Controller View Controller.swift 程式與介⾯面連結
connect
排版囉！！！
2018.04.14

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

12. start!!!
by 雅⽅方
2018.04.14

13. ⽬標:
完成版⾯配置＆宣告
by 雅⽅方
2018.04.14

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

15. by 雅⽅方
⽬標:完成版⾯配置＆宣告
let（不可變動-常數）
let name:String = " Swift girls "
// " Swift girls "
var name:String = " Swift girls "
name = " Avon "
// " Avon "
var（可變動-變數）
2018.04.14

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

17. 2018.04.14
DEMO
by 雅⽅方

18. 2018.04.14
征 服
不 同 機 種
AutoLayout
by 雅⽅方

19. by 雅⽅方
Auto ⾃自動
layout 佈局(排版)
2018.04.14

20. 透過”約束描述(鎖鏈)”
(constraints)來來排版
by 雅⽅方
ex: ⼤大⼿手叫⼩小⼿手必
須距離他1公分才
可以擊拳！！！
2018.04.14

21. by 雅⽅方
補充⼩小tips
Run time debug
2018.04.14

22. 補充⼩tips :p
2017.03.06
by 雅⽅方
Run time debug
補充⼩小tips
2018.04.14

23. 排版定位
從”座標系統”看起
by 雅⽅方
(x, y) width
height
( 0 , 0 )
B O X
3
5
8
7
2018.04.14

24. by 雅⽅方
(x, y) width
height
( 0 , 0 )
B O X
3
5
8
7
B O X 距 離 原 點 ( 0 , 0 )
⽔水 平 ⽅方 向 為 3 , 垂 直 ⽅方 向 為 5
B O X ⼤大 ⼩小 是
寬 度 為 8 , 長 度 為 7
描 述
排版定位
從”座標系統”看起
2018.04.14

25. by 雅⽅方
(x, y) width
height
( 0 , 0 )
B O X
3
5
8
7
描 述
(x:3, y:5, width:8, height:7)
Frame
排版定位
從”座標系統”看起
2018.04.14

26. by 雅⽅方
(x, y) width
height
( 0 , 0 )
B O X
10
8
5
3
Try…
2018.04.14

27. by 雅⽅方
autoLayout 基本定義
B O X
Leading
Button
Top
Trailing
C E N T E R H O R I Z O N TA L LY
C E N T E R V E RT I C A L LY
2018.04.14

28. by 雅⽅方
autoLayout 調整
不只像之前的只有靜態調整
(x, y)
width
height
( 0 , 0 )
B O X
3
5
8
7
(x:3, y:5, width:8, height:7)
(x, y)
width
height
( 0 , 0 )
B O X
3
5
3
5
靜 態 A U T O L AY O U T
依不同的SuperView”⾃自適應調整”
2018.04.14

29. by 雅⽅方
(x, y)
width
height
( 0 , 0 )
B O X
3
5
3
5
SuperView ＝ 300x100
(x:3, y:5, width:294, height:90)
Frame
width: 300-3-3 = 294
height: 100-5-5 = 90
autoLayout 調整
不只像之前的只有靜態調整
2018.04.14

30. by 雅⽅方
(x, y)
width
height
( 0 , 0 )
B O X
3
5
3
5
SuperView ＝ 600x234
(x:3, y:5, width:594, height:224)
Frame
width: 600-3-3 = 594
height: 234-5-5 = 224
autoLayout 調整
不只像之前的只有靜態調整
2018.04.14

31. by 雅⽅方
實作GO!
2018.04.14

32. 實作GO!
by 雅⽅方
⾃自動產⽣生藍藍⾊色輔助線＆AutoLayout選單...
2018.04.14

33. by 雅⽅方
• control+元件
—> 往(上/下/左/右)拉(拖曳)
—> 放開後即會顯⽰示autolayout 基本定義設定
除了了⾃自動產⽣生藍藍⾊色輔助線＆AutoLayout選單以外...
2018.04.14

34. 實作GO!
by 雅⽅方
• 右⼿手邊的Size inspector(直尺圖⽰示) 也會顯⽰示所設置的
autolayout設定
2018.04.14

35. by 雅⽅方
補充⼩tips
開啟可檢視不同機種的視窗：
Storyboard...四⼩小⽅方—> Preview—> option＋Preview
2018.04.14

36. by 雅⽅方
補充⼩tips :p
變成此畫⾯面：
2018.04.14

37. by 雅⽅方
補充⼩tips :p
“＋” 可選擇不同機種來來檢視：
2018.04.14

38. by 雅⽅方
每個view都可透過最下⽅方 圖⽰示“翻轉”檢視
2018.04.14

39. by 雅⽅方
開模擬器後...
Hardware：
可控制螢幕橫直向模擬
(也可回⾸首⾴頁,鎖螢幕..., 就像實機)
Window:
可控制模擬器在電腦螢幕的⼤大⼩小
2018.04.14

40. by 雅⽅方
直式螢幕稱為「Portrait」，橫式螢幕「Landscape」，
⾴頁⾯面會依照橫直螢幕不同⽽而改變形式的作法
稱之為「Auto Orientation」
要讓全部專案都是不變的⽅方向，也就是只允許直式螢幕：
改info.plist 中的”Supported interface orientations”
裡⾯只放⼀個即可 ：）
Portrait (bottom home button)
鎖螢幕⽅方向設定（如下⾴頁圖⽰示）
2018.04.14

41. by 雅⽅方
鎖螢幕⽅方向設定
2018.04.14

42. by 雅⽅方
進階:
Content compression resistance,
Content hugging,
Constraint Visual Format Language,
NSLayoutAnchor…
2018.04.14

43. 免費開發者
by 雅⽅方
實機測試
Ready GO!!!
2018.04.14

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

45. by 雅⽅方
⼀一開始需要叫你 fix issue
接著 add Apple ID account
2018.04.14

46. by 雅⽅方
輸入⾃自⼰己的喔！！！！
或者⽤用xcode —> preferences 打開
2018.04.14

47. by 雅⽅方
進入之後可以看到⾃自⼰己的開發者資料
按右下⽅方的“View Detail”
2018.04.14

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

49. Q&A
by 雅⽅方
2018.04.14

50. by 雅⽅方
補充

51. by 雅⽅方
⽬標1: Conditional Statements
If
(if…else…)
Switch
(switch…case…)
只有少數可能的結果
&簡單的條件
適合有多個可能的排列列
&更更複雜的條件

52. by 雅⽅方
⽬標1: Conditional Statements
If
(if…else…)
只有少數可能的結果
&簡單的條件

53. by 雅⽅方
⽬標1: Conditional Statements
If
(if…else…)
只有少數可能的結果
&簡單的條件

54. by 雅⽅方
⽬標1: Conditional Statements
If
(if…else…)
只有少數可能的結果
&簡單的條件
加了了⼀一個(篩選)條件
⽤用 else if

55. by 雅⽅方
⽬標1: Conditional Statements
If
(if…else…)
只有少數可能的結果
&簡單的條件
48不符合前⾯面兩兩個條件,就不做任何事情

56. by 雅⽅方
⽬標1: Conditional Statements
Switch
(switch…case…)
適合有多個可能的排列列
&更更複雜的條件
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/
ControlFlow.html#//apple_ref/doc/uid/TP40014097-CH9-ID120

57. by 雅⽅方
⽬標1: Conditional Statements
Switch
(switch…case…)
適合有多個可能的排列列
&更更複雜的條件

58. by 雅⽅方
⽬標1: Conditional Statements
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/
ControlFlow.html#//apple_ref/doc/uid/TP40014097-CH9-ID120
Switch
(switch…case…)
適合有多個可能的排列列
&更更複雜的條件

59. by 雅⽅方
⽬標1: Conditional Statements
Switch
(switch…case…)
適合有多個可能的排列列
&更更複雜的條件

60. by 雅⽅方
⽬標1: Conditional Statements
where 的結合應⽤用:
⽤用where來來檢查附加條件
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/
ControlFlow.html#//apple_ref/doc/uid/TP40014097-CH9-ID120
2017.11.11
Switch
(switch…case…)
適合有多個可能的排列列
&更更複雜的條件

61. by 雅⽅方
⽬標1: Conditional Statements
temperature? score(90up, 80~90, 70~80…)..? height?…

62. ⽬標2:
For-In Loops
by 雅⽅方

63. by 雅⽅方
⽬標2: For-In Loops
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/
ControlFlow.html#//apple_ref/doc/uid/TP40014097-CH9-ID120
A. (…) 包含1~5
B. * 代表乘法
C. print(“(參參數)”)
⽬標2: For-In Loops

64. by 雅⽅方
⽬標2: For-In Loops
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/
ControlFlow.html#//apple_ref/doc/uid/TP40014097-CH9-ID120
A. [ ,,,]矩陣 array
B. print(“(參參數)”)
⽬標2: For-In Loops

65. by 雅⽅方
⽬標2: For-In Loops
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/
ControlFlow.html#//apple_ref/doc/uid/TP40014097-CH9-ID120
A. [ ,,,]矩陣,可以放key,value的dictionary
B. print(“(參參數)”)
C. for 迴圈內可以放多個變數
⽬標2: For-In Loops

66. by 雅⽅方
⽬標2: For-In Loops
5+…+15=?
200+ … +300 = ?
考不倒我拉～哈哈哈！！！

67. ⽬標3:
While Loops
by 雅⽅方

68. by 雅⽅方
⽬標3: While Loops
while 當是這個情況下{
執⾏行行動作
}
repeat 重複{
執⾏行行動作
}while 當不是這個情況下停⽌止
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/
ControlFlow.html#//apple_ref/doc/uid/TP40014097-CH9-ID120

69. by 雅⽅方
while 當是這個情況下{
執⾏行行動作
}
參參考：https://developer.apple.com/library/ios/documentation/Swift/Conceptual/Swift_Programming_Language/
ControlFlow.html#//apple_ref/doc/uid/TP40014097-CH9-ID120
while 當是30的情況下{
印出...
}
範例例：
⽬標3: While Loops

70. by 雅⽅方
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
範例例：
⽬標3: While Loops

71. Play ground 遊樂園應⽤
by 雅⽅方
Game
or⾃製Gif XD藝術美感

72. Play ground 遊樂園應⽤
WOW
by 雅⽅方
⾃製Gif
named後⾯的名稱是⾃⼰圖⽚的名稱喔！

73. Day 2
next - Apple Map
by 雅⽅方