Declaración de variables en Swift

Así como mostré la forma de declarar una constante en Swift, ahora le toca a las variables, para ello es muy similar a como se hizo en las constante, la única diferencia es que en lugar de poner la palabra:

let

Se deberá usar la palabra reservada:

var

Se indica la palabra reservada var, posteriormente se especifica el nombre de la variable y se asigna el valor que se le quiere poner, como a continuación se presenta:
var miVariable = "Esta es una variable"
De esta forma queda declarada una constante en Swift.

Declaración de constantes en Swift

Para declarar constantes en Swift se realizan de la siguiente manera.

Se indica la palabra reservada:

let

Posteriormente se especifica el nombre de la constante y se asigna el valor que se le quiere poner, como a continuación se presenta:
let miConstante = "Esta es una constante"
De esta forma queda declarada una constante en Swift.

Cómo obtener el ancho y alto (width y height) de una pantalla en iOS con Objective-C

Para obtener el ancho y el alto de una pantalla en iOS con Objective-C es muy sencillo, bastará con ejecutar las siguientes línea según sea el caso:

Ancho (width):

[[UIScreen mainScreen] bounds].size.width;

Alto (height):

[[UIScreen mainScreen] bounds].size.height;

 

Tomar capturas de pantalla (screenshots) en iOS Simulator

Cuando queremos publicar una app para iOS, el iTunes Connect nos solicita una serie de screenshots para poder publicarla. Yo regularmente tomaba las capturas de pantalla desde los dispositivos, pero conforme fueron apareciendo más de éstos, me fue imposible contar con ellos, por lo que me vi con la necesidad de saber cómo tomar los screenshots de otra forma, a lo cual me llevo a tomarlos desde el iOS Simulator.

Tomar una captura de pantalla desde el simulador es muy sencilla, sólo bastará correr nuestra app en el iOS Simulator, y con éste corriendo bastará con presionar:

Cmd + S

o ir a:

File -> Save Screen Shot

jx_post_509_01

cualquiera de las 2 opciones creará una imagen en el Escritorio (Desktop).

Borrar los proyectos recientemente abiertos en Xcode

Realizando un post que próximamente publicaré, me ví con la necesidad de limpiar la lista de proyectos recientes en Xcode. Por tal motivo, para llevar esto a cabo, realizaremos lo siguiente:

Abriremos Xcode.

jx_post_426_01

Ahora iremos a:

File -> Open Recent -> Clear Menu

Cerramos Xcode y una vez que lo volvamos a abrir, veremos que se ha limpiado la lista de proyectos recientes.

jx_post_426_02

Crear un UIScrollView con contenido en un UIView usando XIB y Objective-C en iOS

Existen muchas formas de crear un Scroll en iOS, esta es una forma sencilla de hacerlo, sobre todo cuando tenemos un contenido fijo y requerimos que se contenido tenga scroll.

Pre requisitos:

En este ejemplo la pantalla está configurada para un iPhone de 3.5 pulgadas.

jx_post_529_01

Lo que haremos será agregar un UIScrollView dentro del UIView que tenemos.

jx_post_529_02

jx_post_529_03

Ahora se creará un nuevo UIView el cual tendrá el contenido.

jx_post_529_04

Este UIView será de Size Freedom:

jx_post_529_05

y tendrá las medidas de 320 de width y 568 de height.

jx_post_529_06

En el UIView que acabamos de crear, agregaremos algún elemento visual en él en la parte de abajo, en este caso será un UILabel.


jx_post_529_07

jx_post_529_08

Ahora se deberá crear un property del UIScrollView como del UIView y conectarlos para incrustar el UIView dentro del UIScrollView.

Para hacer la conexión puede ser como se mencionó en cualquiera de estos dos post:

Aquí use el del segundo post.

jx_post_529_09

jx_post_529_10

En este ejemplo el UIScrollView se llama scrollViewContenido y el UIView se llama viewContenido.

Abriremos el archivo ViewController.h y en su método:

– (void)viewDidLoad

vamos a agregar el siguiente código para asignar el contenido del UIView dentro del UIScrollView.

[self.scrollViewContenido setContentSize:CGSizeMake(self.viewContenido.frame.size.width, self.viewContenido.frame.size.height)];

[self.scrollViewContenido addSubview:self.viewContenido];

El método quedará de la siguiente manera:

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view from its nib.
    
    [self.scrollViewContenido setContentSize:CGSizeMake(self.viewContenido.frame.size.width, self.viewContenido.frame.size.height)];
    [self.scrollViewContenido addSubview:self.viewContenido];
}

Si ejecutamos el ejemplo, podemos mover el scroll hacía abajo y veremos el UILabel que habíamos agregado.

jx_post_529_11

Cómo conectar automáticamente una property IBOutlet de un ViewController a un XIB o Storyboard en Objective-C

Un IBOutlet sirve para conectar un elemento visual a un elemento del controlador, en este caso, conectar un elemento de nuestro XIB o Storyboard a nuestro ViewController.

En esta ocasión, se describirá como hacerlo de forma más sencilla y casi automática, en: Cómo conectar manualmente una property IBOutlet de un ViewController a un XIB o Storyboard en Objective-C se indica cómo hacerlo de forma manual.

Pre requisitos:

  • Tener creado un proyecto.
  • Contar con un Storyboard o un archivo XIB con su respectivo ViewController.

Este ejemplo cuenta con un archivo Storyboard llamado Main.storyboard y un controlador llamado ViewController.

Lo primero que haremos es abrir el archivo de la interfaz gráfica Main.storyboard y crear un UILabel.

jx_post_516_01

jx_post_516_02

Lo siguiente será crear una conexión entre el UILabel que creamos y asignarlo a un property dentro del controlador, para esto, separaremos nuestra pantalla en dos. Aseguremonos que el archivo Main.storyboard esté seleccionado.
jx_post_516_03
y ahora selecionaremos la opción:
Show the Assistant editor
jx_post_516_04
la cuál son 2 círculos enlazados de Xcode para separar en dos la pantalla y así nos mostrará de un lado la interfaz gráfica y del otro el código fuente del controller asociado.
jx_post_516_05
Hay que asegurarse que esté seleccionado nuestro archivo .h para generar la conexión, en este caso el archivo es ViewController.h.
jx_post_516_10
Ahora crearemos la conexión y la property en el ViewController asociado, para ello, presionamos sobre el UILabel que creamos junto con la tecla Ctrl, lo cual hará que se muestre una línea azul y la dirigiremos hacia la sección con el código.
jx_post_516_06
soltaremos y nos mostrará una pantalla similar a esta:
jx_post_516_07
Ahora lo que haremos será introducir el nombre de nuestra property en en campo Name y presionaremos en Connect. En este caso se llamará labelNombre.
jx_post_516_08
Se creará una property en el controller y se generará la conexión a este con el elemento de la interfaz gráfica.
jx_post_516_09

Crear un menú lateral usando SWRevealViewController en Objective-C

SWRevealViewController es una biblioteca que nos permite crear un menús laterales ya sea del lado derecho o izquierdo de nuestra pantalla. He usado esta herramienta en algunas aplicaciones y la verdad es que me ha sido de bastante utilidad y sencilla de usar.

Pre requisitos:

 

Para comenzar descargaremos SWRevealViewController.

Descomprimimos el archivo que descargamos.

Ahora agregaremos SWRevealViewController a nuestro proyecto, para ello, haremos lo siguiente:

Presionamos con botón derecho sobre el nombre del proyecto y seleccionamos la opción:

Add Files to “Nombre del proyecto…

En este caso:

Add Files to “ProyectoXib”…

jx_post_470_01

Nos aparecerá una pantalla donde deberemos buscar la ubicación del archivo que descomprimimos y que deseamos agregar a nuestro proyecto.

En mi caso está en la carpeta Downloads, dentro de esta carpeta se creó una sub carpeta llamada: SWRevealViewController-master y dentro de esta existe otra carpeta llamada SWRevealViewController, en la cual se encuentran los archivos necesarios.

Seleccionaremos dicha carpeta, marcamos las opción Copy ítems if needed y Create groups para posteriormente presionar Add.

jx_post_470_02

Se creara una carpeta amarilla con el nombre de:

SWRevealViewController

Ahora abriremos el archivo AppDelegate.h y abajo de los import que tengamos:

#import <UIKit/UIKit.h>

jx_post_470_03

Agregaremos la siguiente línea:

@class SWRevealViewController;

jx_post_470_04

También se agregará la siguiente propiedad:

@property (strong, nonatomic) SWRevealViewController *viewController;

jx_post_470_05

Ahora crearemos un controller que tendrá la información del menú, en mi caso lo llamaré MenuViewController.

Para esto, seleccionamos el proyecto con carpeta amarilla y presionamos el botón derecho para seleccionar la opción New File…

En este ejemplo sería:

ProyectoXib -> New File…

jx_post_470_06

Aparecerá una pantalla donde seleccionamos la opción Cocoa Touch Class:

iOS -> Source Cocoa Touch Class

Presionamos Next y se mostrará una pantalla donde nos pide los datos del ViewController a crear, en este caso le pondré el nombre MenuViewController y marcar la opción Also create XIB file.

jx_post_470_07

Presionamos Next y por último se nos preguntará donde crear los archivos, aquí sólo hay que presionar en Create.

Ahora que tenemos ya nuestro controller para el menú, abriremos el archivo MenuViewController.xib para agregar el contenido de nuestro menú. Aquí colocaré un botón, pero lo más común para este menú es utilizar un UITableViewController para realmente dar el efecto de menú, pero cada quién es libre de construir el menú como se desee.

En este ejemplo el MenuViewController.xib quedaría de la siguiente manera:

jx_post_470_08

Abriremos el archivo AppDelegate.m e importaremos los siguientes archivos:

#import “SWRevealViewController.h”
#import “MenuViewController.h”

jx_post_470_09

Agregaremos a:

@interface AppDelegate ()

lo siguiente:

<SWRevealViewControllerDelegate>

Para que quede de la siguiente manera:

@interface AppDelegate()<SWRevealViewControllerDelegate>

Ahora dentro del método:

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions

Debido a que este post se está basando en uno anterior, ya tenemos creado un objeto llamado: ViewControllerPrincipal el cual seguiremos usando.

Crearemos un navigationController para nuestra viewControllerPrincipal, esto es de la siguiente manera:

UINavigationController *navPrincipal = [[UINavigationController alloc] initWithRootViewController:viewPrincipal];

Crearemos un objeto del controlador del menú:

MenuViewController *menuView = [[MenuViewController alloc] initWithNibName:@"MenuViewController" bundle:nil];

Ahora crearemos el objeto del controlador SWRevealViewController que se encargará de dar el comportamiento del menú. Esto es de la siguiente manera:

SWRevealViewController *revealView = [[SWRevealViewController alloc] initWithRearViewController:menuView frontViewController:navPrincipal];

Al objeto revealView que creamos, le asignaremos el delegate para que pueda manejar los comportamientos.

 revealView.delegate = self;

Lo siguiente será asignarle a nuestra propiedad viewController definida en nuestro AppDelegate.h, el objeto revealView.

self.viewController = revealView;

Lo último que faltará hacer en este archivo es asignar al rootViewController de nuestro window nuestro atributo viewController, esto se hace de la siguiente manera:

[self.window setRootViewController:self.viewController];

Todo este método se verá de la siguiente manera:

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    // Override point for customization after application launch.
    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    
    ViewControllerPrincipal *viewPrincipal = [[ViewControllerPrincipal alloc] initWithNibName:@"ViewControllerPrincipal" bundle:nil];
    MenuViewController *menuView = [[MenuViewController alloc] initWithNibName:@"MenuViewController" bundle:nil];
    UINavigationController *navPrincipal = [[UINavigationController alloc] initWithRootViewController:viewPrincipal];
    SWRevealViewController *revealView = [[SWRevealViewController alloc] initWithRearViewController:menuView frontViewController:viewPrincipal];
    revealView.delegate = self;
    self.viewController = revealView;
    [self.window setRootViewController:self.viewController];
    [self.window makeKeyAndVisible];
    
    return YES;
}
 jx_post_470_10

Abriremos el archivo ViewControllerPrincipal.h y haremos el siguiente import:

#import “SWRevealViewController.h”

Dentro del método:

– (void)viewDidLoad

Obtendremos el comportamiento del revealViewController de la siguiente manera:

SWRevealViewController *revealController = [self revealViewController];

Ya que tenemos creado este objeto, asignaremos los gestos para mover el menú de derecha a izquierdo o viceversa.

[revealController panGestureRecognizer];

[revealController tapGestureRecognizer];

Ahora crearemos un botón para el navigationBar que será el que se encargará de al ser presionado, mostrar u ocultar el menú.

 UIBarButtonItem *revealButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"Menú" style:UIBarButtonItemStylePlain target:revealController action:@selector(revealToggle:)];

por último asignamos el botón al navigationBar del lado izquierdo.

[self.navigationItem setLeftBarButtonItem:revealController];

Esto se verá así:

- (void)viewDidLoad {
    [super viewDidLoad];
    
    [self setTitle:@"Principal"];
    
    SWRevealViewController *revealController = [self revealViewController];
    
    [revealController panGestureRecognizer];
    [revealController tapGestureRecognizer];
    
    UIBarButtonItem *revealButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"Menú" style:UIBarButtonItemStylePlain target:revealController action:@selector(revealToggle:)];
    
    [self.navigationItem setLeftBarButtonItem:revealButtonItem];
}

jx_post_470_11

El menú se verá así:

jx_post_470_12


jx_post_470_13

Desactivar Auto Layout en iOS

En mi caso, a veces me gusta desactivar la opción de Auto Layout para usar la forma de diseño anterior de pantallas. Para hacer esto es muy sencillo aunque si manejan varios archivos .xib, será necesario hacerlo en cada uno de esos archivos.

Abriremos nuestro archivo xib o storyboard.

 

jx_post_576_01

 

Ahora seleccionamos la opción de:

File inspector

 

jx_post_576_02

 

Entre las secciones de File inspector encontraremos una sección llamada:

Interface Builder Document

ahí encontraremos la opción:

Use Auto Layout

la cual deberemos desmarcar y también se desmarcará la opción de:

Use Size Classes

 

jx_post_576_03

 

Se nos preguntará lo siguiente:

 

jx_post_576_04

 

Presionamos sobre:

Disable Size Classes

Y eso será todo

 

 

 

Cómo conectar manualmente una property IBOutlet de un ViewController a un XIB o Storyboard en Objective-C

Un IBOutlet sirve para conectar un elemento visual a un elemento del controlador, en este caso, conectar un elemento de nuestro XIB o Storyboard a nuestro ViewController.

En esta ocasión, se describirá como hacerlo de forma manual y después crear la conexión, en otro post se indicará cómo hacerlo de una manera más sencilla y casi automática.

Pre requisitos:

  • Tener creado un proyecto.
  • Contar con un Storyboard o un archivo XIB con su respectivo ViewController.

Este ejemplo cuenta con un archivo XIB y un controlador llamados ViewController.

Lo primero que haremos es abrir el archivo ViewController.h y crear la siguiente propiedad:

@property (strong, nonatomic) IBOutlet UILabel *labelNombre;

Ahora iremos al archivo de la interfaz gráfica ViewController.xib y crearemos un UILabel.
jx_post_476_01
Lo siguiente será crear el conexión de la propiedad labelNombre definida en el archivo ViewController.h y el elemento UILabel agregado a la interfaz gráfica.
Para ello, presionaremos sobre File’s Owner que se encuentra en:
Placeholers -> File’s Owner
junto con la tecla Ctrl, lo cual hará que se muestre una línea azul y dirigimos hacia donde está el UILabel.
jx_post_476_02
dejamos de presionar y nos aparecerá un menú:
jx_post_476_03
Nos aparecerán todos los elementos visuales que con los que se puede relacionar, en este caso como podemos observar, se muestra el nombre de la propiedad que definimos en nuestro ViewController. Bastará con presionar sobre el nombre de nuestra propiedad para que quede hecha la conexión.
jx_post_476_04
Con eso quedará realizada la relación entre nuestro elemento visual y un objeto del controlador.

Crear un proyecto en Xcode 6 usando Xib en lugar de Storyboard con Objective-C

Para todos aquellos que como yo, les sigue gustando trabajar con archivos XIB en lugar de Storyboard en la programación de apps en iOS. Aquí presento la forma en que pueden crear un proyecto usando archivos XIB en la vista y Objective-C como lenguaje de programación, debido a que con las nuevas versiones de Xcode, sólo podemos crear proyectos con Storyboard’s por default.

Abriremos Xcode:

jx_post_421_01

 

Creamos un nuevo proyecto:

Create a new Xcode project

Ahora crearemos un Single View Application:

iOS -> Application -> Single View Application

jx_post_421_02

Presionamos en Next y en la siguiente pantalla ingresamos los datos que deseamos para nuestro proyecto, donde deberemos verificar que este seleccionado en el lenguaje de programación Objective-C.

Language: Objective-C

jx_post_421_03

Presionamos Next y la siguiente pantalla es para decidir en donde guardar el proyecto.

jx_post_421_04

Ahora sólo presionamos en Create y quedará creado nuestro proyecto.

Lo siguiente por hacer es borrar los archivos:

ViewController.h

ViewController.m

Main.storyboard

jx_post_421_05

Ahora que hemos borrado los archivos, crearemos un ViewController con su archivo XIB, para esto, seleccionamos el nombre del proyecto con la carpeta amarilla, en este ejemplo:

ProyectoXib -> ProyectoXib

jx_post_421_10

presionamos con botón derecho y en el menú presionamos en:

File -> New -> File…

jx_post_421_06

 

Aparecerá una pantalla donde seleccionamos la opción Cocoa Touch Class:

iOS -> Source Cocoa Touch Class

jx_post_421_07

Presionamos Next y se mostrará una pantalla donde nos pide los datos del ViewController a crear, en este caso le pondré el nombre ViewControllerPrincipal y hay que cerciorarse en marcar la opción Also create XIB file.

jx_post_421_08

Presionamos Next y por último se nos preguntará donde crear los archivos, aquí sólo hay que presionar en Create.

jx_post_421_09

Ya que tenemos estos archivos creados, abriremos el archivo AppDelegate.m e importamos el controlador que acabamos de crear, que en este caso es ViewControllerPrincipal, y lo colocaremos como sigue:

#import “AppDelegate.h”

#import “ViewControllerPrincipal.h”

jx_post_421_10

 

Ahora en el método:

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
    // Override point for customization after application launch.
    
    return YES;
}

Lo modificaremos para crear un objeto del controlador que creamos y lo asignaremos para que esta sea la pantalla que deberá de mostrarse.

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
// Override point for customization after application launch.

self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];

ViewControllerPrincipal *viewPrincipal = [[ViewControllerPrincipal alloc] initWithNibName:@"ViewControllerPrincipal" bundle:nil];
[self.window setRootViewController:viewPrincipal];

[self.window makeKeyAndVisible];

return YES;
}

jx_post_421_11

Por último habrá que quitar dentro de la información general del proyecto que la interfaz principal sea Main. Esto se encuentra en:

Nombre del proyecto -> TARGETS -> Nombre del proyecto -> General -> Main interface

En el ejemplo que tenemos, sería:

ProyectoXib -> TARGETS -> ProyectoXib -> General -> Main interface

En Main Interface deberemos quitar Main para así permitir que la pantalla que creamos, sea la que se vea.

 

jx_post_421_12

Bastará con borrarla y ahora si podemos ejecutar nuestro proyecto y ver la interfaz XIB que creamos.

Reproduciendo sonidos en nuestra app usando AudioToolbox

En esta ocasión voy a ver cómo se puede reproducir un archivo de sonido usando el framework AudioToolbox, esto es muy útil cuando queremos reproducir archivos con algunos efectos de audio al presionar un botón o realizar cierta acción.

Para iniciar deberemos agregar el framework AudioToolbox.framework, como se indica en la image y presionamos el signo “+”.

jx_post_198_01

Presionamos el botón “Add” y se agregará el framework.

jx_post_198_02

Hecho lo anterior, podemos agregar a nuestro proyecto, un archivo de sonido, para ejemplificar, aquí se usará un archivo en formato .mp3.

Presionamos con el botón derecho del ratón sobre una de las carpetas del proyecto como en este caso Supporting Files y elegimos la opción Add Files To “NombreProyecto”… como se puede ver en la imagen.

jx_post_198_03

Buscamos y seleccionamos el archivo que deseamos, en mi caso coloqué el archivo dentro del proyecto, por lo que sólo seleccionaré las opciones marcadas en la imagen.

jx_post_198_04

Agregado el archivo lo siguiente que haremos será agregar el código necesario. Empezaremos incluyendo en el archivo .h o .m la biblioteca necesaria:

#import <AudioToolbox/AudioToolbox.h>

Ahora donde deseemos usar la reproducción del sonido, incluiremos las siguientes líneas:

SystemSoundID SoundID;

NSString *soundFile = [[NSBundle mainBundle] pathForResource:@"sableon" ofType:@"mp3"];

AudioServicesCreateSystemSoundID((__bridge CFURLRef) [NSURL fileURLWithPath:soundFile], &SoundID);

AudioServicesPlaySystemSound(SoundID);

Se deberá cambiar el nombre del archivo en mi caso llamado sableon (sin la extensión) por el nombre de su archivo y si fuera de otra extensión deberemos cambiar donde dice mp3.

Algo importante a considerar es que deben ser sonidos pequeños, de efectos o tonos de duración corta para que sea reproducido rápidamente, de lo contrario se pueden usar otros métodos para la reproducción del audio deseado.

Con esto agregado únicamente falta probar la reproducción del sonido de acuerdo a como lo hayan implementado, ya sea en la acción como respuesta a presionar un botón, a un gesto o lo que hubiesen implementado.

Cambiar el nombre de una app iOS

En algunas ocasiones suele ocurrir que el proyecto en iOS que comenzamos a desarrollar en Xcode sufre un cambio y requiere que se llame de otra manera, en algunos casos se recomienda renombrar el nombre de todo el proyecto, pero a veces manda error o si trabajan con sistemas de versiones como svn o git, esto suele causar problemas. Por tal motivo a veces solamente lo que se necesita cambiar es el nombre que se muestra en el dispositivo.

Supongamos que tenemos una app llamada “Proyecto1” como se ve en la imagen siguiente:

app nombre original
Pero ahora queremos que se llame “MiProy1”, para eso se realizará lo siguiente:

Vamos a: Project Navigator -> Proyecto1 -> TARGETS -> Proyecto1 -> Info -> Bundle display name presionamos en la columa Value  y cambiamos el nombre a “MiProy1” como se ve en la imagen.

Xcode renombrar nombre
Ahora seleccionamos cualquier otro elemento para que termine el modo edición del campo.

Lo que resta es volver a ejecutar la app y veremos el cambio de nombre.

App nuevo nombre