1. Android Camera
the making of
MarsJUG
Aix en Provence - Marseille
6 Décembre 2012
@cfalguiere
jeudi 6 décembre 12
2. Claude Falguière
Architecte Technique Valtech
http://cfalguiere.wordpress.com
Duchess France, Paris JUG, Devoxx4Kids
@cfalguiere
jeudi 6 décembre 12
3. Objectif
questions apprendre
gadget fun pour Devoxx
alimenter un hacker space Duchess
@cfalguiere
jeudi 6 décembre 12
4. IDE
ADT : Eclipse + Plugins ADT + SDK
Eclipse
http://developer.android.com
@cfalguiere
jeudi 6 décembre 12
5. IDE
ADT : Eclipse + Plugins ADT + SDK
Plugins
http://developer.android.com
@cfalguiere
jeudi 6 décembre 12
6. IDE
ADT : Eclipse + Plugins ADT + SDK
Platform Tools
http://developer.android.com
@cfalguiere
jeudi 6 décembre 12
7. IDE Android Virtual Device (AVD)
@cfalguiere
jeudi 6 décembre 12
8. Hello Hello World
onCreate
onPause
onResume
onDestroy
Activity GroupView Hello World
(layout)
TextView
@cfalguiere
jeudi 6 décembre 12
9. Hello
Activity GroupView Hello World
(layout)
Go
TextView ImageView
Button
@cfalguiere
jeudi 6 décembre 12
10. Camera SurfaceHolder
Camera
(layout)
Activity SurfaceView
@cfalguiere
jeudi 6 décembre 12
11. Camera SurfaceHolder
Camera
(layout)
Activity SurfaceView
@cfalguiere
jeudi 6 décembre 12
12. Camera open
release
Camera
Activity RelativeLayout
SurfaceView SurfaceHolder
surfaceCreated
surfaceDestroyed
surfaceChanged
CameraPreview
startPreview
stopPreview Camera
@cfalguiere
jeudi 6 décembre 12
13. Camera
Activity RelativeLayout
FrameLayout
SurfaceView
@cfalguiere CameraPreview
jeudi 6 décembre 12
17. Camera manifest.xml
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.duchescameramini2"
android:versionCode="1"
android:versionName="1.0" >
<uses-sdk
android:minSdkVersion="8"
android:targetSdkVersion="17" />
<!-- will make use of camera -->
<uses-feature android:name="android.hardware.camera"
android:required="true" />
<uses-permission android:name="android.permission.CAMERA" />
@cfalguiere
jeudi 6 décembre 12
18. Camera
SurfaceView
RelativeLayout
Orientation par Orientation par
défaut du device défaut de la camera
@cfalguiere
jeudi 6 décembre 12
19. open
setCameraDisplay (holder)
startPreview
takePicture
stopPreview
release
@cfalguiere
jeudi 6 décembre 12
28. Incrustation DuchessSprite.java
private Bitmap bitmap; // the actual bitmap
public void draw(Canvas canvas, float ratio) {
Matrix matrix = new Matrix();
float s = 1 / bitmapScale;
int cw = Math.round(bitmap.getWidth() / 2);
int ch = Math.round(bitmap.getHeight() / 2);
canvas.drawBitmap(bitmap, matrix, null);
}
@cfalguiere
jeudi 6 décembre 12
29. Incrustation DuchessSprite.java
private Bitmap bitmap; // the actual bitmap
public void draw(Canvas canvas, float ratio) {
Matrix matrix = new Matrix();
float s = 1 / bitmapScale;
int cw = Math.round(bitmap.getWidth() / 2);
int ch = Math.round(bitmap.getHeight() / 2);
matrix.setScale(s, s, cw, ch);
canvas.drawBitmap(bitmap, matrix, null);
}
@cfalguiere
jeudi 6 décembre 12
30. Incrustation DuchessSprite.java
private Bitmap bitmap; // the actual bitmap
public void draw(Canvas canvas, float ratio) {
Matrix matrix = new Matrix();
float s = 1 / bitmapScale;
int cw = Math.round(bitmap.getWidth() / 2);
int ch = Math.round(bitmap.getHeight() / 2);
matrix.setScale(s, s, cw, ch);
matrix.postTranslate(centerX - cw, centerY - ch);
canvas.drawBitmap(bitmap, matrix, null);
}
@cfalguiere
jeudi 6 décembre 12
31. Incrustation DuchessSprite.java
private Bitmap bitmap; // the actual bitmap
public void draw(Canvas canvas, float ratio) {
Matrix matrix = new Matrix();
float s = 1 / bitmapScale;
int cw = Math.round(bitmap.getWidth() / 2);
int ch = Math.round(bitmap.getHeight() / 2);
matrix.setScale(s, s, cw, ch);
matrix.postTranslate(centerX - cw, centerY - ch);
matrix.postScale(ratio, ratio);
canvas.drawBitmap(bitmap, matrix, null);
}
@cfalguiere
jeudi 6 décembre 12
32. DrawView.java
public boolean onTouchEvent(MotionEvent event) {
final int action = event.getAction();
switch (action & MotionEvent.ACTION_MASK) {
case MotionEvent.ACTION_DOWN: {
mDuchess.handleActionDown((int)event.getX(),
(int)event.getY()); // update touched
break;
}
case MotionEvent.ACTION_MOVE: {
if (mDuchess.isTouched()) {
mDuchess.setCenterX((int)event.getX());
mDuchess.setCenterY((int)event.getY());
invalidate();
}
break;
}
case MotionEvent.ACTION_UP: {
if (mDuchess.isTouched()) {
mDuchess.setTouched(false);
}
reak;
}
}
return true;
}
@cfalguiere
jeudi 6 décembre 12
33. Incrustation
onTouchEvent
DrawView
public DrawView(Context context, DuchessSprite duchess) {
super(context);
...
// make the Panel focusable so it can handle events
setFocusable(true);
setFocusableInTouchMode(true);
}
@cfalguiere
jeudi 6 décembre 12
34. Merci
Questions Claude Falguière
@cfalguiere
goo.gl/4mmJQ
@cfalguiere
jeudi 6 décembre 12
37. Lab 1 Créez un repo Git (git init)
Créez un workspace Eclipse sur la racine
du repo
Créez un projet dans Eclipse
• New «Android Application Project»
• (Facultatif) choisissez l’icone Photo dans Clipart
• une activité MainActivity par défaut
Lancez l’application dans le simulateur
• Créez un AVD Galaxy Nexus
• Exécutez dans le simulateur
Lancez l’application sur un device connecté
@cfalguiere
jeudi 6 décembre 12
38. Lab 2
Affichez la caméra dans votre application
vous aurez besoin
• de modifier le layout (RelativeLayout et
FrameLayout)
• d’implémenter un SurfaceView
• de la feature android.hardware.camera
• de la permission android.permission.CAMERA
• de corriger l’orientation
@cfalguiere
jeudi 6 décembre 12
39. Lab 3 Ajoutez le bouton et prennez une photo
(Facultatif) ajoutez le son
vous aurez besoin
• du composant graphique Button
• de l’icône du bouton : drawable/camera_icon.png
• de l’implémentation du PictureCallback
• de la permission
android.permission.WRITE_EXTERNAL_STORAGE
• du fichier son camera_click.ogg (Facultatif)
• de la classe SoundPool (Facultatif)
@cfalguiere
jeudi 6 décembre 12
40. Lab 4 Ajoutez une vue ImageView custom et
affichez Duchess
vous aurez besoin
• de l’image du sprite : drawable/
duchessfr_shadow.png
• de l’implémentation du Sprite DuchessSprite
@cfalguiere
jeudi 6 décembre 12
41. Lab 5
Ajoutez la possibilité de déplacer le sprite
(Facultatif) affichez un feedback visuel
vous aurez besoin
• de l’implémentation du Sprite DragFeedbackSprite
(Facultatif)
@cfalguiere
jeudi 6 décembre 12