iOS開發(fā)UI篇—UIScrollView控件介紹

一因苹、知識(shí)點(diǎn)簡單介紹

1.UIScrollView控件是什么?

(1)移動(dòng)設(shè)備的屏幕?大?小是極其有限的,因此直接展?示在?用戶眼前的內(nèi)容也相當(dāng)有限

(2)當(dāng)展?示的內(nèi)容較多,超出?一個(gè)屏幕時(shí),?用戶可通過滾動(dòng)?手勢(shì)來查看屏幕以外的內(nèi)容

(3)普通的UIView不具備滾動(dòng)功能,不能顯?示過多的內(nèi)容

(4)UIScrollView是一個(gè)能夠滾動(dòng)的視圖控件,可以?用來展?示?大量的內(nèi)容,并且可以通過滾 動(dòng)查看所有的內(nèi)容

(5)? 舉例:手機(jī)上的“設(shè)置”、其他?示例程序

2.UIScrollView的簡單使用

(1)將需要展?的內(nèi)容添加到UIScrollView中

(2)設(shè)置UIScrollView的contentSize屬性,告訴UIScrollView所有內(nèi)容的尺?寸,也就是告訴 它滾動(dòng)的范圍(能滾多遠(yuǎn),滾到哪?里是盡頭)

3.屬性

(1)常用屬性:

1)@property(nonatomic)CGPointcontentOffset;這個(gè)屬性?用來表?示UIScrollView滾動(dòng)的位置

2)@property(nonatomic)CGSizecontentSize;這個(gè)屬性?用來表?示UIScrollView內(nèi)容的尺?寸,滾動(dòng)范圍(能滾多遠(yuǎn))

3)@property(nonatomic)UIEdgeInsetscontentInset;這個(gè)屬性能夠在UIScrollView的4周增加額外的滾動(dòng)區(qū)域

(2)其他屬性:

1)@property(nonatomic)BOOLbounces;設(shè)置UIScrollView是否需要彈簧效果

2)@property(nonatomic,getter=isScrollEnabled)BOOLscrollEnabled;設(shè)置UIScrollView是否能滾動(dòng)

3)@property(nonatomic)BOOLshowsHorizontalScrollIndicator;是否顯?示?水平滾動(dòng)條

4)@property(nonatomic)BOOLshowsVerticalScrollIndicator;是否顯?示垂直滾動(dòng)條

4.注意點(diǎn)

?如果UIScrollView?無法滾動(dòng),可能是以下原因:

(1)沒有設(shè)置contentSize

(2) scrollEnabled = NO

(3)?沒有接收到觸摸事件:userInteractionEnabled = NO

(4)沒有取消autolayout功能(要想scrollView滾動(dòng),必須取消autolayout)

二俩檬、關(guān)于UIScrollView常見屬性的一些說明

1.屬性使用的代碼示例

1#import"MJViewController.h"23@interfaceMJViewController ()4{5//在私有擴(kuò)展中創(chuàng)建一個(gè)屬性6UIScrollView *_scrollView;7}8@end910@implementationMJViewController1112- (void)viewDidLoad13{14[super viewDidLoad];1516//1.創(chuàng)建UIScrollView17UIScrollView *scrollView =[[UIScrollView alloc] init];18scrollView.frame = CGRectMake(0,0,250,250);//frame中的size指UIScrollView的可視范圍19scrollView.backgroundColor =[UIColor grayColor];20[self.view addSubview:scrollView];2122//2.創(chuàng)建UIImageView(圖片)23UIImageView *imageView =[[UIImageView alloc] init];24imageView.image = [UIImage imageNamed:@"big.jpg"];25CGFloat imgW = imageView.image.size.width;//圖片的寬度26CGFloat imgH = imageView.image.size.height;//圖片的高度27imageView.frame = CGRectMake(0,0, imgW, imgH);28[scrollView addSubview:imageView];2930//3.設(shè)置scrollView的屬性3132//設(shè)置UIScrollView的滾動(dòng)范圍(內(nèi)容大衅饫颉)33scrollView.contentSize =imageView.image.size;3435//隱藏水平滾動(dòng)條36scrollView.showsHorizontalScrollIndicator =NO;37scrollView.showsVerticalScrollIndicator =NO;3839//用來記錄scrollview滾動(dòng)的位置40//scrollView.contentOffset = ;4142//去掉彈簧效果43//scrollView.bounces = NO;4445//增加額外的滾動(dòng)區(qū)域(逆時(shí)針盼砍,上、左逝她、下浇坐、右)46//top? left? bottom? right47scrollView.contentInset = UIEdgeInsetsMake(20,20,20,20);4849_scrollView =scrollView;50}5152- (IBAction)down:(UIButton *)sender {53[UIView animateWithDuration:1.0animations:^{54//三個(gè)步驟55CGPoint offset =_scrollView.contentOffset;56offset.y +=150;57_scrollView.contentOffset =offset;5859//_scrollView.contentOffset = CGPointMake(0, 0);60}];61}62@end

2.幾個(gè)屬性坐標(biāo)示意圖

3.重要說明

(1)UIScrollView的frame與contentsize屬性的區(qū)分:UIScrollView的frame指的是這個(gè)scrollview的可視范圍(可看見的區(qū)域),contentsize是其滾動(dòng)范圍黔宛。

(2)contentinset(不帶*號(hào)的一般不是結(jié)構(gòu)體就是枚舉)近刘,為UIScrollView增加額外的滾動(dòng)區(qū)域。(上宁昭,左跌宛,下,右)逆時(shí)針积仗。contentinset可以使用代碼或者是視圖控制器進(jìn)行設(shè)置疆拘,但兩者有區(qū)別(注意區(qū)分)。

(3)contentsize屬性只能使用代碼設(shè)置寂曹。

(4)contentoffset是個(gè)CGpoint類型的結(jié)構(gòu)體哎迄,用來記錄ScrollView的滾動(dòng)位置,即記錄著“框”跑到了哪里隆圆。知道了這個(gè)屬性漱挚,就知道了其位置,可以通過設(shè)置這個(gè)屬性來控制這個(gè)“框”的移動(dòng)渺氧。

(5)不允許直接修改某個(gè)對(duì)象內(nèi)部結(jié)構(gòu)體屬性的成員旨涝,三個(gè)步驟(先拿到值,修改之侣背,再把修改后的值賦回去)白华。

(6)增加了額外區(qū)域后,contentoffset的原點(diǎn)在哪里贩耐?

三弧腥、有助于理解的幾個(gè)截圖

模型圖:

對(duì)比圖:

坐標(biāo)圖:

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末,一起剝皮案震驚了整個(gè)濱河市潮太,隨后出現(xiàn)的幾起案子管搪,更是在濱河造成了極大的恐慌,老刑警劉巖铡买,帶你破解...
    沈念sama閱讀 217,185評(píng)論 6 503
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件更鲁,死亡現(xiàn)場離奇詭異,居然都是意外死亡奇钞,警方通過查閱死者的電腦和手機(jī)岁经,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,652評(píng)論 3 393
  • 文/潘曉璐 我一進(jìn)店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來蛇券,“玉大人缀壤,你說我怎么就攤上這事樊拓。” “怎么了塘慕?”我有些...
    開封第一講書人閱讀 163,524評(píng)論 0 353
  • 文/不壞的土叔 我叫張陵筋夏,是天一觀的道長。 經(jīng)常有香客問我图呢,道長条篷,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 58,339評(píng)論 1 293
  • 正文 為了忘掉前任蛤织,我火速辦了婚禮赴叹,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘指蚜。我一直安慰自己乞巧,他們只是感情好,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,387評(píng)論 6 391
  • 文/花漫 我一把揭開白布摊鸡。 她就那樣靜靜地躺著绽媒,像睡著了一般。 火紅的嫁衣襯著肌膚如雪免猾。 梳的紋絲不亂的頭發(fā)上是辕,一...
    開封第一講書人閱讀 51,287評(píng)論 1 301
  • 那天,我揣著相機(jī)與錄音猎提,去河邊找鬼获三。 笑死,一個(gè)胖子當(dāng)著我的面吹牛锨苏,可吹牛的內(nèi)容都是我干的疙教。 我是一名探鬼主播,決...
    沈念sama閱讀 40,130評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼蚓炬,長吁一口氣:“原來是場噩夢(mèng)啊……” “哼松逊!你這毒婦竟也來了躺屁?” 一聲冷哼從身側(cè)響起肯夏,我...
    開封第一講書人閱讀 38,985評(píng)論 0 275
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎犀暑,沒想到半個(gè)月后驯击,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,420評(píng)論 1 313
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡耐亏,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,617評(píng)論 3 334
  • 正文 我和宋清朗相戀三年徊都,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片广辰。...
    茶點(diǎn)故事閱讀 39,779評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡暇矫,死狀恐怖主之,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情李根,我是刑警寧澤槽奕,帶...
    沈念sama閱讀 35,477評(píng)論 5 345
  • 正文 年R本政府宣布,位于F島的核電站房轿,受9級(jí)特大地震影響粤攒,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜囱持,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,088評(píng)論 3 328
  • 文/蒙蒙 一夯接、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧纷妆,春花似錦盔几、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,716評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至粒蜈,卻和暖如春顺献,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背枯怖。 一陣腳步聲響...
    開封第一講書人閱讀 32,857評(píng)論 1 269
  • 我被黑心中介騙來泰國打工注整, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人度硝。 一個(gè)月前我還...
    沈念sama閱讀 47,876評(píng)論 2 370
  • 正文 我出身青樓肿轨,卻偏偏與公主長得像,于是被迫代替她去往敵國和親蕊程。 傳聞我的和親對(duì)象是個(gè)殘疾皇子椒袍,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,700評(píng)論 2 354

推薦閱讀更多精彩內(nèi)容