IOS:UI系列之UISCROLLVIEW和UIPAGECONTROL
編輯：IOS開發綜合
轉眼間,又是一天,就這樣忙忙碌碌的一天一天的過著, 不過還好,不是渾渾噩噩的,也算是小有所成,勞有所獲吧,嘿嘿!
好了,到了總結的時間啦, 下面就為大家簡單講解下我今天學習的內容吧,希望對各位都有所幫助吧,同時也是對自己的一種激勵,最終實現共贏吧 嘿嘿!
首先,在上課時間我們先簡單講述了UIScrollView, 它是一個滾動視圖,繼承於UIView,他沒有自己的初始化方法,所以要用到父類的創建方法下面就為大家簡單說明下其創建過程哈:
UIScrollView *scrollView = [[UIScrollView alloc] initWithFrame:self.view.bounds];
scrollView.backgroundColor = [UIColor redColor];
//設置內容頁的大小,內容的大小必須比frame大,才能夠滾動
//如果不設置內容頁的大小,默認和frame大小一致
[scrollView setContentSize:CGSizeMake(320, 568 * 3)];
//設置滾動條是否可見
//水平滾動條
scrollView.showsHorizontalScrollIndicator = YES;
//豎直滾動條
scrollView.showsVerticalScrollIndicator = YES;
//設置內容頁的偏移量, 默認內容頁從(0, 0)點開始
scrollView.contentOffset = CGPointMake(0, 0);
//設置整頁滑動
scrollView.pagingEnabled = NO;
//設置邊界是否回彈
scrollView.bounces = YES;
//滾動到頂部
scrollView.scrollsToTop = YES;
//設置能否滾動
scrollView.scrollEnabled = YES;
//設置邊界是否回彈,只有在content的寬度或者高度 小於 frame的寬度或者高度,才有效
scrollView.alwaysBounceVertical = YES;
scrollView.alwaysBounceHorizontal = YES;
//縮放, 縮放必須結合著代理(delegate)才能生效, 指定scrollView上哪個視圖進行縮放
//設置當前的縮放比例, 默認為1.0
scrollView.zoomScale = 1.0;
//設置最大縮放比例
scrollView.maximumZoomScale = 2.0;
//設置最小縮放比例
scrollView.minimumZoomScale = 0.5;
//設置delegate
scrollView.delegate = self;
[self.view addSubview:scrollView];
[scrollView release];
imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"image"]];
imageView.frame = CGRectMake(0, 0, 320, 568 * 3);
[scrollView addSubview:imageView];
[imageView release];
其中delegate代理的常用方法如下:
- (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
//當滾動scrollView時調用
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
NSLog(@"%s", __FUNCTION__);
}
//當發生了縮放的時候調用
- (void)scrollViewDidZoom:(UIScrollView *)scrollView
{
NSLog(@"%s", __FUNCTION__);
}
//對ScrollView中的哪個視圖縮放
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
return imageView;
}
//將要開始拖拽的時候調用
- (void)scrollViewWillBeginDragging:(UIScrollView *)scrollView
{
NSLog(@"%s", __FUNCTION__);
}
//將要結束拖拽的時候調用
- (void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset
{
NSLog(@"%s", __FUNCTION__);
}
//已經結束拖拽的時候調用
- (void)scrollViewDidEndDragging:(UIScrollView *)scrollView willDecelerate:(BOOL)decelerate
{
NSLog(@"%s", __FUNCTION__);
}
感覺UIScrollView是為接下來所講的做了一個鋪墊,以便於實現之後圖片頁碼的切換和滾動
在之後我們又講了UIPageControl
UIPageControl:頁碼控制器,繼承與UIControl
他和UIScrollView一樣,也沒有自己的初始化方法,同樣要使用自己父類的方法,其具體創建方法如下所示
- (void)viewDidLoad
{
[super viewDidLoad];
//UIPageControl:頁碼控制器, 繼承於UIControl
UIPageControl *pageControl = [[UIPageControl alloc] init];
pageControl.frame = CGRectMake(0, 100, 320, 30);
pageControl.backgroundColor = [UIColor blackColor];
pageControl.numberOfPages = 10;
//設置未選中的顏色
pageControl.pageIndicatorTintColor = [UIColor yellowColor];
//設置已選中的顏色
pageControl.currentPageIndicatorTintColor = [UIColor blueColor];
//設置只有一頁時隱藏
pageControl.hidesForSinglePage = NO;
//關聯方法
[pageControl addTarget:self action:@selector(changePage:) forControlEvents:UIControlEventValueChanged];
[self.view addSubview:pageControl];
[pageControl release];
}
- (void)didReceiveMemoryWarning
{
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
- (void)changePage:(UIPageControl *)pageControl
{
//頁碼是從零開始的
NSLog(@"%d", pageControl.currentPage + 1);
}
下面我們來通過一個練習來進一步對這些空間作進一步的了解:
通過頁面的滾動和頁碼的切換來調用方法進而使效果類似於我們看電子書一樣翻頁跳轉, 下面我就來附上代碼供大家參考:
- (void)changePage:(UIPageControl *)pageControl
{
if (pageControl.currentPage == 0) {
[scrollView1 setContentOffset:CGPointMake(0, 0) animated:YES];
} else if (pageControl.currentPage == 1) {
[scrollView1 setContentOffset:CGPointMake(320, 0) animated:YES];
} else if (pageControl.currentPage == 2) {
[scrollView1 setContentOffset:CGPointMake(320 * 2, 0) animated:YES];
}
}
- (void)scrollViewDidEndDecelerating:(UIScrollView *)scrollView
{
pageControl1.currentPage = scrollView.contentOffset.x / 320;
}
- (void)close:(UIButton *)button1
{
//如果子視圖的父視圖被移除,那麼這個子視圖也會被移除
[button removeFromSuperview];
[scrollView1 removeFromSuperview];
[pageControl1 removeFromSuperview];
}
相關文章
+