UI基礎

UI概述
UI(User Interface):用戶界面,用戶能夠看到的各種個樣頁面元素。
iOS App = 各種各樣的UI控件 + 業務邏輯 + 算法。
UIWindow
window是窗口,每個App 都需要藉助window將內容展現給用戶看。
在IOS中,使用UIWindow類來表示窗口。通常一個應用程序只創建一個UIWindow 對象。
因爲window的主要作用是呈現內容給用戶。因此我們不會對window做太多操作。
在創建window的時候,需要指定window的大小。
通常window的大小(frame)與屏幕(UIScreen)的大小一致。
[[UIScreen mainScreen] bounds]能夠獲取屏幕的大小。
UIView
view(視圖):代表屏幕上的一個矩形區域。ios中用view來表示視圖。
不同空間代表不同種類的view
iOS中所有能看到的內容的都是view或其子類。
創建視圖的步驟
1.開闢空間並初始化視圖(初始化時,給出視圖的位置和大小)
2.對視圖做一些設置(比如:背景顏色)
3.將視圖添加到window上進行顯示
4.釋放視圖對象
frame
frame是view的重要屬性,是我們做視圖佈局的關鍵,它決定了視圖的大小和位置。
center.x = frame.origin.x + frame.size.width/2;
center.y = frame.origin.y+ frame.size.heigth/2;
center屬性
描述的的是這個視圖的中心點在其父視圖產生的中心點的座標值。


framecenter
參考系父視圖父視圖
兩者聯繫frame.origin發生變化,center也發生變化;center發生變化,frame.origin也發生變化。center.x = frame.oingin.x+frame.size.width/2;center.y= frame.oringin.xframe.size.height;

添加視圖:

方法名描述實例
insertSubview:atIndex在指定的index處插入子視圖[subview insertSubview:grayView atIndex:]
insertSubview:aboveSubview:在指定的視圖上添加子視圖[superview insertSubview:grayView aboveSubview:redView];
insertSubview:belowSubview在指定的視圖下面添加子視圖[superview insertSubview:grayView belowSubview:redView];

 管理視圖層次:

方法名描述實例
bringSubviewToFront:把指定的子視圖移動到最前面[superview bringSubviewToFront:redView]
sendSubviewToBack:把指定的子視圖移動到最後面[superview sendSubview ToBack:redView];
enchangeSubviewAtIndex:withSubviewAtIndex交換兩個指定索引位置的子視圖[superview exchangeSubviewAtIndex:0 withSubviewAtIndex:2];
removeFromSuperview把receiver從父視圖上移除[redView removeFromSuperview];

視圖的重要屬性

屬性名描述示例
hidden控制視圖的顯隱redView.hidden = YES;// 隱藏 review NO顯示review
alpha控制視圖的不透明度(子視圖也一起透明)取值範圍爲0—1redView.alpha = 0.8;
superview獲取本視圖的父視圖UIView *superView = [redView superView];
subviews獲取本視圖的所有父視圖NSSArray *subviews = [redView subviews];
tag給視圖添加標記,被加完標記的視圖可以使用viewWithTag:方法取出redView.tag = 100;UIView *view = [superview viewWithTag:100];

總結
App  靠window來呈現內容,一個程序一般只創建一個window
App只能看到的元素。都是UIView及其子類
UIView作爲所有可視化控件的BaseClass 提供了許多屬性和方法。顯示效果控制(frame alpha等)視圖添加和移除(addSubview:)等。視圖層次調整(bringSubviewToFront:等)等。


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章