El Proyecto | Sobre nosotros | Contribuir | Donaciones | Licencia
HOME Mis cursos Finalizados
◄ Anterior
◄

Manejo de Entrada del Usuario

Siguiente ►
►

En este tema, aprenderemos cómo manejar la entrada del usuario en una aplicación de iOS utilizando Objective-C. La entrada del usuario es fundamental para crear aplicaciones interactivas y dinámicas. Veremos cómo trabajar con diferentes tipos de controles de entrada, como UITextField, UIButton y UISlider, y cómo responder a las acciones del usuario.

Contenidos

  1. Introducción a los Controles de Entrada
  2. Trabajando con UITextField
  3. Manejo de Acciones de UIButton
  4. Uso de UISlider
  5. Ejemplo Práctico
  6. Ejercicios
  7. Conclusión

Introducción a los Controles de Entrada

Los controles de entrada son componentes de la interfaz de usuario que permiten a los usuarios interactuar con la aplicación. Algunos de los controles de entrada más comunes en iOS son:

  • UITextField: Permite al usuario ingresar texto.
  • UIButton: Permite al usuario realizar una acción al tocar el botón.
  • UISlider: Permite al usuario seleccionar un valor dentro de un rango.

Trabajando con UITextField

Creación de un UITextField

Para crear un UITextField, puedes hacerlo programáticamente o utilizando Interface Builder. Aquí veremos cómo hacerlo programáticamente:

UITextField *textField = [[UITextField alloc] initWithFrame:CGRectMake(20, 100, 280, 40)];
textField.borderStyle = UITextBorderStyleRoundedRect;
textField.placeholder = @"Ingrese su nombre";
[self.view addSubview:textField];

Configuración de Delegados

Para manejar eventos como cuando el usuario comienza o termina de editar el texto, debes configurar un delegado para el UITextField:

@interface ViewController () <UITextFieldDelegate>
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    UITextField *textField = [[UITextField alloc] initWithFrame:CGRectMake(20, 100, 280, 40)];
    textField.borderStyle = UITextBorderStyleRoundedRect;
    textField.placeholder = @"Ingrese su nombre";
    textField.delegate = self;
    [self.view addSubview:textField];
}

- (BOOL)textFieldShouldReturn:(UITextField *)textField {
    [textField resignFirstResponder];
    return YES;
}

@end

En este ejemplo, textFieldShouldReturn: se llama cuando el usuario presiona la tecla de retorno en el teclado.

Manejo de Acciones de UIButton

Creación de un UIButton

Puedes crear un UIButton programáticamente de la siguiente manera:

UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];
button.frame = CGRectMake(100, 200, 100, 50);
[button setTitle:@"Presionar" forState:UIControlStateNormal];
[button addTarget:self action:@selector(buttonPressed:) forControlEvents:UIControlEventTouchUpInside];
[self.view addSubview:button];

Manejo de Eventos de UIButton

Para manejar el evento de toque del botón, debes implementar el método buttonPressed::

- (void)buttonPressed:(UIButton *)sender {
    NSLog(@"Botón presionado");
}

Uso de UISlider

Creación de un UISlider

Puedes crear un UISlider programáticamente de la siguiente manera:

UISlider *slider = [[UISlider alloc] initWithFrame:CGRectMake(20, 300, 280, 40)];
slider.minimumValue = 0;
slider.maximumValue = 100;
[slider addTarget:self action:@selector(sliderValueChanged:) forControlEvents:UIControlEventValueChanged];
[self.view addSubview:slider];

Manejo de Eventos de UISlider

Para manejar el evento de cambio de valor del slider, debes implementar el método sliderValueChanged::

- (void)sliderValueChanged:(UISlider *)sender {
    NSLog(@"Valor del slider: %f", sender.value);
}

Ejemplo Práctico

Vamos a combinar los controles anteriores en un ejemplo práctico. Crearemos una interfaz que permita al usuario ingresar su nombre, presionar un botón para mostrar un saludo y ajustar un slider para cambiar el tamaño del texto.

Código Completo

#import "ViewController.h"

@interface ViewController () <UITextFieldDelegate>

@property (nonatomic, strong) UITextField *textField;
@property (nonatomic, strong) UILabel *greetingLabel;
@property (nonatomic, strong) UISlider *slider;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    // Configuración del UITextField
    self.textField = [[UITextField alloc] initWithFrame:CGRectMake(20, 100, 280, 40)];
    self.textField.borderStyle = UITextBorderStyleRoundedRect;
    self.textField.placeholder = @"Ingrese su nombre";
    self.textField.delegate = self;
    [self.view addSubview:self.textField];
    
    // Configuración del UIButton
    UIButton *button = [UIButton buttonWithType:UIButtonTypeSystem];
    button.frame = CGRectMake(100, 200, 100, 50);
    [button setTitle:@"Saludar" forState:UIControlStateNormal];
    [button addTarget:self action:@selector(buttonPressed:) forControlEvents:UIControlEventTouchUpInside];
    [self.view addSubview:button];
    
    // Configuración del UILabel
    self.greetingLabel = [[UILabel alloc] initWithFrame:CGRectMake(20, 300, 280, 40)];
    self.greetingLabel.textAlignment = NSTextAlignmentCenter;
    [self.view addSubview:self.greetingLabel];
    
    // Configuración del UISlider
    self.slider = [[UISlider alloc] initWithFrame:CGRectMake(20, 400, 280, 40)];
    self.slider.minimumValue = 10;
    self.slider.maximumValue = 30;
    [self.slider addTarget:self action:@selector(sliderValueChanged:) forControlEvents:UIControlEventValueChanged];
    [self.view addSubview:self.slider];
}

- (void)buttonPressed:(UIButton *)sender {
    NSString *name = self.textField.text;
    if (name.length > 0) {
        self.greetingLabel.text = [NSString stringWithFormat:@"Hola, %@!", name];
    } else {
        self.greetingLabel.text = @"Por favor, ingrese su nombre.";
    }
}

- (void)sliderValueChanged:(UISlider *)sender {
    self.greetingLabel.font = [UIFont systemFontOfSize:sender.value];
}

- (BOOL)textFieldShouldReturn:(UITextField *)textField {
    [textField resignFirstResponder];
    return YES;
}

@end

Ejercicios

  1. Ejercicio 1: Agrega un UISwitch a la interfaz que permita al usuario activar o desactivar el saludo. Si el UISwitch está apagado, el UILabel debe mostrar "Saludo desactivado".

  2. Ejercicio 2: Modifica el ejemplo práctico para que el color del texto del UILabel cambie a rojo cuando el valor del UISlider sea mayor a 20.

Soluciones

Solución Ejercicio 1:

// En viewDidLoad
UISwitch *greetingSwitch = [[UISwitch alloc] initWithFrame:CGRectMake(20, 450, 0, 0)];
[greetingSwitch addTarget:self action:@selector(switchValueChanged:) forControlEvents:UIControlEventValueChanged];
[self.view addSubview:greetingSwitch];

// Método switchValueChanged
- (void)switchValueChanged:(UISwitch *)sender {
    if (sender.isOn) {
        self.greetingLabel.text = @"Saludo activado";
    } else {
        self.greetingLabel.text = @"Saludo desactivado";
    }
}

// Modificación en buttonPressed
- (void)buttonPressed:(UIButton *)sender {
    if (greetingSwitch.isOn) {
        NSString *name = self.textField.text;
        if (name.length > 0) {
            self.greetingLabel.text = [NSString stringWithFormat:@"Hola, %@!", name];
        } else {
            self.greetingLabel.text = @"Por favor, ingrese su nombre.";
        }
    } else {
        self.greetingLabel.text = @"Saludo desactivado";
    }
}

Solución Ejercicio 2:

- (void)sliderValueChanged:(UISlider *)sender {
    self.greetingLabel.font = [UIFont systemFontOfSize:sender.value];
    if (sender.value > 20) {
        self.greetingLabel.textColor = [UIColor redColor];
    } else {
        self.greetingLabel.textColor = [UIColor blackColor];
    }
}

Conclusión

En esta sección, hemos aprendido cómo manejar la entrada del usuario en una aplicación de iOS utilizando Objective-C. Hemos visto cómo trabajar con UITextField, UIButton y UISlider, y cómo responder a las acciones del usuario. Estos conceptos son fundamentales para crear aplicaciones interactivas y dinámicas. En el próximo módulo, exploraremos técnicas de depuración y pruebas para asegurar la calidad de nuestras aplicaciones.

◄ Anterior
◄
Siguiente ►
►
El Proyecto | Sobre nosotros | Contribuir | Donaciones | Licencia
© Copyright 2024. Todos los derechos reservados