如何在UIViewController的不同位置添加相同的uiview倍数?

时间:2015-08-15 19:23:25

标签: ios swift uiview uiviewcontroller

我正试图迅速实现这一目标。 enter image description here

到目前为止,我创建了自己的自定义视图,它是UIView类的子类:

 class MyConnections: UIView {

override init(frame: CGRect) {
    super.init(frame: frame)
}

required init(coder aDecoder: NSCoder) {
    super.init(coder: aDecoder)
}


// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
override func drawRect(rect: CGRect) {
    // Drawing code
    let context = UIGraphicsGetCurrentContext()
    CGContextSetLineWidth(context, 1)
    CGContextSetStrokeColorWithColor(context, UIColor.blackColor().CGColor)
    let circle = CGRectMake(5, 60, 80, 80)
    CGContextAddEllipseInRect(context, circle)
    CGContextStrokePath(context)
    CGContextSetFillColorWithColor(context, UIColor.whiteColor().CGColor)
    CGContextFillEllipseInRect(context, circle)

}

}

这是我的视图控制器,我将上面的视图添加为子视图:

let profile = MyConnections()

override func viewDidLoad() {
    super.viewDidLoad()

    profile.backgroundColor = UIColor.clearColor()
    view.addSubview(profile)
    self.profile.setTranslatesAutoresizingMaskIntoConstraints(false)

    //constraints for the location button
    let horizontalConstraint = NSLayoutConstraint(item: self.profile, attribute: NSLayoutAttribute.Leading, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Leading, multiplier: 1.0, constant: 10)
    let verticalConstraint = NSLayoutConstraint(item: self.profile
        , attribute: NSLayoutAttribute.Top, relatedBy: NSLayoutRelation.Equal, toItem: self.view, attribute: NSLayoutAttribute.Top, multiplier: 1.0, constant: 20)
    let widthConstraint = NSLayoutConstraint(item: self.profile, attribute: NSLayoutAttribute.Width, relatedBy: NSLayoutRelation.Equal, toItem: nil, attribute: NSLayoutAttribute.NotAnAttribute, multiplier: 1.0, constant: 150)
    let heightConstraint = NSLayoutConstraint(item: self.profile, attribute: NSLayoutAttribute.Height, relatedBy: NSLayoutRelation.Equal, toItem: nil, attribute: NSLayoutAttribute.NotAnAttribute, multiplier: 1.0, constant: 150)

    self.view.addConstraints([verticalConstraint, horizontalConstraint, widthConstraint, heightConstraint])
    // Do any additional setup after loading the view.
}

上面的所有代码都给了我一个圆圈。现在我想在图像中看到的不同位置多次重复相同的圆圈。我可以创建uiview的多个实例,将它们添加为子视图,但每次我都必须为它定义新的约束,我不想这样做。

任何人都可以帮助我并给我一个有效的答案吗?

3 个答案:

答案 0 :(得分:3)

你应该知道UIView可以有一个superview / parent。如果您将其作为子视图添加到不同的位置(使用addSubview方法),它将从第一个位置移除并作为子视图添加到新位置。 在您添加更多子视图的情况下,您必须创建更多UIView对象,而不是使用单个全局UIView。 如果布局重复,则UITableView / UICollectionView是更好的选择。

答案 1 :(得分:0)

您的要求和UI有资格获得UICollectionView我认为您应该使用UICollectionView并且可以创建带有圆形图像和徽章视图的自定义UICollectionViewCell,并且它们会添加dataSource和委托方法。这不仅有助于创建UI,还可以通过重用单元格来提高应用程序的性能 Here是关于UICollectionView

的精彩教程

答案 2 :(得分:0)

以下是以编程方式创建集合视图的简化视图: 以编程方式创建集合视图和布局,就像您编写的任何其他视图一样,并将其添加为子视图,如下所示:

lazy var myCollectionView : UICollectionView = {
    let layout = YourFlowLayout()
    layout.scrollDirection = self.direction;
    layout.minimumInteritemSpacing = 0
    layout.minimumLineSpacing = 0

    let cv = UICollectionView(frame: CGRect.zero, collectionViewLayout: layout)
    cv.dataSource = self
    cv.delegate = self
    cv.isPagingEnabled = true
    cv.backgroundColor = UIColor.clear
    cv.showsHorizontalScrollIndicator = false
    cv.showsVerticalScrollIndicator = false
    cv.allowsMultipleSelection = false
    return cv
}()

您的流程布局可能类似于:

mport UIKit

class Yourflowlayout: UICollectionViewFlowLayout {

override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? {

    return super.layoutAttributesForElements(in: rect)?.map {
        attrs in
        let attrscp = attrs.copy() as! UICollectionViewLayoutAttributes
        self.applyLayoutAttributes(attributes: attrscp)
        return attrscp
    }

}

override func layoutAttributesForItem(at indexPath: IndexPath) -> UICollectionViewLayoutAttributes? {
    if let attrs = super.layoutAttributesForItem(at: indexPath as IndexPath) {
        let attrscp = attrs.copy() as! UICollectionViewLayoutAttributes
        self.applyLayoutAttributes(attributes: attrscp)
        return attrscp
    }
    return nil
}


func applyLayoutAttributes(attributes : UICollectionViewLayoutAttributes) {
    if attributes.representedElementKind != nil {
        return
    }

    if let collectionView = self.collectionView {
        let stride = (self.scrollDirection == .horizontal) ? collectionView.frame.size.width : collectionView.frame.size.height
        let offset = CGFloat(attributes.indexPath.section) * stride
        var xCellOffset : CGFloat = CGFloat(attributes.indexPath.item) * self.itemSize.width
        var yCellOffset : CGFloat = CGFloat(attributes.indexPath.item) * self.itemSize.height
        if(self.scrollDirection == .horizontal) {
            xCellOffset += offset;
        } else {
            yCellOffset += offset
        }
        attributes.frame = CGRect(x: xCellOffset, y: yCellOffset, width: self.itemSize.width, height: self.itemSize.height)
    }
}

}

您可以将其他类中的collectionView添加为子视图,确保您拥有 myCollectionView.translatesAutoresizingMaskIntoConstraints = false以便您的约束被应用,并且您实际上看到了集合视图,当然还要添加约束或给它一个框架。

希望有人帮助。