使用UIAttachmentBehavior拖动视图 [英] Dragging views using UIAttachmentBehavior

问题描述

我想拖动一个UIView，让它移动附加到其上的其他视图的位置，好像它们都是通过字符串连接的。起始状态将是一堆UIViews聚集在一起。如果你拉出一个，它附加的项目将在它与被拖动的视图之间达到最小距离后开始移动。我认为实现这一目标的最佳方法是使用UIDynamicItemBehavior，考虑到我需要将其重新捕捉到适当位置并对其施加权重。如果不做荒谬的代码，我不太清楚如何实现这一目标。我所拥有的代码可以在下面看到。不幸的是，我遇到的问题是将正方形项目拖回到square2。如果有人有任何建议，我会很乐意澄清是否需要。

I would like to drag one UIView, and have it move the position of other views attached to it as if they were all attached via string. The starting state would be a bunch of UIViews clumped together. If you pull one out, the item it's attached to will begin to move once the minimum distance is met between it and the view being dragged. I was thinking that the best way to accomplish this would be using UIDynamicItemBehavior considering I need it to snap back into place and have weight applied to it. I'm not quite sure how to accomplish this without doing ridiculous code otherwise. The code I do have can be seen below. Unfotunately, I'm having issues with the square item being dragged snapping back to square2. Would anyone have any advice, I'll be happy to clarify if that is needed.

- (void)viewDidLoad
{
    [super viewDidLoad];

    _containmentView = [[UIView alloc] initWithFrame:CGRectMake(0.0, self.view.frame.size.height/2, self.view.frame.size.width, 200)];
    [self.view addSubview:_containmentView];
    [_containmentView setBackgroundColor:[UIColor greenColor]];

    _square = [[UIView alloc]initWithFrame:CGRectMake(200, 0, 100, 100)];
    _square.backgroundColor = [UIColor yellowColor];
    [_containmentView addSubview:_square];

    _square2 = [[UIView alloc]initWithFrame:CGRectMake(100, 0, 100, 100)];
    _square2.backgroundColor = [UIColor redColor];
    [_containmentView addSubview:_square2];


    _animator = [[UIDynamicAnimator alloc]initWithReferenceView:_containmentView];
    _gravity = [[UIGravityBehavior alloc]initWithItems:@[_square, _square2]];
    _gravity.gravityDirection = CGVectorMake(-1.0, 0.0);
    [_animator addBehavior:_gravity];

    _collision = [[UICollisionBehavior alloc]initWithItems:@[_square]];
    _collision.collisionDelegate = self;
    _collision.translatesReferenceBoundsIntoBoundary = YES; //causes the boundary to use the bounds of the reference view supplied to the UIDynamicAnimator




    [_animator addBehavior:_collision];


    UIDynamicItemBehavior *itemBehaviour = [[UIDynamicItemBehavior alloc] initWithItems:@[_square]];
    itemBehaviour.elasticity = 0.6;
    [_animator addBehavior:itemBehaviour];

    UIPanGestureRecognizer *gesture = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handlePan:)];
    [_square addGestureRecognizer:gesture];

    UIAttachmentBehavior *attach = [[UIAttachmentBehavior alloc] initWithItem:_square2 attachedToItem:_square];
    [_animator addBehavior:attach];

}

-(void)handlePan:(UIPanGestureRecognizer *)gesture
{
    CGPoint touchPoint = [gesture locationInView:self.view];
    UIView* draggedView = gesture.view;

    if (gesture.state == UIGestureRecognizerStateBegan) {
        // 1. was the pan initiated from the upper part of the recipe?
        UIView* draggedView = gesture.view;
        CGPoint dragStartLocation = [gesture locationInView:draggedView];
            _draggingView = YES;
            _previousTouchPoint = touchPoint;
//            [_animator updateItemUsingCurrentState:draggedView];

    } else if (gesture.state == UIGestureRecognizerStateChanged && _draggingView) {
        // 2. handle dragging
        float xOffset = _previousTouchPoint.x - touchPoint.x;
        gesture.view.center = CGPointMake(draggedView.center.x - xOffset,
                                          draggedView.center.y);
        _previousTouchPoint = touchPoint;
//        [_animator updateItemUsingCurrentState:draggedView];

    } else if (gesture.state == UIGestureRecognizerStateEnded && _draggingView) {
        // 3. the gesture has ended
//        [self tryDockView:draggedView];
//        [self addVelocityToView:draggedView fromGesture:gesture];
        [_animator updateItemUsingCurrentState:draggedView];
        _draggingView = NO;
    }

}

推荐答案

您需要使用附件来拖动您的形状，因此动画师可以使用其物理引擎计算每个项目的位置。

You need to use an attachment to drag your shape, so the animator can calculate every items positions using its physic engine.

这是您更新的viewDidLoad：

Here is you viewDidLoad updated:

- (void)viewDidLoad
{
    [super viewDidLoad];

    _containmentView = [[UIView alloc] initWithFrame:CGRectMake(0.0, self.view.frame.size.height/2, self.view.frame.size.width, 200)];
    [self.view addSubview:_containmentView];
    [_containmentView setBackgroundColor:[UIColor greenColor]];

    _square = [[UIView alloc]initWithFrame:CGRectMake(200, 0, 100, 100)];
    _square.backgroundColor = [UIColor yellowColor];
    [_containmentView addSubview:_square];

    _square2 = [[UIView alloc]initWithFrame:CGRectMake(100, 0, 100, 100)];
    _square2.backgroundColor = [UIColor redColor];
    [_containmentView addSubview:_square2];

    _animator = [[UIDynamicAnimator alloc]initWithReferenceView:_containmentView];
    _gravity = [[UIGravityBehavior alloc]initWithItems:@[_square, _square2]];
    _gravity.gravityDirection = CGVectorMake(-1.0, 0.0);
    [_animator addBehavior:_gravity];

    _collision = [[UICollisionBehavior alloc]initWithItems:@[_square, _square2]];
    _collision.translatesReferenceBoundsIntoBoundary = YES;

    [_animator addBehavior:_collision];


    UIDynamicItemBehavior *itemBehaviour = [[UIDynamicItemBehavior alloc] initWithItems:@[_square, _square2]];
    itemBehaviour.elasticity = 0.6;
    [_animator addBehavior:itemBehaviour];

    UIPanGestureRecognizer *gesture = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handlePan:)];
    [_square addGestureRecognizer:gesture];

    UIPanGestureRecognizer *gesture2 = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handlePan:)];
    [_square2 addGestureRecognizer:gesture2];

    UIAttachmentBehavior *attach = [[UIAttachmentBehavior alloc] initWithItem:_square2 attachedToItem:_square];
    attach.damping = 1.6;
    attach.frequency = 10;
    [_animator addBehavior:attach];

}

我添加了引力，pan&碰撞到两种形状。

I added gravity, pan & collisions to both shapes.

这里看看你的handlePan方法：

Here what should look your handlePan method:

-(void)handlePan:(UIPanGestureRecognizer *)gesture
{
    CGPoint touchPoint = [gesture locationInView:_containmentView];
    UIView* draggedView = gesture.view;

    if (gesture.state == UIGestureRecognizerStateBegan) {
        // 1. was the pan initiated from the upper part of the recipe?
        _draggingView = YES;
        _previousTouchPoint = touchPoint;
        // Add a new attachment on the selected view;
        self.attachment = [[UIAttachmentBehavior alloc] initWithItem:draggedView attachedToAnchor:touchPoint];
        [self.animator addBehavior:self.attachment];
        // Could temporarily remove gravity here

    } else if (gesture.state == UIGestureRecognizerStateChanged && _draggingView) {
        // 2. handle dragging
        [self.attachment setAnchorPoint:touchPoint];

    } else if (gesture.state == UIGestureRecognizerStateEnded && _draggingView) {
        // 3. the gesture has ended
        _draggingView = NO;
        [self.animator removeBehavior:self.attachment];
        // If gravity was removed, add it back here
    }
}

拖动时可能需要暂时移除重力。只要看看我的评论，看看你能做到哪里（不要忘记在拖动结束时把它放回去）。

You may want to remove gravity temporarily while dragging. Just take a look at my comments to see where you could do it (and don't forget to put it back when the dragging's end).

如你所见，你真的需要更少的编码来处理手势：）。

As you can see, you really need less coding to handle gesture that way :).

你可以使用附件的阻尼，频率和长度来使形状对拖动手势产生不同的反应。您还可以使用UIDynamicItemBehavior的密度属性为形状添加密度。

You can play with both attachment's damping, frequency and length to make shapes react differently to the drag gesture. You can also add a density to your shapes using the UIDynamicItemBehavior's density property.

这篇关于使用UIAttachmentBehavior拖动视图的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！