Mobile phone as a small screen device, need to display the information often can not be displayed on a screen, it is necessary to use the scroll bar, of course, in addition to like TableView can be self-scrolling function. If there is more view on an interface, then you have to use the ScrollView. Now we'll use Swift to scroll through iOS. The specific implementation is as follows:
(1) Create a new iOS project, language Select Swift, and drag a ScrollView control into the Main.storyboard. Then drag a few photos in the ScrollView, and so on you can use the scrolling function to view the photos, the interface is as follows:
。
(2) ScrollView and several ImageView drag and drop code to outlet binding, after the code is as follows:
@IBOutlet weak var homepagescrollview:uiscrollview! This is the scroll bar; @IBOutlet weak var image1:uiimageview! @IBOutlet weak var image2:uiimageview! @IBOutlet weak var image3:uiimageview!
(3) then in the Viewdidload () method to implement the scroll bar code, note the following contentsize use, you must set the ScrollView content size, the interface will have a scrolling effect, and this size can be entered arbitrarily, you set how long and wide, The whole scrollview is like a canvas, the size of the canvas, and then because the screen is small, only a portion is displayed, so you can swipe to see the other unseen parts.
Override Func Viewdidload () { super.viewdidload () //Add view in scroll bar, Homepagescrollview.addsubview (image1 )//Continuously add child controls in ScrollView; Homepagescrollview.addsubview (Image2) Homepagescrollview.addsubview (Image3) homepagescrollview.contentsize=cgsize (Width:image1.bounds.size.width, height:image1.bounds.size.height+ image2.bounds.size.height+image3.bounds.size.height+500) //Note To add the height of all controls to ScrollView, or you can customize the length and width; }
(4) Run the program to view the results.
。
。
(5) Some people may have doubts, my above pictures are directly added to the storyboard, are written dead, I now add a picture through the code dynamically, and added to the ScrollView. In order to realize the function of the scroll bar really;
Dynamic display of picture code:
The "Image4" here is dynamically added through the code, not in storyboard, added to the image3 below; var imageview:uiimage = UIImage (named: "Gallery4")! Gallery4 is the name of this image and does not require an extension; var image4:uiimageview = Uiimageview (Frame:cgrect (origin:cgpoint: image1.bounds.size.height+image2.bounds.size.height+image3.bounds.size.height), size:image1.bounds.size) / /Set the display position and size of this picture, the original image is larger, I set to the same size as image1; image4.image = ImageView
Continue adding this view to the ScrollView:
Homepagescrollview.addsubview (Image4)
Finally, don't forget to add the appropriate length to the contentsize:
Homepagescrollview.contentsize=cgsize (Width:image1.bounds.size.width, height:image1.bounds.size.height+ IMAGE2.BOUNDS.SIZE.HEIGHT+IMAGE3.BOUNDS.SIZE.HEIGHT+IMAGE4.BOUNDS.SIZE.HEIGHT+500)//Note To add the height of all controls to ScrollView ; You can also customize the length and width;
So the code in the last whole class is as follows:
Class homepageviewcontroller:uiviewcontroller,uiscrollviewdelegate{//Note to implement this delegate delegate; @IBOutlet weak var homepagescrollview:uiscrollview! This is the scroll bar; @IBOutlet weak var image1:uiimageview! @IBOutlet weak var image2:uiimageview! @IBOutlet weak var image3:uiimageview! Override Func Viewdidload () {super.viewdidload ()//The "Image4" here is dynamically added by code, not written in storyboard, added under Image3; var imageview:uiimage = UIImage (named: "Gallery4")! Gallery4 is the name of this image and does not require an extension; var Image4:uiimageview = Uiimageview (Frame:cgrect (Origin:cgpoint (x:0,y:image1.bounds . Size.height+image2.bounds.size.height+image3.bounds.size.height), size:image1.bounds.size)//Set the display position and size of this picture, The original is larger, I set to the same size as image1, image4.image = imageView//Add view in the scroll bar, Homepagescrollview.addsubview (i MAGE1)//Add child controls continuously in ScrollView; Homepagescrollview.addsubview (image2) Homepagescrollview.addsubview (image3) Homepagescrollview.Addsubview (image4) homepagescrollview.contentsize=cgsize (Width:image1.bounds.size.width, height:image1.bounds.si ZE.HEIGHT+IMAGE2.BOUNDS.SIZE.HEIGHT+IMAGE3.BOUNDS.SIZE.HEIGHT+IMAGE4.BOUNDS.SIZE.HEIGHT+500)// Note To add the height of all controls to ScrollView, you can also customize the length and width;} override func didreceivememorywarning () {Super.didreceivememor Ywarning ()//Dispose of any of the resources that can is recreated. /////////////////////////////////////////// }}
(6) The result of the final operation is as follows:
。
。
In fact, ScrollView scroll bar has a lot of other property settings and features, some can also be set in the storyboard, is profound, we later in the development of slowly learning.
Copyright NOTICE: This article for Bo Master original article, without Bo Master permission not reproduced.
iOS development Project Combat--swift implement ScrollView scroll bar function