Embed Size (px)
Citation preview
Base De Datos Con Android En algún momento como desarrolladores nos encontraremos con la necesidad de almacenar los datos de nuestras
aplicación para su posterior uso, esto incluye aplicaciones web , de escritorio y claro móviles. En este tutorial nos
concentraremos en poder almacenar los datos de nuestra aplicación en una base de datos dentro de nuestro
dispositivo Android, explicaremos a detalle cada uno de los pasos necesarios para este ejemplo y nos
concentraremos en esta ocasión en realizar un CRUD simple.
El gestor de base de datos a utilizar para este ejemplo será el de SQLite.
Una vez que estemos en nuestro proyecto crearemos una nueva clase la cual debe de extender de
SQLiteOpenHelper. Esta clase se encuentra en android.database.sqlite así que debemos de importarla, en mi caso
la clase se llamará EjemploDB.
Una vez que tenemos nuestra clase heredando de SQLiteOpenHelper necesitaremos agregar dos nuevos métodos:
El primero un método llamado onCreate el cual recibe como parámetro un objeto SQLIteDatabase. El segundo método onUpgrade que recibe como parámetros un objeto SQLiteDatabase y dos enteros (Este método
profundizaremos más a detalle en otro post).
Los métodos quedaran de la siguiente manera:
public void onCreate(SQLiteDatabase db) {
}
public void onUpgrade(SQLiteDatabase db, int oldVersion, int newVersion){
}
Dentro de nuestra clase crearemos dos nuevas variables estáticas para poder administrar de mejor manera nuestra
base de datos:
public static final int DATABASE_VERSION = 1;
public static final String DATABASE_NAME = "nombreDeTuBaseDatos.db";
como podemos observar una variable nos permitirá llevar un control del número de versión correspondiente a nuestra base
de datos y la otra almacena el nombre de nuestra base de datos.
Para ir concluyendo los preparativos de nuestra clase dentro de nuestro constructor debemos indicarle que espera
como parámetro un objeto de tipo Context, dentro de este mismo debemos llamar la constructor de la clase de la
cual heredamos (SQLiteOpenHelper ), pasándole como parámetros el contexto, el nombre de nuestra base de datos,
un cursor Factory (para este tutorial será null) y una versión, en mi caso quedaría así:
Instituto Técnico de Educación Múltiple
“Cnel. Ciriaco de Jesús Alas”
GUIA #1 PARA SEGUNDO AÑO DESARROLLO DE SOFTWARE
Asignatura: BASE DE DATOS
Docente: : Joaquín Bernaldo Sánchez Martínez
Contenido: INTRODUCCIONA A BASE DE DATOS EN ANDROID
Indicador de logro: identifica y aplica con claridad elementos principales de una base de datos orientada en android.
public EjemploDB(Context context) {
super(context, DATABASE_NAME, null, DATABASE_VERSION);
}
Lo que corresponde ahora es crear la base de datos y para ellos debemos hacerlo en nuestro método onCreate, sin
embargo primero debemos de establecer nuestras columnas de nuestra tabla, para una administración más fácil la
documentación de android nos coloca en su ejemplo establecer los nombres de las tablas mediante atributos de una
interfaz, por esta ocasión omitiremos esa parte para mantener un nivel bajo de complejidad.
Dentro de nuestra clase (en mi caso EjemploDB ) colocaremos el nombre de nuestra tabla ( o tablas) y los
nombres de nuestras columnas mediante variables de tipo String staticas :
public static final String TABLA_NOMBRES = "nombres";
public static final String COLUMNA_ID = "_id";
public static final String COLUMNA_NOMBRE = "nombre";
Con estas tres variables nos podemos dar una idea clara de que tendremos una tabla llamada nombres la cual tendrá
dos columnas, una columna _id y una nombre.
Para la creación de nuestra base de datos debemos realizarla mediante una sentencia SQL, de igual forma es
recomendable establecer esta sentencia en una variable:
private static final String SQL_CREAR = "create table "
+ TABLA_NOMBRES + "(" + COLUMNA_ID
+ " integer primary key autoincrement, " + COLUMNA_NOMBRE
+ " text not null);";
Ya tenemos el nombre de nuestra tabla, las columnas y la sentencia ahora es el momento de ejecutarlo. A nuestro
método onCreate debe quedar de la siguiente manera:
public void onCreate(SQLiteDatabase db) {
db.execSQL(SQL_CREAR);
}
Con esto indicamos que nuestra base de datos debe ejecutar una sentencia SQL, que en nuestro caso la
encontramos almacenada en la variable SQL_CREAR.
Hasta este punto nuestra clase debe parecerse a esta:
public class EjemploDB extends SQLiteOpenHelper {
public static final int DATABASE_VERSION = 1;
public static final String DATABASE_NAME = "ejemplo.db";
public static final String TABLA_NOMBRES = "nombres";
public static final String COLUMNA_ID = "_id";
public static final String COLUMNA_NOMBRE = "nombre";
private static final String SQL_CREAR = "create table "
+ TABLA_NOMBRES + "(" + COLUMNA_ID
+ " integer primary key autoincrement, " + COLUMNA_NOMBRE
+ " text not null);";
public EjemploDB(Contextcontext) {
super(context, DATABASE_NAME, null, DATABASE_VERSION);
}
public void onCreate(SQLiteDatabase db) {
db.execSQL(SQL_CREAR);
}
public void onUpgrade(SQLiteDatabase db, int oldVersion, int
newVersion) {
}
Create:
Para comenzar a utiliza nuestra base de datos vamos a crear un método llamado agregar que recibe como parámetro
un objeto String( el nombre ). El método quedaría de la siguiente manera:
public void agregar(Stringnombre){
SQLiteDatabase db = this.getWritableDatabase();
ContentValues values = new ContentValues();
values.put(COLUMNA_NOMBRE, nombre);
db.insert(TABLA_NOMBRES, null,values);
db.close();
}
Lo primero que hacemos es indicarle a la clase que vamos a hacer uso de la base de datos, lo segundo es crear un
objeto ContentValues el cual nos ayudara a almacenar de manera temporal nuestros datos relacionándolos a la
columna a la cual pertenecen (en este caso nombre a la columna nombre), ya por ultimo le indicamos a la base de
datos que deseamos insertar un nuevo elemento para ello utilizamos su método insert.
Con este sencillo método ya podemos almacenar datos en nuestra tabla.
Read:
Para poder extraer los datos crearemos otro método, el método lo nombraré obtener. Este método tendrá ciertas
peculiaridades que no es necesario que comprendas en estos momentos y son temas que se tocarán en otro
momento.
public void obtener(int id){
SQLiteDatabase db = this.getReadableDatabase();
String[] projection = {COLUMNA_ID, COLUMNA_NOMBRE};
Cursor cursor =
db.query(TABLA_NOMBRES,
projection,
" _id = ?",
new String[] { String.valueOf(id) },
null,
null,
null,
null);
if (cursor != null)
cursor.moveToFirst();
System.out.println("El nombre es " + cursor.getString(1) );
db.close();
}
Para este método lo primero que debemos de hacer es indicarle a la clase que vamos a utiliza la base datos (como
en el método agregar), para el query de select debemos de tener una proyección (nombre con que lo maneja la
documentación) que no es más que una arreglo de todas nuestras columnas con las cuales vamos a trabajar.
El método query recibe como parámetro principalmente el nombre de la tabla a utilizar, la proyección, nuestra
condicional para el select, en este caso la columna _id y con que valor debe buscarlo, es por eso que vemos otra
arreglo de string como parámetro, los siguiente cuatro parámetros son para realizar un query más complejo.
Para almacenar el resultado de nuestra búsqueda debemos hacer mediante un objeto Cursor.
Para poder visualizar el nombre simplemente mandamos una impresión a consola mediante System, incluso si
nosotros así lo deseamos podemos regresar el valor o el cursor.
Prueba:
Bien con esto dos métodos podemos probar si nuestro ejemplo se encuentra funcionando de forma correcta, vamos
a modificar nuestro método agregar y colocaremos dos líneas de código más:
long newRowId;
newRowId = db.insert(T…
Con esto vamos a poder conocer el id de nuestro dato almacenado, lo que falta ahora es retornar ese valor,
cambiamos nuestro método para regresar el valor (int) y colocamos :
return (int) newRowId;
Bien ahora probemos nuestro ejemplo:
EjemploDB db = new EjemploDB( getApplicationContext() );
int id = db.agregar("Eddard Stark");
System.out.println(id);
db.obtener(id);
Con este sencillo código nos podemos percatar que hasta ahora nuestro ejemplo se encuentra funcionando
correctamente ( No es necesario que visualicemos los resultados en consola, podemos apoyarnos de nuestras vistas
o de un Toast).
Update:
Para editar debemos de colocar este método:
public void actualizar (String nombre, int id){
SQLiteDatabase db = this.getWritableDatabase();
ContentValues values = new ContentValues();
values.put("nombre",nombre);
int i = db.update(TABLA_NOMBRES,
values,
" _id = ?",
new String[] { String.valueOf( id ) });
db.close();
}
El método actualizar espera como parámetro el nuevo nombre y el id de la tupla a cambiar.
Y como ya se nos está haciendo costumbre lo primero que debemos hacer es obtener nuestra base de datos.
Al igual que con el método agregar debemos de almacenar nuestros valores en sus respectivas columnas mediante
un objeto ContentValues y con el método update de nuestra base de datos establecemos que tabla queremos
utilizar, los valores a cambiar (con el objeto ContentValues) y la condicional para realizar el cambio (Al igual que
en el Select)
" _id = ?" nos indica que utilizaremos el campo id como referencia para saber que filas serán actualizadas y con new String[]
{ String.valueOf( id ) }); indicamos el valor que debe tener la columna.
Probamos el ejemplo:
db.actualizar("CatellyTully", 1);
db.obtener(1);
Con esto ya no obtendremos Eddard Stark si no Catelly Tully con lo cual confirmamos que nuestro método
actualizar funciona.
Delete:
Si has estado leyendo el post completamente te podrás intuir cómo será el método de eliminar, pues es muy
sencillo y toma partes de cada método utilizado anteriormente:
public boolean eliminar(int id) {
SQLiteDatabase db = this.getWritableDatabase();
try{
db.delete(TABLA_NOMBRES,
" _id = ?",
new String[] { String.valueOf (id ) });
db.close();
return true;
}catch(Exception ex){
return false;
}
}
Aquí simplemente agregamos un Try y un Catch por buenas practicas ( También debemos agregarlo en los otro
métodos) y solo para no dejar un return true siempre
El entorno de Dreamweaver CS6
Vamos a ver cuáles son los elementos básicos de Dreamweaver CS6, la pantalla, las barras, los paneles, etc..., para saber
diferenciar entre cada uno de ellos. Aprenderemos cómo se llaman, dónde están y para qué sirven. También veremos cómo
obtener ayuda, por si en algún momento no sabemos cómo seguir trabajando. Cuando conozcamos todo esto estaremos en
disposición de empezar a crear páginas web.
2.1. La pantalla inicial
Al arrancar Dreamweaver aparece una pantalla inicial como ésta, vamos a ver sus componentes fundamentales. Así
conoceremos los nombres de los diferentes elementos y será más fácil entender el resto del curso. La pantalla que se
muestra a continuación (y en general todas las de este curso) puede no coincidir exactamente con la que ves en tu
ordenador, ya que cada usuario puede decidir qué elementos quiere que se vean en cada momento y dónde, como
veremos más adelante.
En el resto de esta unidad vamos a ir describiendo los puntos más importantes señalados en esta imagen por los números
en azul del 1 al 9.
1.- Las barras.
2.- Las pestañas de documentos.
3.- La barra de estado.
4.- El panel de propiedades.
5.- Área de paneles.
6.- Paneles y ventanas.
Instituto Técnico de Educación Múltiple
“Cnel. Ciriaco de Jesús Alas”
GUIA #1 PARA SEGUNDO AÑO DESARROLLO DE SOFTWARE
Asignatura: DISEÑO WEB
Docente: : Joaquín Bernaldo Sánchez Martínez
Contenido: ENTORNO DE TRABAJO DE ADOBE DREANWEAVER CS6
Indicador de logro: identifica y utiliza correctamente cada uno de los componentes de diseño de la plataforma adobe
Dreanweaver Cs6
7.- Línea inferior de pestañas.
8.- Vista diseño del documento.
9.- Vista código del documento.
2.2. Las barras
1.- La barra de la aplicación.
La barra la aplicación se incorporó en la versión anterior de Dreamweaver. Si tenemos la ventana maximizada veremos
todos los elementos de la barra ocupando una sola línea, si no, ocuparán dos líneas, como en la imagen superior.
Esta barra contiene los siguientes elementos: los menús (en la imagen, en la parte inferior), varios botones propios de la
aplicación, el conmutador de espacio de trabajo y una caja de búsquedas para obtener ayuda on line.
Los botones propios de la aplicación, que aparecen junto al icono, nos permiten (de derecha a izquierda) cambiar entre la
vista de diseño o código, acceder a las extensiones que se pueden añadir, o al administrador de sitios, que ya veremos.
Clásico
Más hacia la derecha observamos el conmutador del espacio de trabajo, como un desplegable. Un espacio de trabajo es la
configuración del entorno (paneles visibles y su disposición) que podemos guardar y cargar. Lo veremos más adelante.
Los menús, están agrupados en categorías.
Al hacer clic en Insertar, por ejemplo, veremos las operaciones relacionadas con los diferentes elementos que se pueden
insertar en Dreamweaver. Todas las opciones de Dreamweaver son accesibles a través de los menús, aunque en ocasiones
nos envíen a los paneles.
2.- Las pestañas de documento.
Cada archivo que tengamos abierto, mostrará una pestaña con su nombre, lo que nos permitirá cambiar de uno a otro
fácilmente. Si junto al nombre aparece un *, indica que ese archivo tiene cambios sin guardar. Podemos cerrar cada
documento clicando en el aspa de la derecha, o acceder a otras acciones haciendo clic con el botón derecho, como Cerrar
otros archivos.
Debajo de las pestañas encontramos los archivos a que utiliza nuestra página, como la hoja de estilos, archivos JavaScript,
etc... pudiendo acceder a ellos con un clic. Esto nos ahorrará bastante tiempo.
3.- La barra de estado.
Esta barra la encontramos debajo de la ventana de documento, y nos da información sobre el mismo.
A la izquierda, encontramos el selector de etiquetas. Nos sirve para seleccionar etiquetas completas. Siguiendo hacia la
derecha tenemos las herramientas de Selección, Mano (para desplazarse) y Zoom. Más a la derecha encontramos tres
iconos para ver la página en tres tamaños de pantalla: móvil, tableta y PC escritorio.Y al final hay otros datos como el
tamaño de la ventana, el tamaño de la página o su codificación.
Hasta aquí las barras que siempre veremos en la aplicación. A parte, existen otras que podemos ver u ocultar desde el menú
Ver → Barras de herramientas.
Ver → Barras de herramientas
La barra de herramientas estándar.
La barra de herramientas estándar contiene iconos para realizar las acciones más habituales del menú Archivo y Edición. De
izquierda a derecha: Nuevo archivo, Abrir, explorar con Adobe Bridge, Guardar, Guardar todo, Imprimir el código fuente,
Cortar, Copiar, Pegar, Deshacer y Rehacer. Esta barra puede ser muy útil, pero en realidad casi todo el mundo usa esos
comandos directamente con el teclado (Ctrl + G para guardar, Ctrl + C para copiar, etc.)
La barra de herramientas de documento.
La contiene iconos que nos permiten cambiar entre las distintas vistas de edición y la vista en vivo, vistas previa en
multipantalla, acceder cómodamente al título de la página, o realizar las distintas opciones de validación que nos ofrece el
programa.
La barra de representación de estilos.
Esta barra, menos utilizada, nos permite ver la apariencia de nuestra web en distintos dispositivos, si estamos utilizando
hojas distintas que dependan del eso. Hay varias opciones, como las de ver los estilos que dependen de pseudo clases
activas, como cuando el cursor está sobre un elemento.
La barra de navegación con navegador.
Esta barra nos permite usar Dreamweaver como un navegador web y navegar por las páginas de nuestro sitio, aunque sólo
tiene sentido con la Vista en vivo, como ya veremos.
Como también veremos al personalizar el entorno, algunos paneles, como Insertar nos permiten colocarlo como otra barra
de herramientas.
2.3. Inspectores y paneles
Dreamweaver utiliza ventanas flotantes similares a las barras de herramientas, que se conocen como paneles (ventanas) o
inspectores. La diferencia entre panel e inspector es que, en general, la apariencia y opciones de un inspector cambian
dependiendo del objeto seleccionado, mientras que el panel nos da acceso a opciones generales fijas.
A través de la opción Ventana, de la barra de menús, es posible mostrar u ocultar cada uno de los paneles o inspectores. A
continuación vamos a ver el inspector de Propiedades y más adelante veremos el panel Insertar.
4.- El inspector de Propiedades
El inspector de Propiedades muestra las opciones propias del objeto o texto seleccionado, permitiéndonos editarlas, por lo
que se convierte en uno de los elementos más utilizados en Dreamweaver. Por ejemplo, cuando el elemento seleccionado
sea una imagen, como sucede en la imagen que puedes ver, mostrará su ubicación, dimensiones, peso, clase, etc...
En otros elementos, como párrafos y estilos, este panel puede mostrar dos tipos de propiedades, HTML y CSS, que podemos
aplicar a los diferentes elementos de la página Web que estemos diseñando.
5.- Área de paneles.
En la parte derecha de la pantalla tenemos el área o pila de paneles.
área paneles
Inicialmente, el área de paneles contiene unos determinados elementos, pero podemos quitar y poner los elementos que
queramos. Para quitar un elemento del área de paneles basta hacer clic con el botón derecho sobre su nombre para que
aparezca un menú con la opción Cerrar. Para añadir un elemento al área de paneles hay que ir al menú Ventana y hacer clic
en el elemento que queramos añadir, si el elemento se abre en una ventana flotante, bastará arrastrarlo al área de paneles.
6.- Paneles.
Una vez tenemos el áea de paneles con los elementos que más nos interesen, podemos abrirlos o desplegarlos de tres
formas.
1. Abrir el panel dentro del área de paneles. Para ello primero hay que expandir el área de paneles pulsando el botón de la
parte superior derecha botón expandir , a continuación, basta hacer clic en cada panel para que se abra dentro del área de
paneles. Para cerrar el panel hacer doble clic.
Por ejemplo, en la siguiente imagen vemos el panel Archivos abierto dentro del área de paneles. Se pueden abrir varios
paneles a la vez y ajustar sus tamaños colocando el cursor en el borde inferior y arrastrándolo.
2. Abrir el panel al lado del área de paneles. Para ello hay que partir del área de paneles sin expandir, y al pulsar en un
panel, este se abrirá pegado al lado, como vemos en la siguiente figura.
3. Abrir como panel flotante. Para ello hay que pinchar en el título del panel y arrastar el panel fuera del área de paneles, el
panel se puede colocar en cualquier zona de la pantalla, incluso fuera de la pantalla de Dreamweaver. Al hacer doble clic en
el título del panel, este se contrae pero sigue flotando en la misma posición. Para expandirlo, volver a hacer doble clic. En al
siguiente imagen vemos el panel Archivos flotando y epandido.
Hemos visto un inspector y ahora vamos a ver un panel, el panel Insertar.
El panel Insertar.
En el panel Insertar, encontramos todos los elementos que podemos encontrar en el menú Insertar, clasificados en
categorías. Podemos emplearlo para insertar imágenes, enlaces, multimedia, tablas, formularios... cualquier elemento que
nuestra web necesite.
Como vemos en las imágenes, es posible configurar este panel para verlo como menú (imagen anterior), como panel
flotante o como una barra de herramientas integrada en la ventana de trabajo (imagen siguiente)
Personalizar el área de trabajo es bastante intuitivo, pero si necesitas ayuda, te recomendamos este avanzado
02_avanzado_01.htm.
7. Línea inferior de pestañas.
En al parte inferior de la pantalla tenemos una línea que contiene varias pestañas (Buscar, Validación , ... )
Para abrir una pestaña basta hacer clic sobre ella, para cerrarla hacer doble clic en su título.
Estas pestañas se pueden configurar de forma similar a como acabamos de ver con el área de paneles. Es decir, se pueden
añadir y quitar, convertir en flotantes, etc.
2.4. Vistas de un documento
Ver el videotutorial
Podemos editar el documento con distintas vistas, que puedes cambiar través de la barra de documento:
8.- La vista Diseño
La vista Diseño permite trabajar con el editor visual.
Nos ofrece un aspecto muy similar al resultado final, pero totalmente editable.
9.- La vista Código
La vista Código se utiliza para poder trabajar en un entorno totalmente de programación, de código fuente. No permite
tener directamente una referencia visual de cómo va quedando el documento según se va modificando el código.
El código que vemos es el que genera Dreamweaver al editar el contenido en la vista Diseño.
- La vista Dividir
La vista Dividir permite dividir la ventana en dos zonas: Código y Diseño. La zona izquierda muestra el código fuente, y la
derecha el editor visual. Cuando se realiza un cambio en alguna de las zonas, este cambio se aplica directamente sobre la
otra.
- La Vista en vivo
La vista en Vivo es una mejora reciente de Dreamweaver. Nos ofrece una vista del resultado final no editable. A diferencia
de la vista Diseño, que nos permite editar los elementos, esta vista nos permite interactuar con ellos, tal como lo haríamos
con el navegador.
La función de esta vista es la de ahorrarnos tiempo, al no tener que comprobar que pequeños cambios se previsualizan
correctamente en el navegador.
No obstante, siempre hay que comprobar la página con los principales navegadores del mercado que serán los que
emplearán nuestros visitantes. De hecho, a lo largo del curso verás cómo algunos elementos se ven de forma muy distinta si
los vemos en la vista de diseño, en la vista en vivo o en el navegador. También es conveniente comprobar la página con los
distintos tamaños de pantalla, teléfono móvil, tablet y PC.
- La vista Código en vivo Código en vivo
Esta vista se emplea conjuntamente con la Vista en vivo. Divide la pantalla como la vista Dividir, pero sin que podamos
editar el código. Lo que hace es que al seleccionar partes de la web en la Vista en vivo, se seleccione su correspondiente
código fuente y refleja los cambios dinámicamente al interactuar con la página. Si además pulsamos el
botón podremos ver los estilos asociados a cada elemento. Por ejemplo, al colocar el cursor sobre un párrafo
podemos ver sus márgenes, como se aprecia en la siguiente imagen.
2.5. La ayuda
A través del menú Ayuda puedes ir a varias opciones, veamos algunas
de ellas:
Si seleccionas la opción Ayuda de Dreamweaver o simplemente pulsando F1 se accede a la ayuda en línea de Adobe
Community Help donde puedes buscar por temas o por búsqueda de palabras clave, .
Ayuda de Business Catalyst que es un sistema de alojamiento de páginas web con funciones adicionales. Es de Adobe y hay
diferentes opciones de pago al mes.
Ayuda de Spry Framework. Veremos Spry Framework a partir de la unidad 14.
Referencia abre un panel en el que encontrarás la sintaxis y descripción de las etiquetas HTML.
Acceder al Centro de soporte de Dreamweaver en la web.
Dreamweaver Exchange es un sistema para compartir extensiones.
Acceder al Foros en línea de Adobe.
Además, en la barra de aplicación encontramos una caja de
búsqueda. Al introducir los términos de la búsqueda y buscar,
iremos a la ayuda online de Adobe.
En este tema vamos a ver qué es un sitio web, cómo crearlos y gestionarlos, y cómo modificar las propiedades de los
documentos, como puede ser el color de fondo.
Introducción a Android Studio
Android Studio es el entorno de desarrollo integrado (IDE) oficial para el desarrollo de apps para Android, basado en IntelliJ IDEA. Además del potente editor de códigos y las herramientas para desarrolladores de IntelliJ, Android Studio ofrece incluso más funciones que aumentan tu productividad cuando desarrollas apps para Android, como las siguientes:
Un sistema de compilación flexible basado en Gradle
Un emulador rápido y cargado de funciones
Un entorno unificado donde puedes desarrollar para todos los dispositivos Android
Aplicación de cambios para insertar cambios de códigos y recursos a la aplicación en ejecución sin reiniciar la aplicación
Integración con GitHub y plantillas de código para ayudarte a compilar funciones de apps comunes y también importar código de ejemplo
Variedad de marcos de trabajo y herramientas de prueba
Herramientas de Lint para identificar problemas de rendimiento, usabilidad y compatibilidad de la versión, entre otros
Compatibilidad con C++ y NDK
Compatibilidad integrada para Google Cloud Platform, que facilita la integración con Google Cloud Messaging y App Engine
En esta página, encontrarás una introducción a las funciones básicas de Android Studio. Para acceder a un resumen de los cambios más recientes, consulta las notas de la versión de Android Studio.
Estructura del proyecto
Figura 1: Los archivos de proyecto en la vista de Android
Instituto Técnico de Educación Múltiple
“Cnel. Ciriaco de Jesús Alas”
GUIA #1 PARA SEGUNDO AÑO DESARROLLO DE SOFTWARE
Asignatura: PROGRAMACION II
Docente: : Joaquín Bernaldo Sánchez Martínez
Contenido: ENTORNO DE TRABAJO DE ANDROID STUDIO
Indicador de logro: identifica y utiliza correctamente cada uno de los componentes de diseño de la plataforma android
estudio
Cada proyecto de Android Studio incluye uno o más módulos con archivos de código fuente y archivos de recursos. Entre los tipos de módulos se incluyen los siguientes:
Módulos de apps para Android
Módulos de biblioteca
Módulos de Google App Engine
De manera predeterminada, Android Studio muestra los archivos de tu proyecto en la vista de proyecto de Android, como se ve en la Figura 1. Esta vista está organizada en módulos para que puedas acceder rápidamente a los archivos fuente clave de tu proyecto.
Puedes ver todos los archivos de compilación en el nivel superior de Secuencias de comando de Gradle y cada módulo de app contiene las siguientes carpetas:
manifests: Contiene el archivo AndroidManifest.xml.
java: Contiene los archivos de código fuente Java, incluido el código de prueba de JUnit.
res: Contiene todos los recursos sin código, como diseños XML, strings de IU e imágenes de mapa de bits.
La estructura del proyecto de Android en el disco difiere de esta representación plana. Para ver la estructura de archivos real del proyecto, selecciona Project en el menú desplegable Project (en la figura 1, se muestra como Android).
También puedes personalizar la vista de los archivos del proyecto para concentrarte en aspectos específicos del desarrollo de tu app. Por ejemplo, si seleccionas la vista Problems de tu proyecto, se mostrarán vínculos a los archivos fuente que contengan errores conocidos de codificación y sintaxis, como una etiqueta de cierre que falte para un elemento XML en un archivo de diseño.
Figura 2: Archivos del proyecto en la vista "Problems", en la que se muestra un archivo de diseño con un problema
Para obtener más información, consulta Descripción general de proyectos.
Interfaz de usuario
La ventana principal de Android Studio consta de varias áreas lógicas identificadas en la Figura 3.
Figura 3: Ventana principal de Android Studio
La barra de herramientas te permite realizar una gran variedad de acciones, como ejecutar tu app e iniciar las herramientas de Android.
La barra de navegación te ayuda a explorar tu proyecto y abrir archivos para editar. Proporciona una vista más compacta de la estructura visible en la ventana Project.
La ventana del editor es el área en la que puedes crear y modificar código. Según el tipo de actividad actual, el editor puede cambiar. Por ejemplo, cuando ves un archivo de diseño, el editor muestra el Editor de diseño.
La barra de la ventana de herramientas se encuentra afuera de la ventana del IDE y contiene los botones que te permiten expandir o contraer ventanas de herramientas individuales.
Las ventanas de herramientas te brindan acceso a tareas específicas, como la administración de proyectos, la búsqueda, el control de versiones, entre otras. Puedes expandirlas y contraerlas.
En la barra de estado, se muestra el estado de tu proyecto y el IDE, además de advertencias o mensajes.
Puedes organizar la ventana principal para tener más espacio en pantalla si ocultas o desplazas las barras y ventanas de herramientas. También puedes usar combinaciones de teclas para acceder a la mayoría de las funciones del IDE.
En cualquier momento, puedes realizar búsquedas en el código fuente, las bases de datos, las acciones y los elementos de la interfaz de usuario, entre otros. Para ello, presiona dos veces la tecla Mayús o haz clic en la lupa en la esquina superior derecha de la ventana de Android Studio. Esto puede ser muy útil, por ejemplo, si intentas localizar una acción específica del IDE que olvidaste cómo activar.
Ventanas de herramientas
En lugar de usar perspectivas preestablecidas, Android Studio sigue tu contexto y te ofrece automáticamente ventanas de herramientas relevantes mientras trabajas. En la configuración predeterminada, las ventanas de herramientas más usadas se fijan a la barra de la ventana de herramientas en los bordes de la ventana de la app.
Para expandir o contraer una ventana de herramientas, haz clic en el nombre de la herramienta, en la barra de la ventana de herramientas. También puedes arrastrar, fijar, no fijar, adjuntar y ocultar ventanas de herramientas.
Para volver al diseño predeterminado actual de la ventana de herramientas, haz clic en Window > Restore Default Layout o personaliza tu diseño predeterminado haciendo clic en Window > Store Current Layout as Default.
Para ocultar o mostrar la barra de la ventana de herramientas completa, haz clic en el ícono de
ventana en la esquina inferior izquierda de la ventana de Android Studio.
Para ubicar una ventana de herramientas específica, desplázate sobre su ícono y selecciónala en el menú.
También puedes usar combinaciones de teclas para abrir ventanas de herramientas. En la Tabla 1, se muestran las combinaciones de teclas para las ventanas más comunes.
Tabla 1: Combinaciones de teclas para algunas ventanas de herramientas útiles
Ventana de herramientas Windows y Linux Mac
Proyecto Alt + 1 Comando + 1
Control de versiones Alt + 9 Comando +9
Ejecutar Mayús + F10 Control + R
Depurar Mayús + F9 Control + D
Logcat Alt + 6 Comando + 6
Volver al editor Esc Esc
Ocultar todas las ventanas de herramientas Control + Mayús + F12 Comando + Mayús + F12
Si quieres ocultar todas las barras de herramientas, ventanas de herramientas y pestañas del editor, haz clic en View > Enter Distraction Free Mode. De esta manera, se habilita el modo Distraction Free Mode. Para salir del modo "Distraction Free Mode", haz clic en View > Exit Distraction Free Mode.
Puedes usar la Búsqueda rápida para buscar y filtrar en la mayoría de las ventanas de herramientas en Android Studio. Para usar la "Búsqueda rápida", selecciona la ventana de herramientas y, luego, escribe tu búsqueda.
Para obtener más sugerencias, consulta Combinaciones de teclas.
Cómo completar el código
Android Studio ofrece tres opciones para completar el código, a las que puedes acceder con combinaciones de teclas.
Tabla 2. Combinaciones de teclas para completar código
Tipo Descripción Windows y Linux
Mac
Completar de manera básica
Muestra sugerencias básicas para variables, tipos, métodos y expresiones, entre otras. Si completas de manera básica dos veces seguidas, verás más resultados. Entre otros, miembros privados y miembros estáticos sin importar.
Control + Barra espaciadora
Control + Barra espaciadora
Completar de manera inteligente
Muestra opciones relevantes en función del contexto. La función "Completar de manera inteligente" reconoce el tipo y los flujos de datos previstos. Si completas de manera inteligente dos veces seguidas, verás más resultados. Por ejemplo, cadenas.
Control + Mayús + Barra espaciadora
Control + Mayús + Barra espaciadora
Completar enunciados
Completa la instrucción actual agregando elementos que faltan, como paréntesis, corchetes, llaves y formato, entre otros.
Control + Mayús + Intro
Mayús + Comando + Intro
También puedes realizar correcciones rápidas para mostrar acciones de intención si presionas Alt + Intro.
