Question

I am developing iPhone 2d game by using cocos2d. I need a Picker. Is it possible to use Picker in cocos2d ! If possible then tell me, How can I use a Picker in cocos2d ?

Answer 1

Yes, you can mix and match standard UIView based classes with Cocos2D classes.

In your application delegate, when you started up the Director, you created a UIWindow and attached the Director to it. You can also save a reference to the window in your appdelegate. Now you can create and add UIViews to the Window, as well as manipulate cocos2d nodes as usual through the director.

From here, it’s just a matter of creating a UIPickerView, and adding it to the window. Configuring the UIPickerView is a whole task unto itself… Nitrex88 has a good video on the subject . Also, check out UICatalog for a solid example not just of UIPickerView, but many many more UIView subclasses.

Here’s an example of adding a trivial UIPicker to a cocos2d app:

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>
#import "cocos2d.h"

@interface AppDelegate {
    UIWindow *window;
    NSArray *pickerValues;
}
@property (nonatomic, retain) UIWindow window;
@property (nonatomic, retain) NSArray *pickerValues;
@end


@implementation AppDelegate
@synthesize window, pickerValues;

-(void)applicationDidFinishLaunching:(UIApplication *)application {

    // Create Window
    window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    [window setUserInteractionEnabled:YES];
    [window setMultipleTouchEnabled:YES];

    // Set up Director and attach to window
    [[Director sharedDirector] attachInWindow:window];
    [[Director sharedDirector] setLandscape:YES];
    [[Director sharedDirector] runWithScene:[MyScene node]];

    // Create one large view and rotate the coordinates to landscape
    UIView *parentView = [[UIView alloc] initWithFrame:CGRectMake(0.0f,0.0f,480.0f, 320.0f)];
    parentView.transform = CGAffineTransformIdentity;
    parentView.transform = CGAffineTransformMakeRotation(degreesToRadian(90));
    parentView.bounds = CGRectMake(0.0f, 0.0f, 480.0f, 320.0f);

    // Initialize picker and its data source
    pickerValues = [[NSArray alloc] initWithObjects:@"0",@"1",@"2",@"3",@"4",@"5",@"6",@"7",@"8",@"9",nil];
    UIPickerView *pickerView = [[UIPickerView alloc] initWithFrame:CGRectMake(0.0f, 195.0f, 320.0f, 125.0f)];
    [pickerView setDelegate:self];

    // Attach picker to parent view and parent view to window
    [parentView addSubview:pickerView];
    [window addSubview:parentView]; 
    [window makeKeyAndVisible];
}

- (void) dealloc {
    [window release];
    [pickerValues release];
    [super dealloc];
}

// ====================
// UIPicker Callbacks
// ====================

// Fire when new picker values are selected
- (void)pickerView:(UIPickerView *)thePickerView didSelectRow:(NSInteger)row inComponent:(NSInteger)component {
    NSString *numberSequence = [NSString stringWithFormat:@"Sequence: %@%@%@",
                                [pickerValues objectAtIndex:[thePickerView selectedRowInComponent:0]],
                                [pickerValues objectAtIndex:[thePickerView selectedRowInComponent:1]],
                                [pickerValues objectAtIndex:[thePickerView selectedRowInComponent:2]]];

    NSLog(numberSequence);
}


// Number of picker wheels in the picker
- (NSInteger)numberOfComponentsInPickerView:(UIPickerView *)pickerView                          {
    return 3;
}

// Number of items in each picker wheel
- (NSInteger)pickerView:(UIPickerView *)pickerView numberOfRowsInComponent:(NSInteger)component {
    return [pickerValues count];
}


// Title for Row #
- (NSString *)pickerView:(UIPickerView *)pickerView titleForRow:(NSInteger)row forComponent:(NSInteger)component {
    return [pickerValues objectAtIndex:row]; 
}


// Row height in pixels
- (CGFloat)pickerView:(UIPickerView *)pickerView rowHeightForComponent:(NSInteger)component {
    return 40.0;
}

// Column width in pixels
- (CGFloat)pickerView:(UIPickerView *)pickerView widthForComponent:(NSInteger)component {
    return 90.0f;
}
// ====================

@end