Trying to make a custom keyboard.

Discussion in 'iOS Development' started by bamhm182, Jun 17, 2009.

  1. bamhm182

    bamhm182 Member

    Joined:
    Mar 2, 2009
    Messages:
    544
    Likes Received:
    0
    Device:
    3G iPod touch
    For my app, I need a number pad, but it would be better if I had a done button. So I'm trying to create a custom keyboard. I'll upload the source code for my keyboard here once I've got it done so that others can see how to do it.

    I have a few questions though.

    The most important one, I've got the keyboard set in a view, and when I click on a button, it can call it, however, I'd like to use a text field. The problem with that is, when I click the text field, it pops up the normal keyboard instead of my keyboard.

    I have it set like this:
    [OBJC]
    - (IBAction)textEditDidBegin

    Please Register or Log in to view images

    id)sender;
    {
    [self.view addSubview: keyboardView];
    }[/OBJC]

    Also, they keyboard appears at the top of the screen. I know I'm supposed to use CGRect to to set it, but I can't for the life of me figure it out, I've tried everything I can think of.

    EDIT: Alright, I got everything sorted. Here's the source code:

    http://www.[PIRACY.mf].com/?nma02q1m5nn

    For those of you who don't want to download it, here is what I did:

    ViewController.h:
    [OBJC]#import <UIKit/UIKit.h>

    @interface Custom_KeyboardViewController : UIViewController <UITextFieldDelegate> {
    UIButton *zero,
    *one,
    *two,
    *three,
    *four,
    *five,
    *six,
    *seven,
    *eight,
    *nine,
    *done,
    *edit,
    *back;
    UITextField *textField;
    UIView *keyboardView,
    *contentView;
    }

    @property (nonatomic, retain) IBOutlet UIButton *zero,
    *one,
    *two,
    *three,
    *four,
    *five,
    *six,
    *seven,
    *eight,
    *nine,
    *done,
    *edit,
    *back;
    @property (nonatomic, retain) IBOutlet UITextField *textField;
    @property (nonatomic, retain) IBOutlet UIView *keyboardView,
    *contentView;

    - (IBAction)summonKeyboard;
    - (IBAction)zeroPressed

    Please Register or Log in to view images

    id)sender;
    - (IBAction)onePressed

    Please Register or Log in to view images

    id)sender;
    - (IBAction)twoPressed

    Please Register or Log in to view images

    id)sender;
    - (IBAction)threePressed

    Please Register or Log in to view images

    id)sender;
    - (IBAction)fourPressed

    Please Register or Log in to view images

    id)sender;
    - (IBAction)fivePressed

    Please Register or Log in to view images

    id)sender;
    - (IBAction)sixPressed

    Please Register or Log in to view images

    id)sender;
    - (IBAction)sevenPressed

    Please Register or Log in to view images

    id)sender;
    - (IBAction)eightPressed

    Please Register or Log in to view images

    id)sender;
    - (IBAction)ninePressed

    Please Register or Log in to view images

    id)sender;
    - (IBAction)donePressed

    Please Register or Log in to view images

    id)sender;
    - (IBAction)backPressed

    Please Register or Log in to view images

    id)sender;

    @end[/OBJC]


    ViewController.m:
    [OBJC]@implementation Custom_KeyboardViewController

    @synthesize zero,
    one,
    two,
    three,
    four,
    five,
    six,
    seven,
    eight,
    nine,
    done,
    back,
    edit,
    keyboardView,
    contentView,
    textField,
    keyboardView;

    - (void)awakeFromNib
    {
    [self.view addSubview:keyboardView];

    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:0.0];
    CGAffineTransform transform = CGAffineTransformMakeTranslation(0, 463);
    keyboardView.transform = transform;
    keyboardView.alpha = 0.0;
    [UIView commitAnimations];
    }

    - (IBAction)summonKeyboard
    {
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:1.0];
    CGAffineTransform transform = CGAffineTransformMakeTranslation(0, 248);
    keyboardView.alpha = 1.0;
    keyboardView.transform = transform;
    [UIView commitAnimations];
    }

    - (void)touchesBegan

    Please Register or Log in to view images

    NSSet *)touches withEvent

    Please Register or Log in to view images

    UIEvent *)event
    {
    UITouch *touch;
    touch=[touches anyObject];
    CGPoint point=[touch locationInView:self.view];

    if (CGRectContainsPoint([textField frame],point))
    {
    [self summonKeyboard];
    }

    }

    - (IBAction)donePressed

    Please Register or Log in to view images

    id)sender;
    {
    [UIView beginAnimations:nil context:nil];
    [UIView setAnimationDuration:1.0];
    CGAffineTransform transform = CGAffineTransformMakeTranslation(0, 463);
    keyboardView.transform = transform;
    keyboardView.alpha = 0.0;
    [UIView commitAnimations];
    }

    - (IBAction)zeroPressed

    Please Register or Log in to view images

    id)sender;
    {
    textField.text = [[NSString alloc] initWithFormat

    Please Register or Log in to view images

    "%@0", textField.text];
    }

    - (IBAction)onePressed

    Please Register or Log in to view images

    id)sender;
    {
    textField.text = [[NSString alloc] initWithFormat

    Please Register or Log in to view images

    "%@1", textField.text];
    }

    - (IBAction)twoPressed

    Please Register or Log in to view images

    id)sender;
    {
    textField.text = [[NSString alloc] initWithFormat

    Please Register or Log in to view images

    "%@2", textField.text];
    }

    - (IBAction)threePressed

    Please Register or Log in to view images

    id)sender;
    {
    textField.text = [[NSString alloc] initWithFormat

    Please Register or Log in to view images

    "%@3", textField.text];
    }

    - (IBAction)fourPressed

    Please Register or Log in to view images

    id)sender;
    {
    textField.text = [[NSString alloc] initWithFormat

    Please Register or Log in to view images

    "%@4", textField.text];
    }

    - (IBAction)fivePressed

    Please Register or Log in to view images

    id)sender;
    {
    textField.text = [[NSString alloc] initWithFormat

    Please Register or Log in to view images

    "%@5", textField.text];
    }

    - (IBAction)sixPressed

    Please Register or Log in to view images

    id)sender;
    {
    textField.text = [[NSString alloc] initWithFormat

    Please Register or Log in to view images

    "%@6", textField.text];
    }

    - (IBAction)sevenPressed

    Please Register or Log in to view images

    id)sender;
    {
    textField.text = [[NSString alloc] initWithFormat

    Please Register or Log in to view images

    "%@7", textField.text];
    }

    - (IBAction)eightPressed

    Please Register or Log in to view images

    id)sender;
    {
    textField.text = [[NSString alloc] initWithFormat

    Please Register or Log in to view images

    "%@8", textField.text];
    }

    - (IBAction)ninePressed

    Please Register or Log in to view images

    id)sender;
    {
    textField.text = [[NSString alloc] initWithFormat

    Please Register or Log in to view images

    "%@9", textField.text];
    }

    - (IBAction)backPressed

    Please Register or Log in to view images

    id)sender;
    {
    textField.text = [[NSString alloc] initWithFormat

    Please Register or Log in to view images

    "", textField.text];
    }

    - (void)viewDidLoad {
    [super viewDidLoad];

    UIImage *oneButtonHighlighted = [UIImage imageNamed

    Please Register or Log in to view images

    "1 Selected.png"];
    UIImage *twoButtonHighlighted = [UIImage imageNamed

    Please Register or Log in to view images

    "2 Selected.png"];
    UIImage *threeButtonHighlighted = [UIImage imageNamed

    Please Register or Log in to view images

    "3 Selected.png"];
    UIImage *fourButtonHighlighted = [UIImage imageNamed

    Please Register or Log in to view images

    "4 Selected.png"];
    UIImage *fiveButtonHighlighted = [UIImage imageNamed

    Please Register or Log in to view images

    "5 Selected.png"];
    UIImage *sixButtonHighlighted = [UIImage imageNamed

    Please Register or Log in to view images

    "6 Selected.png"];
    UIImage *sevenButtonHighlighted = [UIImage imageNamed

    Please Register or Log in to view images

    "7 Selected.png"];
    UIImage *eightButtonHighlighted = [UIImage imageNamed

    Please Register or Log in to view images

    "8 Selected.png"];
    UIImage *nineButtonHighlighted = [UIImage imageNamed

    Please Register or Log in to view images

    "9 Selected.png"];
    UIImage *zeroButtonHighlighted = [UIImage imageNamed

    Please Register or Log in to view images

    "0 Selected.png"];
    UIImage *doneButtonHighlighted = [UIImage imageNamed

    Please Register or Log in to view images

    "DONE Selected.png"];
    UIImage *backButtonHighlighted = [UIImage imageNamed

    Please Register or Log in to view images

    "Backspace Selected.png"];

    [one setBackgroundImage

    Please Register or Log in to view images

    neButtonHighlighted forState:UIControlStateHighlighted];
    [two setBackgroundImage:twoButtonHighlighted forState:UIControlStateHighlighted];
    [three setBackgroundImage:threeButtonHighlighted forState:UIControlStateHighlighted];
    [four setBackgroundImage:fourButtonHighlighted forState:UIControlStateHighlighted];
    [five setBackgroundImage:fiveButtonHighlighted forState:UIControlStateHighlighted];
    [six setBackgroundImage:sixButtonHighlighted forState:UIControlStateHighlighted];
    [seven setBackgroundImage:sevenButtonHighlighted forState:UIControlStateHighlighted];
    [eight setBackgroundImage:eightButtonHighlighted forState:UIControlStateHighlighted];
    [nine setBackgroundImage:nineButtonHighlighted forState:UIControlStateHighlighted];
    [zero setBackgroundImage:zeroButtonHighlighted forState:UIControlStateHighlighted];
    [done setBackgroundImage:doneButtonHighlighted forState:UIControlStateHighlighted];
    [back setBackgroundImage:backButtonHighlighted forState:UIControlStateHighlighted];
    }

    - (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    }

    - (void)viewDidUnload {
    }


    - (void)dealloc {
    [zero release];
    [one release];
    [two release];
    [three release];
    [four release];
    [five release];
    [six release];
    [seven release];
    [eight release];
    [nine release];
    [done release];
    [back release];
    [edit release];
    [keyboardView release];
    [super dealloc];
    }

    @end
    [/OBJC]

    Other than that, I have a UIView set up in IB with a custom keyboard picture in the background, and 12 custom buttons with nothing in them over it.

    That view is set as keyboardView.

    I've got the original view in ViewController.xib with a text field which has enable user interaction unchecked. Than the touches code in the .m tells it that it should open my keyboard.

    This is only a piece of the project I'm working on. While the project itself probably won't help many people here, I'm going to change everything to generic values and release the source code here so people can see how it works.

    Please Register or Log in to view images

  2. gojohnnyboi

    gojohnnyboi Well-Known Member

    Joined:
    Jan 25, 2008
    Messages:
    3,339
    Likes Received:
    55

    Have one global keyboard item within your app, and have its frame lie just below the screen. when needed, animate it up.
  3. bamhm182

    bamhm182 Member

    Joined:
    Mar 2, 2009
    Messages:
    544
    Likes Received:
    0
    Device:
    3G iPod touch
    Alright... I think I get it now. I still need help with the TextField part though. Thanks.
  4. gojohnnyboi

    gojohnnyboi Well-Known Member

    Joined:
    Jan 25, 2008
    Messages:
    3,339
    Likes Received:
    55
    Ah poop, that may require you to create your own text field =p
  5. Pelaez-1

    Pelaez-1 New Member

    Joined:
    May 5, 2008
    Messages:
    822
    Likes Received:
    0
    Device:
    iPhone
    That's not that hard... Just make it from a label subclass. When you touch it, it shows your keyboard, and with every keyboard stroke, you add a char to the label text.

    That text field wouldn't have all the features a UITextField has though... So it'd be very basic.

    To avoid all this, you could add a "Done" button next to your UITextField and use the Number Keyboard.
  6. bamhm182

    bamhm182 Member

    Joined:
    Mar 2, 2009
    Messages:
    544
    Likes Received:
    0
    Device:
    3G iPod touch
    I did it the easy way.

    I disabled User Interactions in IB, than put in this code:

    [OBJC]- (IBAction)summonKeyboard
    {
    [self.view addSubview:keyboardView];
    }

    - (void)touchesBegan

    Please Register or Log in to view images

    NSSet *)touches withEvent

    Please Register or Log in to view images

    UIEvent *)event
    {
    UITouch *touch;
    touch=[touches anyObject];
    CGPoint point=[touch locationInView:self.view];

    if (CGRectContainsPoint([textField frame],point))
    {
    [self summonKeyboard];
    }
    }[/OBJC]

    I've just got to finish the animations, than I'll upload the source code.

    EDIT: Alright, I've edited the OP.
  7. SkylarEC

    SkylarEC Super Moderator Emeritus Staff Member

    Joined:
    Sep 19, 2007
    Messages:
    6,642
    Likes Received:
    129
    The keyboard's just another window. Simply iterate through your windows until you find it, then iterate through subviews until you're at the view with the buttons and add in a done button. It's should be easy enough to do that, and is a much better idea that creating your own keyboard.
  8. DuMe

    DuMe New Member

    Joined:
    Jul 5, 2009
    Messages:
    1
    Likes Received:
    0
    Can you explain me how to do that? I try to do the same thing...
  9. gojohnnyboi

    gojohnnyboi Well-Known Member

    Joined:
    Jan 25, 2008
    Messages:
    3,339
    Likes Received:
    55
    You want to avoid using a UILabel as a textfield if at all possible. UITextField has a lot of 'free' features to it, like the magnifying glass and copy & paste(although this can be achieved with UIPasteboard and UIMenuController).
  10. Pelaez-1

    Pelaez-1 New Member

    Joined:
    May 5, 2008
    Messages:
    822
    Likes Received:
    0
    Device:
    iPhone
    Yeah, that's what I said...

    But it can work if you need a very basic thing, like a keypad for a password.

    Anyway, a better solution, as I said too, would be to add a button next to the textfield.

Share This Page