ImageView

De MediaWiki
Ir a la navegación Ir a la búsqueda

Introdución

  • Un control ImageView mostra en pantalla unha imaxe calquera.


  • Permite ser escalada (android:scaleType) e tinguida (android:tint)


  • A clase ImageView herda directamente da clase View

00 Part of Android View Hierarchy.png


Caso práctico

Se non o temos creado antes, crea un paquete de nome UI como un subpaquete do teu paquete principal.
Dentro do paquete UI, crearemos un novo paquete de nome: ImagesViews.



  • Dentro do paquete ImagesViews crear unha nova 'Empty Activity' de nome: UD02_01_ImageView de tipo Launcher e sen compatibilidade.
Modifica o arquivo AndroidManifiest.xml e engade unha label á activity como xa vimos na creación do proxecto base.




  • Creamos unha aplicación que cargue por defecto unha imaxe de "OK" e un botón.
  • Cando prememos no botón ou na imaxe cambia a imaxe por outra de "NON-OK" e así continuamente.



Recursos de imaxes

  • O cartafol /res/values/drawable xa debería estar creado.
Lembrar que na vista 'Android' os cartafoles físicos están ocultos.
Se cambiamos á vista 'Project' ou 'Project Files' podemos comprobar que temos múltiples cartafoles drawable, un por cada tipo de pantalla.
Xa comentamos isto nun punto anterior da wiki.
Cando engadimos novas imaxes ao noso proxecto, deberíamos ter creada unha imaxe adaptada á resolución de cada pantalla.
Importante: Lembrar que todos os recursos teñen que ter letras en minúsculas y soamente se permiten letras, números e guión baixo.


XML do layout

  • Observar como se referencia á imaxe que vai cargar o control (liña12).
  • Os dous controles chaman ao mesmo método no caso de facer click neles.
 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical" >
 6 
 7     <ImageView
 8         android:id="@+id/img_imaxe"
 9         android:layout_width="wrap_content"
10         android:layout_height="wrap_content"
11         android:contentDescription="Imaxe"
12         android:src="@drawable/ok"
13         android:onClick="onCambiarImaxeClick"
14         android:tag="OK" />
15 
16     <Button
17         android:id="@+id/btn_cambiar_imaxe"
18         android:layout_width="wrap_content"
19         android:layout_height="wrap_content"
20         android:onClick="onCambiarImaxeClick"
21         android:text="Cambiar imaxe" />
22 
23 </LinearLayout>
  • Liña 14: Pónselle unha etiqueta á imaxe para poder controlar por código cal é a imaxe cargada.



Código Java

 1 package es.cursoandroid.cifprodolfoucha.aprendiendo.UI.ImagesViews;
 2 
 3 import android.app.Activity;
 4 import android.os.Bundle;
 5 import android.view.View;
 6 import android.widget.ImageView;
 7 
 8 import es.cursoandroid.cifprodolfoucha.aprendiendo.R;
 9 
10 public class UD02_01_ImageView extends Activity {
11 
12     public void onCambiarImaxeClick(View view) {
13         // ImageView img = (ImageView) view;
14 
15         ImageView img = (ImageView) findViewById(R.id.img_imaxe);
16 
17         if (img.getTag() == "OK") {
18             img.setTag("NO");
19             img.setImageResource(R.drawable.no);
20 
21         } else {
22             img.setTag("OK");
23             img.setImageResource(R.drawable.ok);
24         }
25     }
26 
27     @Override
28     protected void onCreate(Bundle savedInstanceState) {
29         super.onCreate(savedInstanceState);
30         setContentView(R.layout.activity_ud02_01__image_view);
31     }
32 }
  • Liña 17: comprobamos cal é o Tag da imaxe cargada.
  • Liña 18, 19: se a imaxe é ok.png entón cargamos a de no.png e cambiamos a etiqueta. O mesmo se fai nas liñas 22e 23.
  • A través da clase Java R accedemos ás imaxes.
  • Liña 13: se o método se chama so dende a imaxe e non dende o botón poderíamos facer uso do parámetro view do método e comentar a liña 15.








-- Ángel D. Fernández González e Carlos Carrión Álvarez -- (2015).