How to slide a button from the bottom after sliding from the edge?

Question

I have implemented the following two methods

-(void)addGestureToWebView {
    [self setBottomEdgeGesture:[[UIScreenEdgePanGestureRecognizer alloc] initWithTarget:self action:@selector(handleBottomEdgeGesture:)]];
    [[self bottomEdgeGesture] setEdges:UIRectEdgeBottom];
    [[self bottomEdgeGesture] setDelegate:self];
    [[self webView] addGestureRecognizer:[self bottomEdgeGesture]];
}

and

-(IBAction)handleBottomEdgeGesture:(UIScreenEdgePanGestureRecognizer *)gesture {
    if(UIGestureRecognizerStateBegan == [gesture state] || UIGestureRecognizerStateChanged == [gesture state]) {
        //Do something
    }
}

The method handleBottomEdgeGesture should slide a button with three dots from the bottom.

I tried

UIButton *btnDots = [[UIButton alloc] initWithFrame:CGRectMake(280.0, 528.0, 20, 20)];
[btnDots setTitle:@"..." forState:UIControlStateNormal];
[btnDots setTitleColor:[UIColor whiteColor] forState:UIControlStateNormal];

but nothing happened. I didn't see any dots at my display. I am new to Objective-C and some things not so easy to develop.

Can anyone give me a good advice?

Answer 1

Since you created a button programmatically you also need to add it to sub view. Then on gesture recognizer you should change the frame of the button. A reference to the button will be needed.

Lets say you are doing this in the view controller. Create a property for dot button. In view did load create the button and assign it to the property:

    UIButton *dotButton = [[UIButton alloc] initWithFrame:CGRectMake(.0f, self.view.frame.size.height, self.view.frame.size.width, 20.0f)];
    // do additional button setup
    [self.view addSubview:dotButton];
    [dotButton addTarget:self action:@selector(onDotButtonPressed) forControlEvents:UIControlEventTouchUpInside];
    self.dotButton = dotButton;

Then in gesture recognizer you have 2 options. Either just handle the event and show the button animated or move its frame as your finger moves:

- (void)onGesture:(UIGestureRecognizer *)sender
{
#ifdef USE_ONLY_ON_EVENT
    if(sender.state == UIGestureRecognizerStateBegan)
    {
        [UIView animateWithDuration:.23 animations:^{
            self.dotButton.frame = CGRectMake(.0f, self.view.frame.size.height-self.dotButton.frame.size.height, self.view.frame.size.width, self.dotButton.frame.size.height);
        }];
    }
#else
    if(sender.state == UIGestureRecognizerStateBegan || sender.state == UIGestureRecognizerStateChanged)
    {
        CGPoint location = [sender locationInView:self.view];
        CGFloat yOffset = self.view.frame.size.height - location.y;
        if(yOffset > self.dotButton.frame.size.height)
        {
            yOffset = self.dotButton.frame.size.height;
        }
        self.dotButton.frame = CGRectMake(.0f, self.view.frame.size.height-yOffset, self.view.frame.size.width, self.dotButton.frame.size.height);
    }
    else if(sender.state == UIGestureRecognizerStateEnded || sender.state == UIGestureRecognizerStateCancelled)
    {
        CGPoint location = [sender locationInView:self.view];
        CGFloat yOffset = self.view.frame.size.height - location.y;
        if(yOffset > self.dotButton.frame.size.height*.5f) // more then half of a button visible
        {
            // show full button
            [UIView animateWithDuration:.23 animations:^{
                self.dotButton.frame = CGRectMake(.0f, self.view.frame.size.height-self.dotButton.frame.size.height, self.view.frame.size.width, self.dotButton.frame.size.height);
            }];
        }
        else
        {
            // hide button
            [UIView animateWithDuration:.23 animations:^{
                self.dotButton.frame = CGRectMake(.0f, self.view.frame.size.height, self.view.frame.size.width, self.dotButton.frame.size.height);
            }];
        }
    }
#endif
}

I hope you get the basic idea from the code.