Blog
>Lista ejercicios >
Ejercicio 5
Hola developers, ya nos metemos con la arquitectura MultiView, ahora crearemos una aplicación con pestañas.
EJERCICIO 5 : Aplicación con arquitectura Tabbed - Application
Comenzamos explicando un poquito esta arquitectura :
Estas plantillas permiten desarrollar una aplicación que se basa en unas pestañas en una barra para presentar distintas vistas, cada una tendrá un contenido distinto.
Hay un controlador de tipo Tab BarController (UITabBarController) que nos permite activar la vista deseada.
Cada botón está asociado a una vista y podemos modificar el nombre y la imagen de cada pestaña en el inspector de atributos situado en la parte derecha.
Por defecto se mostrarán 2 vistas por defecto, pero se pueden añadir nuevas vistas arrastrando al storyboard objetos UIViewController y asociándolos de manera conveniente.
Cada vez que agregamos un View Controller solo nos queda realizar la conexión. (Tab Bar Controller)
Creamos un nuevo proyecto : Create new proyect - Tabbed Application
Esta es la apariencia de nuestro storyboard
Si queremos añadir alguna funcionalidad a las opciones que hemos agregado manualmente mediante código, tenemos que ir al proyecto - create new file - Objetive-C.class, sin marcar la opcion de generar el archivo .XIB seleccionar nombre clase, y subclass of UIViewController, movemos los dos archivos al proyecto, y en el panel de la derecha arriba en Custom Class, asociamos la clase creada con la view.
Ahora, ¿Como modificar el icono y el nombre de los items del Tab Bar? Lo tendremos que hacer es hacer doble click en el icono e item de cada View Controller, y aparecerá el panel de abajo, simplemente arrastramos nuestras imagenes al proyecto y los referenciamos desde ahí :
Además, si conectas mas de cinco View Controller a un Tab Bar Controller, automáticamente se crea una pestaña “More…” al momento de ejecutar la aplicación.
Hola developers, ya nos metemos con la arquitectura MultiView, ahora crearemos una aplicación con pestañas.
EJERCICIO 5 : Aplicación con arquitectura Tabbed - Application
Comenzamos explicando un poquito esta arquitectura :
Estas plantillas permiten desarrollar una aplicación que se basa en unas pestañas en una barra para presentar distintas vistas, cada una tendrá un contenido distinto.
Hay un controlador de tipo Tab BarController (UITabBarController) que nos permite activar la vista deseada.
Cada botón está asociado a una vista y podemos modificar el nombre y la imagen de cada pestaña en el inspector de atributos situado en la parte derecha.
Por defecto se mostrarán 2 vistas por defecto, pero se pueden añadir nuevas vistas arrastrando al storyboard objetos UIViewController y asociándolos de manera conveniente.
Cada vez que agregamos un View Controller solo nos queda realizar la conexión. (Tab Bar Controller)
Creamos un nuevo proyecto : Create new proyect - Tabbed Application
Esta es la apariencia de nuestro storyboard
Bien, ahora personalizamos un poco las vistas y añadimos un par de
ViewControllers al storyboard para proceder a añadir más opciones en el
Tab Bar, hacemos doble click en la vista principal y abajo del View
Controller donde pone Tab Bar Controller hay 3 iconos, pues bien en el
amarillo clickamos con el botón derecho del ratón y lo arrastramos a las
nuevas View Controllers que hemos creado y personalizado, ahi
seleccionamos View Controller :
Si queremos añadir alguna funcionalidad a las opciones que hemos agregado manualmente mediante código, tenemos que ir al proyecto - create new file - Objetive-C.class, sin marcar la opcion de generar el archivo .XIB seleccionar nombre clase, y subclass of UIViewController, movemos los dos archivos al proyecto, y en el panel de la derecha arriba en Custom Class, asociamos la clase creada con la view.
Ahora, ¿Como modificar el icono y el nombre de los items del Tab Bar? Lo tendremos que hacer es hacer doble click en el icono e item de cada View Controller, y aparecerá el panel de abajo, simplemente arrastramos nuestras imagenes al proyecto y los referenciamos desde ahí :
Además, si conectas mas de cinco View Controller a un Tab Bar Controller, automáticamente se crea una pestaña “More…” al momento de ejecutar la aplicación.
|
Indice
|
Ejercicio anterior |
Siguiente ejercicio |
