An iphone uipickerview that rotates horizontally?

Question

I've only seen it in a VERY few iPhone apps... but it looks like a picker that rotates left/right (instead of top/bottom).

They usually put it on 1 line of a tableView... to allow the user to quickly pick between a small number of choices (like 3-10).

How is that coded?

Answer 1

Continuing the answer by Dave DeLong I got it working like this......

In viewDidLoad i did this...

 CGRect frame = horizontalPickerView.frame;
        frame.size.width = 50;
        frame.size.height = 216;
        frame.origin.x=90;
        frame.origin.y = 200;
        horizontalPickerView.frame = frame;

        horizontalPickerView.transform = CGAffineTransformMakeRotation(3.14159/2); 






- (UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view{
        UILabel *lbl = [[[UILabel alloc] initWithFrame:CGRectMake(0, 0, 30, 20)] autorelease];
        lbl.transform = CGAffineTransformMakeRotation(-3.14159/2);
        lbl.text = @"hi";
        return lbl;
    }

Hope this helps

Answer 2

Here you will find source code for Picker which is horizontally aligned.

Answer 3

You can do this by taking a regular UIPickerView, adjusting its width (via setFrame:), and then applying an NSAffineTransform to rotate it 90º. You'll then need to rotate each item in the picker 90º the other way.

It's a little tedious to do it properly, but it can be done.

Answer 4

@Madhup's code lead me in the general direction I wanted when I searched for the horizontal UIPickerView but I then realized the question asked wasn't really addressed so for anyone who was looking for a more suitable answer to the left-to-right rotation. The code in the answers I'd read were all to enable left-to-right swiping, causing the picker to push the labels/rows with higher values to the left of the view. Any ways here's my contribution:

In the viewDidLoad method:

    yourPickerView.frame = frame;
    yourPickerView.transform = CGAffineTransformMakeRotation(4.71238898); //Instead of rotating clockwise 90° we're rotating 90° counterclockwise. 4.71238898 being ≈270° in radians.
    [self.view addSubview:self.picker];
    self.yourPickerView.delegate = self;
    self.yourPickerView.dataSource = self;
    self.yourPickerView.showsSelectionIndicator = YES;
    self.yourPickerView.userInteractionEnabled = YES;

The pickerView's method:

  -(UIView *)pickerView:(UIPickerView *)pickerView viewForRow:(NSInteger)row forComponent:(NSInteger)component reusingView:(UIView *)view{
      UILabel *label = [[[UILabel alloc] initWithFrame:CGRectMake(0, 0, 20, 20)] autorelease];
    yourLabel.transform = CGAffineTransformMakeRotation(1.57079633); //Instead of rotating counterclockwise 90° we're rotating 90° clockwise 1.57079633 being ≈90° in radians.
    yourLabel.font = [UIFont fontWithName:@"System-Bold" size:18]; //Your font here.
    yourLabel.text = @"yourLabel's text"; //or like me [NSString stringWithFormat:@"%@, [yourArray objectAtIndex:row]]
    yourLabel.backgroundColor = [UIColor clearColor];
    return label;
  }