Este curso te permitirá construir tu primer aplicación móvil profesional. Serás capaz de crear y controlar la vida de tus Activities y aprovechar el espacio en pantalla de los diferentes dispositivos Android implementando Fragments en tus aplicaciones. Dale persistencia a tu información utilizando todas las formas de almacenamiento que hay en Android desde un único archivo hasta una Base de Datos. Podrás evaluar lo aprendido por medio de ejercicios prácticos que te permitirán ir desarrollando tu aplicación.
Ejemplo: Menú Popup
Loading...
来自 Universidad Nacional Autónoma de México 的课程
Desarrollo de aplicaciones con Android
206 个评分
从本节课中
Menús
En este módulo implementarás en tus proyectos los diferentes tipos de menús que existen en Android.
与讲师见面
Anahi SalgadoAnahi Salgado. Android Certified Application Developer, programadora, capacitadora y conferencista.
Universidad Nacional Autónoma de México
[MÚSICA]
[MÚSICA] Ahora,
veamos cómo manejar un menú popup.
Si recuerdas, un menú popup es aquél que se levanta,
o es aquél que se activa al presionar también un view.
Pero, en este caso no tendremos que esperar,
o no tendremos que dejar presionado nuestro,
sobre nuestro elemento para que aparezca, sino que simplemente dándole un touch,
o dándole un tap a ese elemento inmediatamente se va a desplegar el menú.
¿Okey?
Entonces, para hacer esto, voy a crear por aquí, yo el tipo de view para estar
manejando otros tipos de elementos sobre menús, voy a manejar una imagen, ¿okey?
Una imagen que previamente pues yo you tengo importada en mi archivo drawable,
y es esta imagen, este sol que es tomado de internet, de la página de Google.
Y, bueno.
Entonces, vamos a hacer que esa imagen, pues precisamente cuando le demos
tap, cuando tapemos esa imagen, pues, se levante un menú.
Podremos decir que el menú que queremos que se levante sea un menú de,
sea un menú, podría decir, visualizar la imagen
o también, podríamos decir ver detalles de la imagen, ¿okey?
Dos opciones en el menú.
Bien, aquí también puedo crear un nuevo menú.
Ahora, para fines de nuestro ejemplo,
yo estoy creando un menú para cada concepto que estamos viendo.
Pero realmente, si así lo quieres,
todos tus menús podrían vivir en un solo archivo.
Aunque yo te recomiendo que hagas esto, lo hagas de esta forma,
para que puedas tener, sobre todo por, por mejor práctica,
por una buena práctica en tu proyecto, que lo tengas mejor estructurado.
Vamos a poner el menu_popup, menu_popup.
Le damos Finish,
y ahora vamos a empezar a añadir nuestro menú popup.
Bien, voy a poner nuestro item de la misma forma como hemos
estado manejando nuestros items, voy a darle aquí un enter, y también aquí,
a cada elemento le vamos a poner su respectivo Id,
y también su respectivo título android, recuerda primeramente el Id,
el Id, le puedo poner menú, dijimos que uno será view
y ahorita me voy por los títulos, android:id.
Podemos poner ViewDetail,
ViewDetail, ver los detalles de esa imagen.
Y ahora en mi archivo strings pues vamos a colocar los textos que va
a decir este menú.
Recuerda que es una muy buena práctica tener los textos
en nuestro archivo strings, puesto que
cuando querramos manejar el soporte para múltiples idiomas pues será sumamente
sencillo estar manejando, estar manejando todos,
sí, todos nuestros archivos concentrados en un solo archivo, ¿okey?
Entonces View Image, Image Detail, ¿okey?
Detail.
Bien, tengo aquí you mi menú, vamos a nuestro menú popup,
vamos a colocar android:title y aquí tengo menu View,
y el siguiente android:title menu_viewDetail, you está.
Bien, con estos dos es suficiente, you tengo listo mi menú.
Entonces, vamos a meter la imagen, ¿okey?
Vamos a colocar la imagen en nuestro layout.
Vamos a ponernos debajo de este TextView, y estoy en la vista del
texto de mi activity_main.
Lo que voy a insertar aquí no es un TextView sino es un ImageView,
un ImageView.
Vamos a decirle wrap_content y wrap_content,
vamos a ponerle android:id y será
imgImagen, Imagen.
Vamos a ponerle android:src,
colocamos drawable y esa es nuestra imagen.
Vamos a ver cómo está viéndose esto, you aquí se alcanza a percibir.
Vamos a darle una posición a esto.
Vamos a decir que esté centrado, vertical, y también que esté centrado horizontal.
Veamos en el preview, aquí está, you se ve nuestra imagen.
La idea es que, al pulsar la imagen,
se despliegue un menú de ella, se ve perfecto.
Okey, entonces para hacer esto, para hacer este menú popup,
lo que tenemos que hacer es disparar un evento
o disparar un método que reaccione cuando alguien le dé clic a esta imagen.
Entonces, al igual que en los botones,
todos los views también tienen disponible esta propiedad android:onClick, ¿okey?
Android:onClick.
Entonces lo que haremos será crear un método
que dentro de ese método tendrá toda la lógica para levantar un popup,
y ese método creado lo vamos a asociar a este atributo onClick.
¿Okey?
Entonces, voy a ir al archivo de Java que controla este layout, MainActivity.
Me voy a ir hasta abajo en donde vamos, ¿okey?
No te confundas con las llavecitas, estoy en una antes de la última,
por eso, te recomiendo que pues te vayas colocando al final.
Entonces, voy a ponerle public void y le voy a poner menuPopUp.
Vamos a ponerle levantar MenuPopUp.
Y entonces este va a recibir un view así,
y aquí adentro vamos a tener toda la lógica para nuestro popup.
Para empezar, nuestro popup proviene de una clase,
una clase PopUpMenu, y entonces debemos crear por aquí nuestro objeto.
Vamos a ponerle igual a new PopUpMenu.
Vamos a poner el contexto.
Nos pide el contexto de la actividad en donde será mostrado
y posteriormente el view.
¿Okey?
Vamos a colocar nuestro view.
Aquí vamos a revisar ahorita si con este view es suficiente para levantar el menú,
si no tendremos que declarar nuestro elemento ImageView
y pasarlo como parámetro.
Entonces, voy a colocar aquí popupMenu .getMenuInflater.Inflate,
y como seguramente you debes saber pues lo que estoy haciendo es inflar el menú,
a través del view que estamos seleccionando, ¿okey?
A través del view que estamos levantando.
Voy a poner R.menu.
menu_popup, coma,
le diré con mi objeto popup menu.getMenu ¿okey?
Y entonces pues este menú you con estas líneas es suficiente,
you debería mostrarse nuestro menú.
Vamos a verlo.
Y ahora nos faltará, posteriormente,
aquí nos falta este método,
llevarlo al ImageView, ¿okey?
Eso es muy importante.
Debemos llevar el método a nuestro ImageView,
y aquí nuestro proyecto you se estaba preparando para correr.
Lo vamos a correr de nuevo, si no, no va a suceder nada.
[AUDIO EN
BLANCO] Y antes de cualquier cosa, pues
vamos a ver, you está corriendo, vamos a ver qué pasa si tecleamos nuestro menú.
Ahorita no está respondiendo.
Entonces, vamos a colocar nuestro ImageView por aquí.
ImageView imagen.
Y vamos a ponerle aquí su casteo ImageView, vamos
a poner findViewById R.id.ImageView Imagen, ¿okey?
Podemos pasar aquí el objeto imagen.
Lo corremos de nuevo.
[AUDIO EN BLANCO]
[AUDIO EN BLANCO] Esperamos, you está a punto de correr y ahí está.
[AUDIO EN BLANCO]
[AUDIO EN
BLANCO] [AUDIO
EN BLANCO] Okey, aquí algo que nos
está pasando es que debemos poner por supuesto mostrar nuestro menú.
[AUDIO EN BLANCO] Sí,
si no lo mostramos, no se mostrará,
si no utilizamos el método show, no se mostrará nuestro menú.
[AUDIO EN BLANCO] Ahora sí,
ahí está nuestro menú, View Image, View Image Detail, ¿okey?
Si observas, simplemente al darle un clic se muestra el menú, ¿okey?
Acá está nuestro menú de contexto presionando una larga duración
y acá está nuestro menú de opciones.
Ahora solamente nos falta que, pues sobre este View,
View Image o View Image Detail, sobre este View,
pues podamos cachar cuando alguien le de clic a cualquiera de estos elementos.
Es muy sencillo, el objeto popupMenu tiene un método
setOnMenuItemClickListener, ¿okey?
Tiene un método listener que siempre está alerta y está escuchando cuando tú le des
touch o cuando le des tap a alguno de estos elementos.
Entonces lo que haré es utilizar este
y vamos a crear una interfaz new OnMenuItemClickListener,
y como observas tengo aquí MenuItemClick y, ¿adivina qué?
También estoy recibiendo un MenuItem y por supuesto puedo estar utilizando
igual un switch para estarle preguntando al item
cuál es el Id que estás recibiendo, ¿okey?
Puedo poner mi primer caso R.id
.view, ¿okey?
Break.
Y el segundo R.Id.mViewDetail y colocar break también.
Y podemos devolver true, no olvides devolver true aquí.
Entonces para poder ver un poco más lo que está sucediendo,
puedo colocar de la misma forma un toast, coloco this,
nuestro texto getResources.getString,
colocar R.string.menu_view,
Toast.length_long y no olvides nuestro .show que es muy importante.
Okey, aquí me está diciendo que no estoy en un contexto de actividad,
entonces le pondré getBaseContext, listo.
Copiaré lo mismo y lo pegaré acá.
Y es verdad, no estoy en un contexto de actividad, por esto que me encuentro
dentro de una interfaz que está sobreescribiendo el método OnItemClick.
Entonces simplemente aquí vamos a poner viewDetail.
Vamos a correrlo, y esta es la última,
nuestro último menú.
[AUDIO EN BLANCO] Okey,
aquí está nuestro menú y ahí está respondiendo View Image,
puedo seleccionar el otro y ahí está View Image Detail.
Perfecto.
Estos son nuestros 3 tipos de menú que tenemos.
Un menú de opciones que lo encontrarás en nuestro app bar, un menú de contexto
que será activado cuando dejes presionado un View por largo tiempo,
y un menú popup que simplemente se levantará cuando des clic o cuando des tap
a un View en particular.
[MÚSICA] [MÚSICA]
