Cursos de orientación profesional

ACCIONES COFINANCIADAS CON FONDOS COMUNITARIOS DEL FONDO SOCIAL EUROPEO,

A TRAVÉS DEL PROGRAMA OPERATIVO FONDO SOCIAL EUROPEO DE CANARIAS 20072013
CON UN PORCENTAJE DE CONFINANCIACIÓN DEL 85%.
 Día 1
 ¿Qué es Android?
 Actividades e intenciones
 Día 2
 Layouts y controles gráficos
 Recursos, menús y diálogos
 Día 3
 Persistencia de datos y content providers
 Gráficos y animaciones 2D y 3D
 Día 4
 Servicios en segundo plano
 Control del hardware especial
 Día 5
 App Widgets y Live folders
 Publicación de aplicaciones
Creación de aplicaciones móviles en Android

Rayco Araña
rayco.arana@gmail.com
Instituto SIANI
 Gráficos 2D
 Animación 2D
 Gráficos 3D
 Gráficos 2D
 Animación 2D
 Gráficos 3D
 View
 Sobrescribir método onDraw()
 API Gráfica `Clásica´
▪ Canvas
▪ Tiene las operaciones de pintado
▪ Paint
▪ Es el «pincel» con el que pintamos
▪ Bitmap
▪ Es el lugar donde pintamos (encapsulado por el Canvas)
 Proceso de pintar en el hilo del UI
 SurfaceView
 Actualizado por un segundo hilo
 Ideal para operaciones pesadas de pintado
 No bloquea la aplicación
▪ ¡Adios al dialogo «La actividad no responde»!
▪ Ideal para previsualizar la cámara, 3D, etc.
 Mayor uso de memoria
▪ No todo son ventajas 
 Drawable
▪ android.graphics.drawable.*
 Cualquier cosa que se pueda pintar en
pantalla
 No tiene eventos como las vistas
 Drawable
 Simples:
▪ Bitmap.
▪ Nine Patch. PNG especial con marcas para su
redimensión.
▪ Shape. Vectorial, al modificar tamaño mantiene calidad.
 Compuestos:
▪ Layers. Muestra unos sobre otros.
▪ States. Muestra uno basado en su estado (pulsado, …).
▪ Levels. Muestra uno basado en su nivel (ej. batería).
 Drawable
 Ej. Shape
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="ring"
android:innerRadiusRatio="3"
android:thicknessRatio="8"
android:useLevel="false">
<gradient android:type="sweep"
android:useLevel="false"
android:startColor="#4c737373"
android:centerColor="#4c737373"
android:centerY="0.50"
android:endColor="#ffffd300" />
</shape>
 Gráficos 2D
 Animación 2D
 Gráficos 3D
 Modificar el contenido de una vista en el
tiempo
 Si sobrepasa los limites de la vista, se recorta
 Dos tipos
 Frame by Frame
 Interpolado
 Frame by Frame
 Se basa en mostrar diferentes elementos
Drawable
 Cada frame define su duración
 Frame by Frame
 Definición XML
<animation-list android:id="selected" android:oneshot="false">
<item android:drawable="@drawable/wheel0" android:duration="50" />
<item android:drawable="@drawable/wheel1" android:duration="50" />
<item android:drawable="@drawable/wheel2" android:duration="50" />
<item android:drawable="@drawable/wheel3" android:duration="50" />
<item android:drawable="@drawable/wheel4" android:duration="50" />
<item android:drawable="@drawable/wheel5" android:duration="50" />
</animation-list>
 Frame by Frame
 Asignación y comienzo por código
ImageView img = (ImageView)findViewById(R.id.spinning_wheel_image);
img.setBackgroundResource(R.drawable.spin_animation);

AnimationDrawable animation = (AnimationDrawable) img.getBackground();

animation.start()
 Interpolado
 Útil para transiciones y feedback al usuario
▪ Transición entre actividades, layouts, contenidos,…
▪ `Agitar´ un campo erróneo
 Se definen estados inicial y final
▪ El sistema interpola la modificación gradual
conforme al tiempo
 Simple de usar y más eficiente que pintar `a
mano´
 Interpolado
 Transformaciones
▪ Opacidad  AlphaAnimation
▪ Rotación  RotateAnimation
▪ Escalado  ScaleAnimation
▪ Traslación  TranslateAnimation
 AnimationSet
▪ Permite combinar transformaciones
 Interpolado
<?xml version=”1.0” encoding=”utf-8”?>
<set xmlns:android=”http://schemas.android.com/apk/res/android”
android:shareInterpolator=”true”>
<rotate
android:fromDegrees=”0”
android:toDegrees=”360”
android:pivotX=”50%”
android:pivotY=”50%”
android:startOffset=”0”
android:duration=”1000” />
<alpha
android:fromAlpha=”1.0”
android:toAlpha=”0.0”
android:startOffset=”500”
android:duration=”500” />
</set>
 Interpolado
Animation exampleAnim = AnimationUtils.loadAnimation(this,
R.anim
.example_anim);
exampleAnim.setRepeatMode(Animation.RESTART);
exampleAnim.setRepeatCount(Animation.INFINITE);
myView.startAnimation(exampleAnim);
 Interpolado
 Diferentes interpoladores
▪ AccelerateDecelerateInterpolator
▪ AccelerateInterpolator
▪ AnticipateInterpolator
▪ AnticipateOvershootInterpolator
▪ BounceInterpolator
▪ CycleInterpolator
▪ DecelerateInterpolator
▪ LinearInterpolator
▪ OvershootInterpolator
 Interpolado
 LayoutAnimation
▪ Permite animar layouts y view groups
▪ Tiene lugar cuando se hace el layout
▪ LayoutAnimationController
▪ Aplica una animación a cada vista hija
▪ Interpolador, dirección y el delay de comienzo config.
▪ Se puede personalizar  getDelayForView()
▪ GridLayoutAnimationController
▪ Adicionalmente permite indicar la secuencia usando como
referencia fila/columna
 Interpolado
 ¿Cuándo empieza o termina una animación?
▪ AnimationListener
▪ onAnimationStart
▪ onAnimationEnd
▪ onAnimationRestart
 Gráficos 2D
 Animación 2D
 Gráficos 3D
Showroom

Speed Forge 3D
• Desarrollado por un
desarrollador
independiente
• Control con acelerómetro
• Pionero en gráficos 3D
• Usado para demostrar
capacidad gráfica
 Gráficos 3D == OpenGL ES
 Soportada versión 1.0
▪ Corresponde a 1.3 de la versión de escritorio
 Soporte básico de 1.1, no completo
 GLSurfaceView
 Vista sobre la que pinta OpenGL
 Deriva de SurfaceView
 Dos modo de pintado
▪ Continuo
▪ Bajo demanda
 Necesita ser notificado del ciclo de vida de la
actividad (onPause y onResume)
▪ Necesario para parar o resumir el hilo gestionado
 GLSurfaceView
 Comunicación entre threads
▪ Uso de queueEvent
▪ Necesitaremos comunicar UI Thread con Renderer
Thread
▪ Toda entrada del usuario la recibiremos en el UI Thread
 setRenderer()
▪ Solo se debe llamar una vez por GLSurfaceView
▪ Dispara el hilo de renderización
 GLSurfaceView.Renderer
 A partir de 1.5
 Permite de forma sencilla realizar
operaciones de pintado y gestión de la
superficie
 Tres métodos
▪ onSurfaceChanged
▪ onSurfaceCreated
▪ onDrawFrame
 GLSurfaceView.Renderer
 onSurfaceCreated
▪ Configuración
 onSurfaceChanged
▪ Viewport
▪ Matriz de proyección
▪ Frustum
 onDrawFrame
▪ Limpiar
▪ Pintar
Creación de aplicaciones móviles en Android

Animando un indicador de progreso

Animando un triángulo en 3D
 Gráficos 2D y Animaciones
 Android Developer Reference
▪ http://developer.android.com/guide/topics/graphics/2d-graphics.html

 Android Application Development

▪ Reto Meier, Editorial Wrox

 OpenGL
 Khronos Group’s OpenGL ES Overview
▪ http://www.khronos.org/opengles/

 OpenGL Programming Guide (the «red book»)

▪ http://www.glprogramming.com/red/