在樹層次結構中對齊節點

Question

筆記：

我正在尋找替代解決方案，因為我已經嘗試更改大量 Sprite Kit 屬性值，並得出結論，這些更改是不可能的。 所以我不發布任何代碼。 您可以嘗試上述庫以獲取更多信息。

原問題：

我正在使用BLBubbleFilters庫來創建氣泡。 該庫使用磁性將對齊項目拉到屏幕中心。 而且每次屏幕打開時每個節點的定位都不一樣。

到目前為止我嘗試了什么？

• 我曾嘗試使用庫及其物理屬性（例如磁性屬性）來實現我的目標。

目標是：

• 將 'Family' 節點放在所有節點上方和上方，其余節點位於其下方。

我的想法是，每個節點都有一個屬性，例如“priority(Integer)”。 也就是說，優先級為 0 的節點將放置在所有節點之上，優先級為 1 的節點將放置在優先級為 0 的節點之下，依此類推。

由於 SpriteKit 處理物理屬性，是否有任何此類屬性或方法可以實現我的目標？

看看，家庭泡沫是如何達到頂峰的。

Answer 1

我不得不做類似的事情，我通過創建一個自定義SelectInterestsCollectionViewFlowLayOut並在UICollectionViewCells添加了氣泡。

結果是這樣。

每個單元格都是一個白色方塊，在里面我有一個角半徑為 1/2 * 高度的圖像視圖。

不同之處在於，在我的情況下，我的所有氣泡都具有相同的氣泡大小。

我的代碼是：

    enum InterestBubbleType {

    case A
    case B
    case C
    case D
    case E

    func getYPosition(cellSideSize: CGFloat) -> CGFloat {
        let spaceFromTopForTwoCellsOnTop: CGFloat = cellSideSize / 2
        switch self {
        case .A:
            return cellSideSize
        case .B:
            return cellSideSize * 2
        case .C:
            return spaceFromTopForTwoCellsOnTop
        case .D:
            return cellSideSize + spaceFromTopForTwoCellsOnTop
        case .E:
            return 0
        }
    }
}

class SelectInterestsCollectionViewFlowLayOut: UICollectionViewFlowLayout {
    var cache: [UICollectionViewLayoutAttributes] = []
    var layoutAttributes: [UICollectionViewLayoutAttributes] = []
    var cellSideSize: CGFloat!
    var xPosition: CGFloat = 0
    var itemPositions: [InterestBubbleType] = [.A,.C,.D,.E,.A,.B,.C,.D,.E,.A,.B,.C,.D,.A,.B,.C,.D,.E,.A,.B]
    var positionsToIncreaseXPosition = [0,2,5,7,10,12,14,16]

    override func prepare() {
        cache = []
        super.prepare()
        //Prepare constants
        self.xPosition = 0
        cellSideSize = self.collectionView!.height() / 3
        self.configureCasheForTwentyInterests()
    }

    private func configureCasheForTwentyInterests() {
        for i in 0...(self.itemPositions.count - 1) {
            let indexPath = IndexPath(item: i, section: 0)
            let xPosition = self.xPosition
            let frame = CGRect(x: xPosition, y: self.itemPositions[i].getYPosition(cellSideSize: self.cellSideSize), width: self.cellSideSize, height: self.cellSideSize)
            let atribute = UICollectionViewLayoutAttributes(forCellWith: indexPath)
            atribute.frame = frame
            cache.append(atribute)
            if self.positionsToIncreaseXPosition.contains(i) {
                self.xPosition += self.cellSideSize
            }
        }
    }

    override func layoutAttributesForElements(in rect: CGRect) -> [UICollectionViewLayoutAttributes]? {
        self.layoutAttributes = []
        for uiCollectionViewLayoutAttribute in self.cache {
            self.layoutAttributes.append(uiCollectionViewLayoutAttribute)
        }
        return layoutAttributes
    }

    override func layoutAttributesForItem(at indexPath: IndexPath) -> UICollectionViewLayoutAttributes? {
        return layoutAttributes[indexPath.row]
    }

    override var collectionViewContentSize: CGSize {
        let totalWidth = cellSideSize * 9
        return CGSize(width: totalWidth, height: self.collectionView!.height())
    }
}

現在它是如何工作的，在我的集合視圖中有 5 個不同的 y 位置，氣泡可以在集合視圖內，它們是 A、B、C、D、E，當您需要再移動 1 個時，我也會記住x 位置，即 1 * collectionViewWidth 大小。

您可以配置代碼以實現您自己的結果。 就我而言，我有固定數量的氣泡和固定視圖來顯示它們。 我選擇使用集合視圖進行操作的原因是，如果數字發生變化，您只需添加位置以更改 positionToIncreaseXPosition 中的 x positionsToIncreaseXPosition ，它就會起作用。