5DF1DA99-D931-4154-ABA3-D9AE1CB8C0C8.png
點擊進入Main.storyBoard會出現(xiàn)一個默認的視圖控制器View controller (點擊選中按Delete先將其刪除 以方便后邊視圖的創(chuàng)建)
65454508-3672-450D-A1A4-FB903BA109DF.png
接下來我們來介紹一下基本的用法:
一.
新建一個導航控制器
在右下角的輸入框中輸入navigation Controller
DEBE7546-F641-40E1-8D30-D037235C228C.png
點住搜索出來的帶<的Navigation Controller 向左邊空白的編輯框拖入
733C9A36-B723-41A9-AC5F-FF3B7D07ECC8.png
如圖所示 一個導航控制器就創(chuàng)建好了 它會自動帶一個根視圖控制器Root View Controller 需要的可以留下,如不需要可點住按Delete刪除
729BACF9-75ED-49D5-89E0-A521C99FBD4D.png
其他的如視圖控制器(View Controller) 標簽控制器(Tab Bar Controller), 等都可以通過這個方法進行拖拽創(chuàng)建.
二.
基本控件的創(chuàng)建:
1.創(chuàng)建一個imageView
DD553CFC-E210-4E83-AE2A-490570CB599A.png
如果想添加圖片到imageView上時 ,先把圖片拖入工程:
8A14D06B-3825-42F3-8F6B-6A79DFC38458.png
然后在右側(cè)編輯欄中添加圖片名字即可:(添加圖片回車后圖片就會加入到imageView上
409EC65F-9700-4851-BBA2-1F0454FEC46C.png
)
2.創(chuàng)建一個Button(按鈕):
在右下角輸入框中輸入button ,點住button拖入空白編輯處的View 上
5DF1DA99-D931-4154-ABA3-D9AE1CB8C0C8.png
許多控件需要我們規(guī)定它們的尺寸,顏色,文字等基本屬性,這里以Button為例為大家簡單介紹一下,其他控件的規(guī)定格式與Button基本相同:
首先選定已經(jīng)拖入View 的 button 點擊右下方規(guī)定尺寸的鍵
67A88ADA-6E2A-456C-932A-9AD4BADD1963.png
在彈出的小界面欄修改Button的尺寸[距離上下左右的距離,寬度,高度,是否需要流出20的間隔等等]
778CFD07-0A9F-4723-BD9D-51FC7E9CC1DE.png
如上圖,規(guī)定完以后會把Button的理想位置大小給出 ,接下來點擊下一個更新尺寸的鍵:
D2492AFE-09CA-4A0E-91EF-23E70DD56659.png
在彈出的編輯欄中選擇Update Frames 更新Button的位置坐標
F7D71C8E-8316-46EF-9716-A542FDBD8ED4.png
如圖為定義位置距離上邊框50,距左右各100,高度為50的Button, 這樣還遠遠不能達到我們的標準,接下來點開右上角的編輯欄:
2913A29E-30F6-497A-B0CF-B9657C5FAC45.png
控件常用的基本屬性:( 還有很多細節(jié)屬性都可以設(shè)置,實際應(yīng)用中大家會慢慢理解,這里不過多介紹 )
Button的標題文字 : Title 中 輸入 登錄
Button的標題顏色 : Text Color 選取白色
Button的標題文字大小 : Font 選取20
Button的背景圖片 : image (輸入想要添加的圖片名字即可)
Button的背景顏色 : Background 選取紅色
Button的透明度 : Alpha 選取0.8
Button的標題文字位置 : control中的Alignment 居中
4A057812-2C6D-4C9B-AC4B-E005ABBDC764.png
很重要的一點就是Button一般都帶有點擊事件,通過StoryBoard也可以實現(xiàn):
點擊右上角 show the identity inspector 編輯欄來選取Button的根視圖控制器:
394D3C73-F7A7-4AE6-ABF8-BFD0864A74F3.png
如上圖設(shè)置ViewController為根視圖控制器.
然后點擊右上角的拖拽欄的雙圈圖標,把Button拖拽到ViewController.m中
37565586-FF61-454C-84FB-87BC71B24C0C.png
在彈出的的界面中填寫事件名字.
3F7D7A64-96EB-40EA-8CCC-FEE3A2554795.png
點擊Connect創(chuàng)建就可以了,Button的點擊事件的方法就寫好了.
EF539F16-6209-4453-B464-856356EC238E.png
很多其他控件的創(chuàng)建方法也大多是這樣的,希望大家以后學習中共同探討.
