Anthony
Anthony

Reputation: 777

Create a screen like the iPhone home screen with Scrollview and Buttons

I'm working on a project and need to create a screen similar to the iPhone home screen:

Previously I read from several forums that I have to subclass UIScrollview in order to have touch input for the UIViews on top of it. So I subclassed it overriding the methods to handle touches:

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
    //If not dragging, send event to next responder
    if (!self.dragging)
        [self.nextResponder touchesBegan:touches withEvent:event];
    else
        [super touchesBegan:touches withEvent:event];
}

In general I've override the touchesBegan:, touchesMoved: and touchesEnded: methods similarly.

Then in the view controller, I added to following code:

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
    UITouch *touch = [touches anyObject];
    UIView *hitView = (UIView *)touch.view;
    if ([hitView isKindOfClass:[UIView class]]) {
        [hitView doSomething];
        NSLog(@"touchesBegan");
    }
}

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
    // Some codes to move the icons
    NSLog(@"touchesMoved");
}

- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
    NSLog(@"touchesEnded");
}

When I run the app, I have the touchesBegan method detected correctly. However, when I tried to drag the icon, the icon just moved a tiny bit and then the page started to scroll. In console, it logged with 2 or 3 "touchesMoved" message only. However, I learned from another project that it should logged tonnes of "touchesMoved" message as long as I'm still dragging on the screen.

(I'm suspecting I have the delaysContentTouches set to YES, so it delays a little bit when I tried to drag the icons. After that minor delay, it sends to signal back to the scrollview to scroll through the page. Please correct me if I'm wrong.)

So if any help on the code to perform the above tasks would be greatly appreciated. I've stuck in this place for nearly a week with no hope. Thanks a lot.

Upvotes: 0

Views: 2120

Answers (3)

Rushabh
Rushabh

Reputation: 3203

Very Good Example For Uiscrollview Like iphone Home Screen

https://github.com/jarada/myLauncher

Upvotes: 1

toto
toto

Reputation: 455

If you are targeting iOS 3.2+ I recommend using UIGestureRecognizer. For your use case UIPanGestureRecognizer is the right choice.

The gesture handling code should be look something like this:

- (void)handlePanGesture:(UIGestureRecognizer *)gestureRecognizer;
{   
    if (gestureRecognizer.state == UIGestureRecognizerStateBegan) {
       panOffset = [gestureRecognizer locationOfTouch:0 inView:topView];
    }

    if (gestureRecognizer.state == UIGestureRecognizerStateChanged) {
        CGPoint delta = self.scrollView.contentOffset;
            delta += ([gestureRecognizer locationOfTouch:0 inView:scrollView].x - panOffset.x);
        self.scrollView.contentOffset = delta;
    }
    if (gestureRecognizer.state == UIGestureRecognizerStateEnded) {
                if(self.scrollView.contentOffset >= (self.scrollView.bounds.size.width / 2)) {
                   // animate to the next multiple of self.scrollView.bounds.size.width
                } else {
                   // animate to previous multiple
                }

    }
}

Upvotes: 0

Jack
Jack

Reputation: 13

Here i have been working on an app that is like the weather app…here is what you should do… Go to the apple developer website and search for an example app called PageControl. Then once you get that scrolllview to work with your app you should have a custom method that calculates the height and the width of the UIViews (ie the icons) and you [UIColor colorWithPatternImage:(UIImage *)image)] so you can give it an image. Then you throw the view s in a mutable array and the animation i would play around with the CA animations and the UIView animations or even going custom.

Upvotes: 0

Related Questions