Swift中的垂直滚动视图,动态高度

时间:2016-01-21 20:33:05

标签: ios swift

我知道这是一个常见的问题,花了很多天浏览类似的问题和提出的解决方案,但是,尝试了我能找到的一切,我仍然无法完成这项工作。

这是我正在尝试做的事情:

  1. 我有一个主 - 详细信息视图,其中所有数据都是从远程服务器中提取的。
  2. 一切皆有可能在故事板上完成。
  3. 在我的详细视图(称为主视图)中,我有一个滚动视图(滚动视图)绑定到主视图的4个边缘。
  4. 在滚动视图中,我有一个内容视图(contentView),其中所有4条边都与滚动视图相关联。 contentView的宽度和高度也与主视图宽度和高度相关联,因为我知道这是必需的,因此滚动视图可以正确计算其高度。
  5. 在contentView中,我在故事板中添加了2个文本标签,其中的内容以编程方式从远程服务器添加。第一个固定在内容视图的顶部,第二个固定在第一个标签的底部。
  6. 同样在contentView中,在第二个文本标签下面,我以编程方式从远程服务器添加了许多图像。数字是可变的,但每个图像的高度是以编程方式设置的。每个图像都固定在第二个标签的底部,并带有计算的距离,因此图像会一个在另一个上方。
  7. 到目前为止,所有这些都有效。我可以看到文本标签和图像正确定位,垂直滚动工作正常。但是,内容视图(以红色背景显示)未垂直调整大小,因此某些图像显示在内容视图之外。滚动视图显示为蓝色背景:Screen shot
  8. 我正在寻求有关应用这项工作的原则的指导,但现在已经包含了代码,以便有人能够找到我出错的地方。 有什么建议吗?

    import UIKit
    class DetailViewController: UIViewController {
    @IBOutlet var mainView: UIView!
    @IBOutlet weak var scrollView: UIScrollView!
    @IBOutlet weak var contentView: UIView!
    @IBOutlet weak var routeDescriptionLabel: UILabel!
    @IBOutlet weak var routeDetailLabel: UILabel!
    @IBOutlet weak var detailNavigationBar: UINavigationItem!
        // Create new RouteModel
    var routeModel:RouteModel = RouteModel()
    var imageNumber:Int = 0
    let imageHeight:Int = 200
    
    // Create a variable to hold the bottom constraint for the last route image so it can be tied to the bottom of the contentView in order for the scroll view to calculate its height.
    var lastImageBottomConstraint:NSLayoutConstraint = NSLayoutConstraint()
    
    var detailItem: AnyObject? {
        didSet {
            // Update the view.
        self.configureView()
    
    }
     }
    
     func configureView() {
    
    if let routeID = self.detailItem {
        if let label = self.routeDescriptionLabel {
    
            //contentView.translatesAutoresizingMaskIntoConstraints = false
    
            // Get the route details from the route model for this specified routeID
    
            var selectedRoute:Route = Route()
            selectedRoute = self.routeModel.getRoute(routeID as! Int)
    
            // Get the array of route image dictionaries for this route id
    
            var routeImageDictArray:[NSDictionary] = [[String:String]]()
            routeImageDictArray = routeModel.getRouteImages(Int(routeID as! NSNumber))
    
            // Format the view
    
            detailNavigationBar.title = selectedRoute.routeName
            label.text = selectedRoute.routeDesc
            label.sizeToFit()
    
            self.routeDetailLabel.text = selectedRoute.routeDetails
            self.routeDetailLabel.sizeToFit()
    
            // Loop through the array of route images and add each image to the current view
    
            for image in routeImageDictArray {
    
                // Get the image file name
                var imageFileName:String = String()
                if var imageFileName = image["imageFile"]{
    
                    // Handle any spaces etc in the image file name
                    imageFileName = imageFileName.stringByAddingPercentEncodingWithAllowedCharacters(NSCharacterSet.URLQueryAllowedCharacterSet())!
    
                    // Get the image and add it to the view
                    getRouteImage(imageFileName as! String)
                }
            }
    
            // Add lastImageBottomConstraint from the last image loaded to the view so that the scroll view can correctly calculate its height
            self.contentView.addConstraint(self.lastImageBottomConstraint)
    
        }
    }
     }
    
     override func viewDidLoad() {
         super.viewDidLoad()
    // Do any additional setup after loading the view, typically from a nib.
    self.configureView()
     }
    
     override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
     }
    
     func getRouteImage(imageFileName:String)  {
    // Set the route image
    
    ImageLoader.sharedLoader.imageForUrl("http://www.example.com/files/images/" + imageFileName, completionHandler:{(image: UIImage?, url: String) in
    
        // Create an image view for the image
        var imageView = UIImageView.init(frame: CGRectZero)
    
        // Set translatesautoresizingmask to false
        imageView.translatesAutoresizingMaskIntoConstraints = false
    
        // Increment the image number
        self.imageNumber++
    
        imageView.image = image
    
        // Add the image view to the content view
        self.contentView.addSubview(imageView)
    
        // Add size constraints
        self.applySizeConstraintsToImage(imageView)
    
        // Add position constraints
        self.applyPositionConstraintsToImage(imageView)
    
        imageView.contentMode = UIViewContentMode.ScaleAspectFit
    
        // Create a position constraint to tie the bottom of the last image to the bottom of the view so that the scroll view can size correctly
    
        self.lastImageBottomConstraint = NSLayoutConstraint(item: imageView, attribute: NSLayoutAttribute.Bottom, relatedBy: NSLayoutRelation.Equal, toItem: self.contentView, attribute: NSLayoutAttribute.BottomMargin, multiplier: 1, constant: 20)
    })
     }
    
     func applySizeConstraintsToImage(imageView:UIImageView) {
    
    // set contstraints for the imageview
    let heightConstraint:NSLayoutConstraint = NSLayoutConstraint(item: imageView, attribute: NSLayoutAttribute.Height, relatedBy: NSLayoutRelation.Equal, toItem: nil, attribute: NSLayoutAttribute.NotAnAttribute, multiplier: 1, constant: CGFloat(imageHeight))
    
    imageView.addConstraint(heightConstraint)
    
    
     }
    
     func applyPositionConstraintsToImage(imageView:UIImageView) {
    
    // Set the position of the imageview
    let verticalConstraint:NSLayoutConstraint = NSLayoutConstraint(item: imageView, attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: routeDetailLabel, attribute: NSLayoutAttribute.Bottom, multiplier: 1, constant: CGFloat((20 * (imageNumber)) + (imageHeight * (imageNumber-1))))
    
    let centerXConstraint = NSLayoutConstraint(item: imageView, attribute: .CenterX, relatedBy: .Equal, toItem: contentView, attribute: .CenterX, multiplier: 1, constant: 0);
    
    // Add position constraints to the image
    self.contentView.addConstraints([verticalConstraint,centerXConstraint])
    
          }
       }
    

0 个答案:

没有答案