Creando una aplicación de fotografía para Android con Adobe AIR – Part 1/2

Escrito por smartadmin el . Posteado en Android, AS3, Programacion

Share on FacebookShare on LinkedInTweet about this on TwitterShare on Google+Email this to someone
En esta entrada les explicare como crear una aplicación para tomar fotografias y guardarlas en en carrete de fotos de tu celular o tableta Android. Una alternativa para desarrollar aplicaciones “nativas” es Adobe Air, que es como una maquina virtual que se encargara de hacer corre nuestra aplicación en el dispositivo. Esta aplicación la podriamos crear con Adobre Flash o Adobe Flash Builder. Aqui les mostrare como crearla con Adobe Flash CS 6  
adndroidair

Figura 1

Nuestra aplicación nos permitirá tomar fotos y enmarcarlas en un cartel tipo el viejo oeste como el de la figura 2  
foto

figura 2

  1- Creamos un proyecto nuevo de Android
Screen Shot 2014-08-24 at 9.38.10 AM

Figura 3

2- Creamos una Clase que puede llamarse por ejemplo Main asociada al proyecto, la cual contendra toda la logica de la aplicación.
Screen Shot 2014-08-24 at 9.38.36 AM

Figura 4

  3- Creamos los elementos gráficos que necesitamos  los cuales son:
  • Botón para tomar la foto
  • Botón para cambiar la cámara
  • Botón para rotar la imagen de la cámara
  • Fondo del cartel.
4- Esto elementos una vez creados los encontremos en una libreria de flash ()
Captura de pantalla 2014-08-25 a la(s) 9.14.08

Figura 5

  5- Los arrastramos a nuestra pantalla y les asignamos un nombre para poderlos referenciar desde nuestra clase principal. Esto haciendo click sobre el objeto y en el menu propiedades de este le asiganamos el nombre como se muestra en la figura 6.
Captura de pantalla 2014-08-25 a la(s) 9.16.26

Figura 6

  Los elementos creados los llame: Botón para tomar la foto: btnCapture Botón para cambiar cámara:  btnchange Botón para rotar la cámara: btnrotar Campo de texto para colocar mensajes: txtInfo Tambien cree un MovieClip  contenedor que podria ser un Spriten si lo desea llamado bg, el cual contiene todos los elementos graficos que se generaran a la hora de crear la imagen los cuales son: Imagen de fondo Campo de texto llamado txtnombre Sprite contenedor del video de la camara: vdcont Ya con todos estos elementos nos dirigimos a nuestro archivo main.as e iniciamos el llenado de nuestro codigo
Definición de variables
ActionScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
package  {
  
  import flash.display.MovieClip;
  import flash.events.Event;
  import flash.events.TimerEvent;
  import flash.utils.Timer;
  import flash.media.Video;
  import flash.media.Camera;
  import flash.display.BitmapData;
  import flash.media.Video;
  import flash.media.Camera;
  
  public class main extends MovieClip {
    var cameraRoll:CameraRoll;
    var bmp:BitmapData;
    var video : Video;    
    var webcam  : Camera;
 
    var VIDEO_WIDTH       : Number =289;        //Se coloca de 100 a 1000 para definir en ancho del video
    var VIDEO_HEIGHT      : Number = 289;       //Se coloca de  100 to 1000 para definir el alto del video
    var WEB_CAMERA_WIDTH    : Number = VIDEO_WIDTH/2; //Smaller than video runs faster
    var WEB_CAMERA_HEIGHT     : Number = VIDEO_HEIGHT/2;  //Smaller than video runs faster
    var VIDEO_FRAME_RATE    : Number = 30;        //Set 5 to 30.  Higher values = smoother video
    var DETECTION_THRESHOLD   : uint   = 80;        //Set 50 to 100. Set to detect marker more accurately.
    var DETECTION_CONFIDENCE  : Number = 0.5;       //Set 0.1 to 1. Set to detect marker more accurately.
    var MODEL_SCALE       : Number = 0.0175;      //Set 0.01 to 5. Set higher to enlarge model
    var temporizador:Timer;
    var camaraactual:String="0";
    var firsttime:Boolean=false;
 
    public function main() {
 
    
 
    }
    
  }
  
}
En el código anterior definimos constates necesarias y objetos importantes como el de video y el objeto que controla la cámara. EL objeto CameraRoll es el que nos permitira guardar la foto dentro de la memoria del dispositivo.  
Definición de funciones internas de la clase
ActionScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
package  {
  
  import flash.display.MovieClip;
  import flash.events.Event;
  import flash.events.TimerEvent;
  import flash.utils.Timer;
  import flash.media.Video;
  import flash.media.Camera;
  import flash.display.BitmapData;
  import flash.media.Video;
  import flash.media.Camera;
  import flash.events.MouseEvent;
 
  public class main extends MovieClip {
    var cameraRoll:CameraRoll;
    var bmp:BitmapData;
    var video : Video;    
    var webcam  : Camera;
 
    var VIDEO_WIDTH       : Number =289;        //Se coloca de 100 a 1000 para definir en ancho del video
    var VIDEO_HEIGHT      : Number = 289;       //Se coloca de  100 to 1000 para definir el alto del video
    var WEB_CAMERA_WIDTH    : Number = VIDEO_WIDTH/2; //Smaller than video runs faster
    var WEB_CAMERA_HEIGHT     : Number = VIDEO_HEIGHT/2;  //Smaller than video runs faster
    var VIDEO_FRAME_RATE    : Number = 30;        //Set 5 to 30.  Higher values = smoother video
    var DETECTION_THRESHOLD   : uint   = 80;        //Set 50 to 100. Set to detect marker more accurately.
    var DETECTION_CONFIDENCE  : Number = 0.5;       //Set 0.1 to 1. Set to detect marker more accurately.
    var MODEL_SCALE       : Number = 0.0175;      //Set 0.01 to 5. Set higher to enlarge model
    var temporizador:Timer;
    var camaraactual:String="0";
    var firsttime:Boolean=false;
 
    public function main() {
      //Constructor
      this.btnCapture.addEventListener(MouseEvent.CLICK,saveToCameraRoll);
      stage.addEventListener(KeyboardEvent.KEY_DOWN, onKey);
      btnrotar.addEventListener(MouseEvent.CLICK,rotarcamara);
      bg.txtnombre.addEventListener(MouseEvent.CLICK,quitartexto);
      //Si tiene varias camara activar boton de cambio
      if(Camera.names.length>1){
        camaraactual="1";
        prepareWebCam(camaraactual);
        btnchange.addEventListener(MouseEvent.CLICK,cambiarcamara);
      }else{
        //Si solo tiene una camara quitar el boton de cambio de cámara
        removeChild(btnchange);
        prepareWebCam(camaraactual);
      }
    
 
    }
 
    private function quitartexto(eve:MouseEvent):void{
 
    }
 
    private function saveToCameraRoll(e:MouseEvent):void
    {
 
    }  
 
    private function prepareWebCam(cam_n:String) : void
    {
 
 
    }
    private function rotarcamara(eve:MouseEvent){
 
    }
    
  }
  
}
Se define en el código anterior el comportamiento de cada uno de los botones que hemos creados. Adicionalmente se habilita o deshabilita el botón de cambio de cámara si el dispositivo seleccionado cuenta o no con la misma.   Dentro de la función prepareWebCam agregamos lo siguiente y adicionamos una nueva (que no la usaremos pero mostrara en la consola información de cambio en la actividad de la cámara):
ActionScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
    function prepareWebCam(cam_n:String) : void
    {
      video = new Video(VIDEO_WIDTH, VIDEO_HEIGHT);
      webcam = Camera.getCamera(cam_n);
      webcam.setMode(WEB_CAMERA_WIDTH, WEB_CAMERA_HEIGHT, VIDEO_FRAME_RATE);
      webcam.addEventListener(ActivityEvent.ACTIVITY, camera_activity);
      video.attachCamera(webcam);
      video.x=video.x-video.width/2;
      video.y=video.y-video.height/2;
      bg.vdcont.addChild(video);
      if(!firsttime){
        firsttime=true;
        bg.vdcont.rotation-=90;
      }
 
    }
    
       function camera_activity(evt:ActivityEvent):void {
      trace(evt.type.toString()+","+evt.activating.toString());
 
        }
  En tutorial continuara con la Parte 2   https://play.google.com/store/apps/details?id=air.com.smartrabbit.wanted&hl=es_419

Etiquetas:, ,

"Trackback" Enlace desde tu web.