3

我想构建一个简单的自定义视图，它使用 UIDynamicAnimator 从底部向上滑动。

当应用程序加载时，我使用以下方法从屏幕上偏移视图：

panelWidth   = originView!.frame.size.width
panelHeight  = originView!.frame.size.height/2
screenHeight = originView!.frame.size.height

// Set the frame for the container of this view based on the parent
container.frame = CGRectMake(0, screenHeight, panelWidth, panelHeight)

为了设想这一点，我希望视图显示为：

|-----|
|     |
|  A  | <--- Main View 
|     | 
|-----|
|-----|
|  B  | <--- Second View (offset by screen height so it draws directly under (0,height))
|-----|

我已经设置了手势识别器来检测我何时向上和向下滑动（向上显示，向下关闭），但是现在视图从屏幕上反弹，我似乎永远无法恢复。

使用我的动画师，我使用以下代码

animator.removeAllBehaviors()
isOpen = open

let gravityY:CGFloat  = (open) ? -0.5 : 0.5 
let gravityX:CGFloat  = 0  
let magnitude:CGFloat = (open) ? -20 : 20
let boundaryY:CGFloat = (open) ? -panelHeight : panelHeight
let boundaryX:CGFloat = (open) ? 0 : 0

在展示其余代码之前，我想我应该讨论一下我的常量。矢量数学不是我的强项，所以这可能是所有这一切都出错的唯一原因。我将值设置为负值，open因为我想将视图动画返回到屏幕上，这意味着向上动画，因此我假设我需要负重力。

我将boundaryY设置为面板的高度，因为我只想将它动画到屏幕上到窗口的高度，目前它飞离顶部（当我调试屏幕高度= 667和panelHeight = 333.5所以我不'不明白为什么它超过了那个标记）

// animator behaviours - here I just create animaters on the panels container
let gravityBehaviour:UIGravityBehavior = UIGravityBehavior(items: [container])
let collisionBehaviour:UICollisionBehavior = UICollisionBehavior(items: [container])
let pushBehaviour:UIPushBehavior = UIPushBehavior(items: [container], mode: UIPushBehaviorMode.Instantaneous)
let panelBehaviour:UIDynamicItemBehavior = UIDynamicItemBehavior(items:[container])

// Gravity behaviour - I don't want it to move in X direction, only Y
gravityBehaviour.gravityDirection = CGVectorMake(gravityX, gravityY)

// collision detection - I think this is the major problem, how does this work...
collisionBehaviour.addBoundaryWithIdentifier("basePanelBoundary", fromPoint: CGPointMake(boundaryX, 0), toPoint: CGPointMake(boundaryX, boundaryY))

// push behaviours
pushBehaviour.magnitude = magnitude

// panel behaviours
panelBehaviour.elasticity = 0.3

// bind behaviours
animator.addBehavior(gravityBehaviour)
animator.addBehavior(collisionBehaviour)
animator.addBehavior(pushBehaviour)
animator.addBehavior(panelBehaviour)

我主要关心碰撞检测，因为我相信这是导致视图旋转并从屏幕上飞出的原因，我该如何解决这个问题？

4

1 回答 1

1

经过一些进一步的研究，我意识到我使用了太多的组件来实现我想要的动画，我还意识到我的边界定义不明确，这就是导致我的面板从窗口中射出的原因。

为了解决这个问题，我首先修改了我的边界，以便它们与我在屏幕上指定的坐标共存：

collisionBehavior.addBoundaryWithIdentifier("upperBoundary", fromPoint: CGPointMake(0, screenHeight - panelHeight), toPoint: CGPointMake(boundaryX, screenHeight - panelHeight))
collisionBehavior.addBoundaryWithIdentifier("lowerBoundary", fromPoint: CGPointMake(0, screenHeight+panelHeight), toPoint: CGPointMake(boundaryX, screenHeight+panelHeight))

然后我定义了一个重力矢量，其值受到open布尔切换值的影响：

let gravityY:CGFloat  = (open) ? -1.5 : 1.5
gravityBehavior.gravityDirection = CGVectorMake(0, gravityY)

最后，我将行为绑定到动画师，动画按预期工作。

总之，如果您是 UIDynamics 的新手，我建议您在深入了解代码之前花一些时间在纸上，一旦我分解了这个问题，这比我第一次尝试要容易得多。

工作代码

func showBasePanel(open:Bool)
{
    animator.removeAllBehaviors()
    isOpen = open

    // Define constants to be plugged into animator
    let gravityY:CGFloat  = (open) ? -1.5 : 1.5
    let boundaryY:CGFloat = panelHeight
    let boundaryX:CGFloat = panelWidth

    // animator behaviours
    let gravityBehavior:UIGravityBehavior = UIGravityBehavior(items: [container])
    let collisionBehavior:UICollisionBehavior = UICollisionBehavior(items:[container])
    let panelBehavior:UIDynamicItemBehavior = UIDynamicItemBehavior(items:[container])

    // Set the behvaiours
    panelBehavior.allowsRotation = false
    panelBehavior.elasticity = 0

    // Set collision behaviours
    collisionBehavior.addBoundaryWithIdentifier("upperBoundary", fromPoint: CGPointMake(0, screenHeight - panelHeight), toPoint: CGPointMake(boundaryX, screenHeight - panelHeight))
    collisionBehavior.addBoundaryWithIdentifier("lowerBoundary", fromPoint: CGPointMake(0, screenHeight+panelHeight), toPoint: CGPointMake(boundaryX, screenHeight+panelHeight))
    gravityBehavior.gravityDirection = CGVectorMake(0, gravityY)

    // set the animator behvaiours
    animator.addBehavior(gravityBehavior)
    animator.addBehavior(panelBehavior)
    animator.addBehavior(collisionBehavior)
}
于 2015-04-16T15:01:09.440 回答