1. 程式人生 > >xib中設定ScrollView

xib中設定ScrollView

為ScrollView佈局實際上是為ScrollView裡的content設定佈局。
區別於一般元件,ScrollView有一個contentSize的概念。contentSize是ScrollView填充的內容大小,
ScrollView會根據這個範圍來設定滾動區域。

假如我們對ScrollView裡的內容按照一般元件那樣設定佈局。很容易出現元件內容不能拖動
或者直接在佈局介面就出錯的情況: (無法確定拖動的區域)

has ambiguous scrollable content height
has ambiguous scrollable content width
 

為ScrollView設定佈局

一,新建一個xib取名為MyScrollView.xib

二,在viewDidLoad里加載該Xib,並設定xib距離父檢視的四個邊的邊距為0

- (void)viewDidLoad { 

 [super viewDidLoad]; //載入xib檔案

 [self loadScrollView];

}

/** * 載入xib,並設定佈局全屏顯示。*/

-(void)loadScrollView{ 

 MyScrollView *myScrollView = [[[NSBundle mainBundle] loadNibNamed:@"MyScrollView" owner:self options:nil] firstObject];

 [self.view addSubview:myScrollView]; //... //設定xib距離父檢視的四個邊的距離為0 

}

三,開啟新建的MyScrollView.xib,拖入一個ScrollView元件,設定距離四個邊的距離為0。
再拖入一個View到ScrollView上,同樣設定四個方向邊距為0。
此時會報錯:

has ambiguous scrollable content height
has ambiguous scrollable content width

為View設定了四個方向的邊距,但是ScrollView並不知道contentSize的大小。
設定四個邊距實際是告訴ScrollView內容會“撐到”多大。
ScrollView必須知道四條邊多大來確定contentSize的大小。

四,設定View和ScrollView的寬度相等(Equal Widths)。此時錯誤只剩下一個:

has ambiguous scrollable content height

我們為其設定了兩邊的寬度,但高度還未確定。接下來,我們通過向View新增元件來填充View的高度。

五,在View上再拖入一個子View並設定四個方向上的邊距為10,高度為2000,設定背景色為粉色,此時錯誤消失。
執行會看到一個可以上下拖動的粉色面板。


元件內建大小

假如有多個子View,他們縱向依次間隔排列。但中間一個View並不確定高度(至少在xib佈局時無法給出一個明確高度)。如果是普通的View,這種佈局沒有問題,但對於ScrollView就會出錯:

has ambiguous scrollable content height

此時,我們可以為其設定intrinsic size(內建大小),屬性面板裡的 intrinsic size 選項。一個原始的UIView物件,它的內建大小為0。我們通過設定佔位符來改變內建寬、高,也可以根據需要只設置其中一項。

然後在xib繫結類的awakeFromNib函式裡設定該View的高度約束,awakeFromNib函式在約束生效前執行。若沒有設定高度約束也不會出錯,但該View不顯示。因為元件的內建大小是由元件本身的內容所確定的。UIView不像UIButton或UILabel,它的內容為空,執行時UIView的內建大小為0。

- (void)awakeFromNib { 

 [super awakeFromNib]; //重新設定高度 

 [self.topSubView addConstraint:[NSLayoutConstraint constraintWithItem:self.topSubView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:1 constant:250]];

}