Ola, somos Arume

Desenvolvemos páxinas web, aplicacións para móbiles, capas de realidade aumentada e aplicacións para Facebook. Apaixónanos a informática e somos uns perfeccionistas incurables; por eso nos nosos proxectos utilizamos estándares.

tel. 625 519 694

Mendaña de Neyra, 34, 3º B, 15008, A Coruña

Autenticarse

Rexistrarse. Esqueceches o teu contrasinal?

Etiquetas

Saltar as etiquetas

Subscríbete ás RSS

Estás en:

  • Inicio >
  • Blog >
  • iOS: Ocultar teclado numérico ou decimal (number or decimal pad)

iOS: Ocultar teclado numérico ou decimal (number or decimal pad)

13 Dec 2012 por Cruz

Comentarios: 4

iOS

O Xcode permítenos ocultar de forma moi sinxela o teclado estándar ó pulsar sobre a tecla de retorno (Return Key). É suficiente con crear un Outlet para o TextField. Un IBAction no TextField asociado ó evento DidEndOnExit cunha única liña de código: [myTextField resignFirstResponder];

O problema está cando necesitamos un teclado numérico (Number Pad) ou decimal (Decimal Pad), xa que non dispón de tecla de retorno. Unha solución rápida e útil é crear unha barra auxiliar (Toolbar) na que podemos engadir varios botóns, entre eles o de ocultar o teclado.

Resultado final da barra de tarefas

O bo desta opción é que podemos aproveitar a barra para engadir outros botóns útiles por exemplo os de navegar polos distintos TextField: "Seguinte" e "Anterior".

Ocultar teclado

Para empezar este *tutorial crearemos un proxecto cunha plantilla Single View Application. Na seguinte pantalla elixiremos "Use StoryBoards" e "Use Automatic Reference Counting".

Crear proxecto - Elixir plantilla Crear proxecto - Configurar

Unha vez creado o proxecto en Xcode iremos ó noso ficheiro MainStoryboard.storyboard. Na nosa única fiestra pomos un TextField. Co TextField seleccionado, na pestana do Inspector de Atributos buscamos Keybooard e eliximos numérico ou decimal. Para o exemplo eliximos decimal (Decimal Pad).

Para rematar eliximos unha barra de tarefas e pómola na nosa fiestra, por exemplo na parte de abaixo. A posición non importa, xa que estará oculta cando non haxa teclado e ó facela visible situarémola por código.

MainStoryboard

Para porlle un nome máis significativo ó noso botón de ocultar teclado, seleccionamos o botón, imos ó Inspector de Atributos e na propiedade Title escribimos o nome. Neste exemplo "Hecho".

O seguinte paso é crear un Outlet para o TextField. Seleccionamos a vista Assistant Editor e, con control pulsado arrastramos desde o TextField ó código. En Connection asegurámonos que é Outlet e no campo Name pomos myTextField.

Agora creamos un IBAction para o noso botón "Hecho". Con control pulsado arrastramos desde o botón ó código. Comprobamos que en Connection está seleccionado IBAction e no campo Name escribimos hideKeyboard.

Unha vez feitos estes pasos o código do noso ficheiro ViewController.h será:

//
//  ViewController.h
//  OcultarTecladoDecimal
//
//  Created by Cruz Lorenzo on 11/12/12.
//  Copyright (c) 2012 Arume. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController

@property (strong, nonatomic) IBOutlet UITextField *myTextField;

- (IBAction)hideKeyboard:(id)sender;

@end

A continuación escribiremos algo de código en ViewController.m. Primeiro sintetizaremos o TextField:

@synthesize myTextField;

Despois completamos o código da función hideKeyboard:

- (IBAction)hideKeyboard:(id)sender {
	[myTextField resignFirstResponder];
}

Chegado a este punto podemos compilar e comprobar o avance do noso proxecto. Vemos que ó pulsar sobre o TextField aparece o teclado e que ó pulsar sobre o botón "Hecho" desaparece.

Non é o que esperabades? Certo, a barra de tarefas debería estar inicialmemte oculta e que apareza e desapareza co teclado. Para conseguilo debemos crear uns observadores que nos avisen cando aparece e desaparece o teclado.

Sincronizar a barra co teclado

Empecemos por ocultar a barra de tarefas ó cargar a nosa aplicación. No MainStoryboard.storyboard seleccionamos a barra e marcamos a propiedade Hidden no Inspector de Atributos.

No MainStoryboard.storyboard creamos un Outlet para a barra de tarefas que chamaremos keyboardToolbar. Non debemos esquecernos de sintentizalo no ViewController.m.

En ViewController.h declararemos dúas funcións:

- (void)keyboardWillShow:(NSNotification *)notification;
- (void)keyboardWillHide:(NSNotification *)notification;

E en ViewController.m engadimos o seguinte código:

- (void)viewWillAppear:(BOOL)animated {
	[super viewWillAppear:animated];

	[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillShow:) name:UIKeyboardWillShowNotification object:nil];
	[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(keyboardWillHide:) name:UIKeyboardWillHideNotification object:nil];
}

- (void)viewWillDisappear:(BOOL)animated {
	[super viewWillDisappear:animated];

	[[NSNotificationCenter defaultCenter] removeObserver:self name:UIKeyboardWillShowNotification object:nil];
	[[NSNotificationCenter defaultCenter] removeObserver:self name:UIKeyboardWillHideNotification object:nil];
}

Para rematar creamos o código das dúas funcións que declaramos anteriormente no ficheiro ViewController.h

- (void)keyboardWillShow:(NSNotification *)notification {
	[keyboardToolbar setHidden:NO];

	[UIView beginAnimations:nil context:NULL];
	[UIView setAnimationDuration:0.3];

	CGRect frame = self.keyboardToolbar.frame;
	frame.origin.y = self.view.frame.size.height - 260.0;
	self.keyboardToolbar.frame = frame;

	[UIView commitAnimations];
}

- (void)keyboardWillHide:(NSNotification *)notification {
	[UIView beginAnimations:nil context:NULL];
	[UIView setAnimationDuration:0.3];

	CGRect frame = self.keyboardToolbar.frame;
	frame.origin.y = self.view.frame.size.height;
	self.keyboardToolbar.frame = frame;

	[UIView commitAnimations];
	[keyboardToolbar setHidden:YES];
}

Puxemos unha pequena animación de 0.3 segundos que é o que tarda o teclado en aparecer. O tamaño do teclado é de 260pt polo que para colocar a barra xusto encima, restamos da altura total da vista esa distancia.

Se volvemos a compilar e executar veremos que agora si temos o comportamento esperado.

Resultado final da barra da barra de tarefas

Comentarios

4 comentarios. Comentar.

1. Anónimo o 14 Feb 2013 ás 20:37:37

Tengo dos teclado, uno numerico y otro nomal, solo quiero que se oculte el teclado decimal, como lo puedo hacer

2. Cruz o 15 Feb 2013 ás 11:54:57

Supongo que cada teclado está asociado a un TextField distinto. El tutorial te explica como ocultar un teclado numérico asociado a un TextField concreto, por lo tanto, sigue los pasos del tutorial para el TextField que tiene asociado el teclado numérico.

3. Carlos Eduardo Ruiz o 25 Out 2013 ás 20:53:10

Excelente, muchas gracias. Soy Novato pero por fin empiezo a entender la manera en que funciona la vaina.

4. Anónimo o 20 Abr 2015 ás 18:53:53

muy bueno ese codigo pero lo puedes mostrar en lenuaje "swift" ??

Comentar

Comentar de forma anónima

Podes comentar poñendo calquera nome ou alcume, exceptuando os nomes de usuarios rexistrados. Máximo de 50 caracteres.

Comentar como usuario rexistrado

Rexistrarse. Esqueceches o teu contrasinal?