Question

How can I make a text field (or something that looks similar) with a number in it, which you can increase or decrease by touching it and swiping your finger up (increase) or down (decrease).

How it would work: There is a texfield with 0.0 on it. You touch it, and move your finger down. Then you see the value decrease as you move your finger further. When you stop moving your finger, the value doesn’t change.

How could this be done in Objective-C?

Answer 1

This answer is quite big, so I decided to put some sample code on github.

To cater for multiple labels, we’re first going to subclass UILabel, to add a property called dragging. We’re gong to call the class DragLabel.

DragLabel.h

#import <Foundation/Foundation.h>

@interface DragLabel : UILabel {
    BOOL dragging;
}

@property (assign) BOOL dragging;

@end

DragLabel.m

#import "DragLabel.h"

@implementation DragLabel
@synthesize dragging;

@end

---

Interface Builder

Now you need to drag three labels into the view in IB, and change all their classes to DragLabel. Make sure you do this before creating the outlets.

After doing this, hook all the outlets up to your .m and .h. In my instance, I gave them names of label1, label2 and label3.

---

Now we have our label class and interface set up, its time to write the code for the view controller.

Your Controller.h should look like this. I called it DragViewController.h

#import <UIKit/UIKit.h>
#import "DragLabel.h"

@interface DragViewController : UIViewController {
    DragLabel *label1;
    DragLabel *label2;
    DragLabel *label3;

    NSArray *draglabels;        
}

@property (nonatomic, retain) IBOutlet DragLabel *label1;
@property (nonatomic, retain) IBOutlet DragLabel *label2;
@property (nonatomic, retain) IBOutlet DragLabel *label3;

Your Controller.m should look like this. I called it DragViewController.m

#import "DragViewController.h"

@implementation DragViewController
@synthesize label1;
@synthesize label2;
@synthesize label3;

- (void)dealloc
{
    [label1 release];
    [label2 release];
    [label3 release];
    [draglabels release];
    [super dealloc];
}

- (void)viewDidLoad
{
    draglabels = [[NSArray alloc] initWithObjects:label1, label2, label3, nil];
    for (DragLabel *label in draglabels) {
        label.dragging = NO;
    }

    [super viewDidLoad];
}

- (void)movedLabel:(DragLabel *)label touchloc:(CGPoint)touchloc {
    float val = (label.center.y - touchloc.y)/10;
    label.text = [NSString stringWithFormat:@"%g",val];
}

- (void)touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
    CGPoint touchloc = [[touches anyObject] locationInView:self.view];
    for (DragLabel *label in draglabels) {
        if (CGRectContainsPoint(label.frame, touchloc)) {
            label.dragging = YES;
            [self movedLabel:label touchloc:touchloc];
        }
    }
}

- (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
    for (DragLabel *label in draglabels) {
        if (label.dragging) {
            CGPoint touchloc = [[touches anyObject] locationInView:self.view];
            [self movedLabel:label touchloc:touchloc];
        }
    }
}

- (void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
    for (DragLabel *label in draglabels) {
        label.dragging = NO;
    }
}

- (void)viewDidUnload
{
    [self setLabel1:nil];
    [self setLabel2:nil];
    [self setLabel3:nil];
    [super viewDidUnload];
}

@end

---

One last thing

To adjust the scale so it ranges from 0 to 1, only when the user drags above the label, re-implement movedLabel like this:

- (void)movedLabel:(DragLabel *)label touchloc:(CGPoint)touchloc {
    float ydif = label.center.y-touchloc.y;
    float maxheight = 100;
    if (ydif > 0) {
        if (ydif <= maxheight) label.text = [NSString stringWithFormat:@"%g",ydif/maxheight];
        else label.text = [NSString stringWithFormat:@"%g",maxheight];
    }
    else label.text = @"0.0";
}