Android Bolivia - Comunidad La Paz 12/04/2013

Comunidad Android Bolivia

Desarrollo de Aplicaciones Android

Grficos y animaciones
Sesin 6

Gustavo Lizrraga
http://about.me/lizgux

Contenido
Grficos Animaciones
Grficos 2D Tipos
Canvas Uso de cada animacin
Paint Implementacin en Java y
XML

Desarrollo de Aplicaciones Android 1

Android Bolivia - Comunidad La Paz 12/04/2013

Grficos

API para grficos

Android proporciona una API para cubrir alguna
necesidad grfica entre las que podemos
mencionar:

Manipulacin de imgenes
Grficos vectoriales
Animaciones
Trabajo con texto
Grficos en 3D

Desarrollo de Aplicaciones Android 2

Android Bolivia - Comunidad La Paz 12/04/2013

Grficos 2D
Clase Canvas Clase Paint

Superficie
donde
realizaremos Pincel con el
los grficos cul
pintaremos
los grficos

Canvas y Paint
Algunos grficos que se pueden hacer con la clases
Canvas y Paint son:
Figuras geomtricas:
drawCircle
drawOval
drawRect
drawPoint
drawPoints
Dibujar lneas y arcos:
drawLine
drawLines
drawArc
drawPath

Desarrollo de Aplicaciones Android 3

Android Bolivia - Comunidad La Paz 12/04/2013

Canvas y Paint

Dibujar Texto:
drawText
drawTextOnPath
drawPosText
Dibujar imgenes:
drawBitmap

Implementacin
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(new MiCanvas(this));
}

public class MiCanvas extends View {

public MiCanvas(Context context) {
super(context);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
Paint pincel = new Paint();
pincel.setColor(Color.RED);
pincel.setStrokeWidth(8);
canvas.drawCircle(100, 100, 70, pincel);

Desarrollo de Aplicaciones Android 4

Android Bolivia - Comunidad La Paz 12/04/2013

Graficar figuras
geomtricas
Ejercicio 3
Graficar el Android que
se ve en la figura.

Animaciones

Desarrollo de Aplicaciones Android 5

Android Bolivia - Comunidad La Paz 12/04/2013

Tipos de Animaciones
GIF animados
Imgenes que contienen mltiples cuadros
Animacin cuadro por cuadro
Muestra imgenes de acuerdo a una transicin
Animacin por interpolacin de movimiento
Son mtodos como ser: Alpha, Rotate, Scale y
Translation
OpenGL ES
API avanzado para animacin tridimensionales,
iluminacin y texturas

Animaciones

anim

XML XML XML XML

File File File . . . File

animacion1.xml animacion2.xml animacion3.xml animacionN.xml

Desarrollo de Aplicaciones Android 6

Android Bolivia - Comunidad La Paz 12/04/2013

Interpolacin de movimiento
Rotate (Rotacin)
<rotate
android:fromDegrees="0"
android:toDegrees="360"
android:pivotX="50%"
android:pivotY="50%"
android:duration="2500"/>

Alpha (Transparencia)
<alpha
android:fromAlpha="0.0"
android:toAlpha="1.0"
android:duration="3500"/>

Interpolacin de movimiento
Scale (Escalacin)
<scale
android:fromXScale="0.1"
android:fromYScale="0.1"
android:pivotX="50%"
android:pivotY="50%"
android:toXScale="1.0"
android:toYScale="1.0"
android:duration="2000"/>
Translate (Traslacin)
<translate
android:fromXDelta="0.0"
android:toAlpha="360"
android:duration="3500"/>

Desarrollo de Aplicaciones Android 7

Android Bolivia - Comunidad La Paz 12/04/2013

Usos de Animaciones
Las animaciones realizadas con XML no tiene un
uso para juegos, ya que tardara mucho y la
programacin sera muy compleja, las
animaciones sirven ms para pequeas
animaciones, movimientos de imgenes, etc.

Ejemplo
Las Pantallas de Bienvenida o tambin
llamadas Splash Screen

Pantallas Splash
Las pantallas de bienvenida o tambin
denominados Splash son pantallas de inicio de
la aplicacin.

Desarrollo de Aplicaciones Android 8

Android Bolivia - Comunidad La Paz 12/04/2013

Pantallas Splash
Una Pantalla Splash debe ser la primera pantalla
que se ver en una aplicacin, generalmente
tienen alguna animacin pero si no la tiene, es
muy til para la transicin entre el Splash Screen
y la primera Activity de la aplicacin.

Pantallas Splash
Asignar animacin a un determinado control:

View vista = (View) findViewById(R.id.miVista);

Animation animacion = AnimationUtils.loadAnimation(this,

R.anim.mianimacion);

vista.startAnimation(animacion);

View: Puede ser cualquier control ej: Button, EditText, etc.

Desarrollo de Aplicaciones Android 9

Android Bolivia - Comunidad La Paz 12/04/2013

Acciones en fin de animacin

animacion.setAnimationListener(new AnimationListener() {
public void onAnimationStart(Animation animation) {
}

public void onAnimationRepeat(Animation animation) {

}

public void onAnimationEnd(Animation animation) {

startActivity(new Intent(SplashActivity.this,
MainActivity.class));
SplashActivity.this.finish();
}
);

Crear una
Pantalla Splash
Ejercicio 4.
Implementar una
Pantalla Splash de
bienvenida.

Desarrollo de Aplicaciones Android 10

Android Bolivia - Comunidad La Paz 12/04/2013

Preguntas y respuestas

Android Bolivia
Comunidad La Paz

Gustavo Lizrraga
http://about.me/lizgux

Desarrollo de Aplicaciones Android 11