UIScrollView(滾動(dòng)視圖)
滾動(dòng)視圖的基礎(chǔ)屬性川背,它繼承自UIView
UIScrollView:UIView
設(shè)置UIScrollView的frame屬性的時(shí)候UIScrollView和UIScrollView的內(nèi)容的frame的大小是一樣的;UIScrollView的坐標(biāo)就是設(shè)置的frame屬性的坐標(biāo)岁钓,UIScrollView的內(nèi)容的坐標(biāo)是(0,0)
UIScrollView可以滾動(dòng)的前提:UIScrollView內(nèi)容的大小要比UIScrollView的大小要大佃扼。當(dāng)UIScrollView內(nèi)容的寬度大于UIScrollView本身的寬度的時(shí)候偎巢,UIScrollView可以左右滾動(dòng);當(dāng)UIScrollView內(nèi)容的高度大于UIScrollView本身的高度的時(shí)候兼耀,UIScrollView可以上下滾動(dòng)
//==========從UIView繼承下來的屬性==========
//1.創(chuàng)建UIScrollView對(duì)象
//這個(gè)時(shí)候UIScrollView內(nèi)容的大小和scrollView本身是一樣的
let scrollView = UIScrollView.init(frame: self.view.bounds)
//2.添加到界面上
self.view.addSubview(scrollView)
//3.設(shè)置背景顏色
scrollView.backgroundColor = UIColor.yellowColor()
//4.添加imageView
//imageView的坐標(biāo)是(0,0),大小是圖片的大小
/*
let imageView = UIImageView.init(image: UIImage.init(named: "1092.jpg"))
//在scrollView上添加子視圖,實(shí)質(zhì)是將子視圖添加到它的內(nèi)容上的
scrollView.addSubview(imageView)
*/
//創(chuàng)建多張圖片
for item in 1...4 {
let imageView = UIImageView.init(frame: CGRectMake(CGFloat(item-1)*scrollView.bounds.width, 0, scrollView.bounds.width, scrollView.bounds.height))
scrollView.addSubview(imageView)
imageView.image = UIImage.init(named: "35_\(item).jpg")
}
//=========UIScrollView專有屬性======
//核心屬性
//!!!1.內(nèi)容大小
//scrollView.contentSize = CGSizeMake(self.view.bounds.width * 2, self.view.bounds.height*2)
//如果想要能夠通過滾動(dòng)將圖片內(nèi)容顯示全求冷,就將scrollView的內(nèi)容大小設(shè)置為和圖片一樣的大小
scrollView.contentSize = CGSizeMake(4*scrollView.bounds.width, scrollView.bounds.height*3)
//!!!2.內(nèi)容偏移量
//scrollView默認(rèn)顯示的是內(nèi)容左上角的部分
scrollView.contentOffset = CGPointMake(scrollView.bounds.width, 0)
//3.設(shè)置是否可以分頁
//true->每次滾動(dòng)的距離是一頁的距離
//一頁的大小就是scrollView的frame的大小瘤运。如果分頁,那么每次橫向滾動(dòng)滾動(dòng)的距離是scrollView的寬度匠题,上下滾動(dòng)的距離是scrollView的高度
scrollView.pagingEnabled = true
//其他屬性
//1.內(nèi)容邊距
//設(shè)置scrollView內(nèi)容到scrollView本身上左下右的距離(默認(rèn)都是0)
//scrollView.contentInset = UIEdgeInsetsMake(20, 20, 20, 20)
//3.設(shè)置是否鎖定一定方法(默認(rèn)false->同一時(shí)間既可以上下滾動(dòng)又可以左右滾動(dòng))
scrollView.directionalLockEnabled = true //true->同一時(shí)間只能上下滾動(dòng)或者左右滾動(dòng)
//3.滑到內(nèi)容邊緣的時(shí)候是否可以滾動(dòng)一段距離再彈回去(默認(rèn)true)
scrollView.bounces = false
//4.設(shè)置是否可以滾動(dòng)(默認(rèn)true->可以滾動(dòng))
scrollView.scrollEnabled = true
//5.設(shè)置是否顯示滾動(dòng)條(默認(rèn)true->顯示)
//是否顯示水平方向的滾動(dòng)條
scrollView.showsHorizontalScrollIndicator = true
//是否顯示垂直方向的滾動(dòng)條
scrollView.showsVerticalScrollIndicator = true
//6.設(shè)置滾動(dòng)條到上下左右的邊距
//注意:這個(gè)結(jié)構(gòu)體中的值只有下和右有效拯坟。下->水平方向的滾動(dòng)條。右->垂直方向的滾動(dòng)條
scrollView.scrollIndicatorInsets = UIEdgeInsetsMake(0, 0, 100, 10)
//7.設(shè)置滾動(dòng)條的風(fēng)格
scrollView.indicatorStyle = .Black
//8.滾動(dòng)到指定區(qū)域(讓指定區(qū)域可見)
//scrollView.scrollRectToVisible(CGRectMake(1000, 100, 100, 100), animated: true)
//9.是否滾動(dòng)到頂部(點(diǎn)擊狀態(tài)欄是否可以自動(dòng)回到頂部)
scrollView.scrollsToTop = true
}
}
滾動(dòng)視圖的委托調(diào)用
//6.設(shè)置代理
self.scrollView.delegate = self
//8.設(shè)置縮放倍數(shù)
self.scrollView.maximumZoomScale = 3
self.scrollView.minimumZoomScale = 0.5
//MARK: UIScrollView Delegate
extension ViewController: UIScrollViewDelegate{
//============滾動(dòng)相關(guān)============
//1.在scrollView滾動(dòng)的時(shí)候?qū)崟r(shí)調(diào)用
func scrollViewDidScroll(scrollView: UIScrollView){
print("正在滾動(dòng)")
print(scrollView.contentOffset)
}
//2.在scrollView將要開始拖動(dòng)的時(shí)候調(diào)用
func scrollViewWillBeginDragging(scrollView: UIScrollView){
print("將要開始拖拽")
}
//3.停止減速的時(shí)候會(huì)調(diào)用(實(shí)質(zhì)就是停止?jié)L動(dòng)的時(shí)候會(huì)調(diào)用)
func scrollViewDidEndDecelerating(scrollView: UIScrollView){
print("停止減速")
}
//4.將要停止拖拽的時(shí)候調(diào)用(手將要松開的時(shí)候韭山,不代表停止?jié)L動(dòng))
//參數(shù)2:手松開時(shí)候在x方向上和在y方向的速度
//參數(shù)3:預(yù)判的滾動(dòng)停止時(shí)候的偏移量
func scrollViewWillEndDragging(scrollView: UIScrollView, withVelocity velocity: CGPoint, targetContentOffset: UnsafeMutablePointer<CGPoint>){
print("將要停止拖拽")
print(targetContentOffset)
}
//5.手將要停止拖拽的時(shí)候調(diào)用
func scrollViewWillBeginDecelerating(scrollView: UIScrollView){
print("將要開始減速")
}
//6.已經(jīng)停止?jié)L動(dòng)動(dòng)畫的時(shí)候調(diào)用
//只有在通過setContentOffset的方法使用動(dòng)畫效果讓scrollView滾動(dòng)郁季,在停止?jié)L動(dòng)的時(shí)候才會(huì)調(diào)用這個(gè)方法
func scrollViewDidEndScrollingAnimation(scrollView: UIScrollView){
print("停止?jié)L動(dòng)動(dòng)畫")
}
//7.只有在通過點(diǎn)擊狀態(tài)欄自動(dòng)滾動(dòng)到頂部的時(shí)候才會(huì)調(diào)用
func scrollViewDidScrollToTop(scrollView: UIScrollView){
print("已經(jīng)滾動(dòng)到頂部")
}
//============縮放相關(guān)=============
//UIScrollView已經(jīng)實(shí)現(xiàn)了縮放功能
//想要讓UIScrollView上的內(nèi)容進(jìn)行縮放必須滿足以下條件:
//a.設(shè)置縮放的最大倍數(shù)和最小倍數(shù)(默認(rèn)都是1)
//b.通過協(xié)議方法告訴UIScrollView縮放對(duì)象
//1.正在縮放的時(shí)候會(huì)實(shí)時(shí)調(diào)用
func scrollViewDidZoom(scrollView: UIScrollView){
print("正在縮放")
}
//2.告訴UIScrollView在縮放的時(shí)候,對(duì)哪個(gè)視圖進(jìn)行縮放(設(shè)置縮放對(duì)象)
func viewForZoomingInScrollView(scrollView: UIScrollView) -> UIView?{
return scrollView.subviews[0]
}
UIPageControl
//屏幕寬度
let Screen_W = UIScreen.mainScreen().bounds.size.width
class ViewController: UIViewController {
//MARK: - 屬性
let scrollView = UIScrollView()
var pageControl: UIPageControl? = nil
//MARK: - 方法
override func viewDidLoad() {
super.viewDidLoad()
//1.設(shè)置frame
self.scrollView.frame = CGRectMake(0, 0, self.view.bounds.width, 250)
//2.添加到界面上
self.view.addSubview(self.scrollView)
//3.添加圖片
for item in 1...6 {
let imageView = UIImageView.init(frame: CGRectMake(CGFloat(item-1)*Screen_W, 0, Screen_W, 250))
imageView.image = UIImage.init(named: "21_\(item).jpg")
self.scrollView.addSubview(imageView)
}
//4.設(shè)置內(nèi)容大小
self.scrollView.contentSize = CGSizeMake(CGFloat(scrollView.subviews.count)*Screen_W, 250)
//5.設(shè)置分頁
self.scrollView.pagingEnabled = true
//6.設(shè)置代理
self.scrollView.delegate = self
//7.添加pageControl
self.creatPageControl()
}
}
//MARK: - ScrollView Delegate
extension ViewController: UIScrollViewDelegate{
//停止?jié)L動(dòng)
func scrollViewDidEndDecelerating(scrollView: UIScrollView){
//拿到當(dāng)前是第幾頁
let page = scrollView.contentOffset.x / scrollView.bounds.width
//更新pageControl
self.pageControl?.currentPage = Int(page)
}
}
//MARK: - PageControl
extension ViewController{
func creatPageControl() {
//1.創(chuàng)建UIPageControl對(duì)象
self.pageControl = UIPageControl.init(frame: CGRectMake(0, 230, Screen_W, 20))
//2.添加到界面上
self.view.addSubview(self.pageControl!)
//3.設(shè)置背景顏色
//self.pageControl?.backgroundColor = UIColor.yellowColor()
//4.核心屬性
//設(shè)置總的頁數(shù)
self.pageControl?.numberOfPages = self.scrollView.subviews.count
//設(shè)置當(dāng)前頁(從0開始)
self.pageControl?.currentPage = 0
//5.設(shè)置圓點(diǎn)的顏色
self.pageControl?.pageIndicatorTintColor = UIColor.yellowColor()
self.pageControl?.currentPageIndicatorTintColor = UIColor.redColor()
//6.添加事件
self.pageControl?.addTarget(self, action: "pageControlAction:", forControlEvents: .ValueChanged)
}
//值改變事件發(fā)生調(diào)用的方法
func pageControlAction(pageControl:UIPageControl) {
let offsetX = CGFloat(pageControl.currentPage) * Screen_W
self.scrollView.setContentOffset(CGPointMake(offsetX, 0), animated: true)
}
}
圖片的循環(huán)
//屏幕寬度
let Screen_W = UIScreen.mainScreen().bounds.size.width
class ViewController: UIViewController {
//MARK: - 屬性
let scrollView = UIScrollView()
var pageControl: UIPageControl? = nil
//MARK: - 方法
override func viewDidLoad() {
super.viewDidLoad()
//1.設(shè)置frame
self.scrollView.frame = CGRectMake(0, 0, self.view.bounds.width, 250)
//2.添加到界面上
self.view.addSubview(self.scrollView)
//3.添加圖片
//a.先添加最后一張圖片
let lastImageView = UIImageView.init(frame: CGRectMake(0, 0, Screen_W, 250))
lastImageView.image = UIImage.init(named: "21_6.jpg")
self.scrollView.addSubview(lastImageView)
//b.創(chuàng)建中間的圖片
for item in 1...6 {
let imageView = UIImageView.init(frame: CGRectMake(CGFloat(item)*Screen_W, 0, Screen_W, 250))
imageView.image = UIImage.init(named: "21_\(item).jpg")
self.scrollView.addSubview(imageView)
}
//c.在最后再放第一張圖片
let first = UIImageView.init(frame: CGRectMake(7*Screen_W, 0, Screen_W, 250))
first.image = UIImage.init(named: "21_1.jpg")
self.scrollView.addSubview(first)
//4.設(shè)置內(nèi)容大小
self.scrollView.contentSize = CGSizeMake(CGFloat(scrollView.subviews.count)*Screen_W, 250)
//5.設(shè)置分頁
self.scrollView.pagingEnabled = true
//6.設(shè)置代理
self.scrollView.delegate = self
//8.設(shè)置默認(rèn)偏移量(默認(rèn)顯示真正的第一張圖片)
self.scrollView.contentOffset = CGPointMake(Screen_W, 0)
//7.添加pageControl
self.creatPageControl()
}
}
//MARK: - ScrollView Delegate
extension ViewController: UIScrollViewDelegate{
//停止?jié)L動(dòng)
func scrollViewDidEndDecelerating(scrollView: UIScrollView){
//拿到當(dāng)前是第幾頁
let page = scrollView.contentOffset.x / scrollView.bounds.width
//1.判斷是否滑到最后钱磅,如果滑到最后就切換到真正的第一張圖片的位置
if page == 7 {
scrollView.contentOffset = CGPointMake(Screen_W, 0)
self.pageControl?.currentPage = 0
return
}
if page == 0 {
scrollView.contentOffset = CGPointMake(6*Screen_W, 0)
self.pageControl?.currentPage = 5
return
}
//更新pageControl
self.pageControl?.currentPage = Int(page-1)
}
}
//MARK: - PageControl
extension ViewController{
func creatPageControl() {
//1.創(chuàng)建UIPageControl對(duì)象
self.pageControl = UIPageControl.init(frame: CGRectMake(0, 230, Screen_W, 20))
//2.添加到界面上
self.view.addSubview(self.pageControl!)
//3.設(shè)置背景顏色
//self.pageControl?.backgroundColor = UIColor.yellowColor()
//4.核心屬性
//設(shè)置總的頁數(shù)
self.pageControl?.numberOfPages = 6
//設(shè)置當(dāng)前頁(從0開始)
self.pageControl?.currentPage = 0
//5.設(shè)置圓點(diǎn)的顏色
self.pageControl?.pageIndicatorTintColor = UIColor.yellowColor()
self.pageControl?.currentPageIndicatorTintColor = UIColor.redColor()
//6.添加事件
self.pageControl?.addTarget(self, action: "pageControlAction:", forControlEvents: .ValueChanged)
}
//值改變事件發(fā)生調(diào)用的方法
func pageControlAction(pageControl:UIPageControl) {
let offsetX = CGFloat(pageControl.currentPage) * Screen_W
self.scrollView.setContentOffset(CGPointMake(offsetX, 0), animated: true)
}
}