Tamaño mediante CGRect frame.size con iOS

Voy a crear un ejemplo muy parecido al anterior, en el que movía una imagen por la pantalla. Esta vez incluiré 4 botones que harán de cursor para cambiar el tamaño de una etiqueta.

Tamaño mediante CGRect size.height con iOS

Tanto el modificar el tamaño de la etiqueta, como la restricción de hasta dónde puede aumentar en tamaño, van a ir controladas por unas sencillas acciones que iran sumando y restando 10 cada vez que pulsemos el cursor.

Hay que tener en cuenta que la etiqueta va a tener como punto fijo la esquina superior izquierda y cuando le demos al cursor de la derecha, crecerá horizontalmente y cuando le demos al cursor de abajo, crecerá verticalmente en esta dirección, para disminuir con los botones de arriba e izquierda.

Nos ponemos con el tema

Antes de nada, como en todas las entradas anteriores quiero indicar a las personas que vienen siguiendo los tutoriales, que actualicé mi Xcode por la versión Xcode 4.3.3.

Lo primero que tenemos que hacer es crear un proyecto nuevo.

Para ver cómo realizar el cursor y lo demás que hace referencia al diseño de este ejemplo, puedes verlo en la entrada anterior donde lo explico.

Una vez que tengamos la parte del diseño terminada pasamos a nuestros archivos de código.

Así debe quedar nuestro archivo .h

#import <UIKit/UIKit.h>
@interface ViewController : UIViewController{
    
    IBOutlet UILabel *tamanoV;
    IBOutlet UILabel *tamanoH;
    
    IBOutlet UILabel *marco;
    
    int izqDer;
    int arrAba;
    
    int tamanoHorizontal;
    int tamanoVertical;
}
@end

Así debe quedar nuestro archivo .m

#import "ViewController.h"
@interface ViewController ()
@end
@implementation ViewController

- (void)viewDidLoad{
    [super viewDidLoad];
    
    //Las variables del tamaño = 10
    izqDer = 10;
    arrAba = 10;
}

-(IBAction)derecha:(id)sender{
    
    //Controlo que el valor del tamaño horizontal no supere los 280.
    //De esta forma no saldrá de la pantalla por la parte derecha.
    if(izqDer<280){
        
        //Siempre que izqDer sea menor de 280 le voy sumando 10.
        izqDer=izqDer+10;
    }
    
    //Visualizo en pantalla el valor que tiene izqDer
    tamanoH.text=[NSString stringWithFormat:@"%i", izqDer];
    
    //Modifico el ancho de mi Label y le doy el valor que tenga izqDer
    CGRect rectanguloOrigen = marco.frame;
    rectanguloOrigen.size.width = izqDer; 
    marco.frame = rectanguloOrigen;
}

-(IBAction)izquierda:(id)sender{
    if(izqDer>10){
        izqDer=izqDer-10;
    }
    tamanoH.text=[NSString stringWithFormat:@"%i", izqDer];
    CGRect rectanguloOrigen = marco.frame;
    rectanguloOrigen.size.width = izqDer; 
    marco.frame = rectanguloOrigen;
}

-(IBAction)abajo:(id)sender{
    if(arrAba<280){
        arrAba=arrAba+10;
    }
    tamanoV.text=[NSString stringWithFormat:@"%i", arrAba];
    CGRect rectanguloOrigen = marco.frame;
    rectanguloOrigen.size.height = arrAba; 
    marco.frame = rectanguloOrigen;
}

-(IBAction)arriba:(id)sender{
    if(arrAba>10){
        arrAba=arrAba-10;
    }
    tamanoV.text=[NSString stringWithFormat:@"%i", arrAba];
    CGRect rectanguloOrigen = marco.frame;
    rectanguloOrigen.size.height = arrAba; 
    marco.frame = rectanguloOrigen;
}

- (IBAction)mostrarAlerta:(id)sender {
    UIAlertView *message = [[UIAlertView alloc] initWithTitle:@"www.untitled.es"
                           message:@"Mi cuenta de Twitter @eneakao"
                           delegate:nil
                           cancelButtonTitle:@"Disfruta aprendiendo"
                           otherButtonTitles:nil];
    [message show];
}
@end

El ejemplo es muy parecido al anterior. Hay 4 botones que van sumando o restando 10, esta vez con el valor resultante de la operación, modifico el size.width y size.height en vez de su posición en pantalla.

1º Pongo el valor de las variables que van a marcar los tamaños a 10, ya que es el tamaño real que tiene mi etiqueta cuando comiezo.

- (void)viewDidLoad{
    [super viewDidLoad];
    //Las variables del tamaño = 10
    izqDer = 10;
    arrAba = 10;
}

Únicamente he comentado uno de los botones que hacen de cursor, el de la derecha, el funcionamiento para todos es igual.

2º Controlo que el valor del tamaño horizontal no supere los 280, de esta forma no saldrá de la pantalla por la parte derecha.

if(izqDer<280){
    
     //Siempre que izqDer sea menor de 280 le voy sumando 10.
     izqDer=izqDer+10;
}

3º Visualizo en pantalla el valor que tiene izqDer.

tamanoH.text=[NSString stringWithFormat:@"%i", izqDer];

4º Modifico el ancho de mi Label y le doy el valor que tenga izqDer.

    CGRect rectanguloOrigen = marco.frame;
    rectanguloOrigen.size.width = izqDer; 
    marco.frame = rectanguloOrigen;

Ya estaría toda la parte del código terminada, ahora sólo nos faltaría enlazar el código con nuestros elementos del Storyboard.

Primero enlazaremos los Outlets marco, tamanoH y tamanoV y después Received Actions arriba, abajo, izquierda y derecha. El Received Actions mostrarAlerta lo enlazaremos con el botón que está situado dentro de las flechas.

Bueno, pues con esto estaría terminada nuestra aplicación.
Aquí tenéis un vídeo de como se ve la aplicación funcionando en el emulador del Iphone.

Espero que os haya servido de ayuda.

@eneakao