Mobile Image Processing - Stanford...

29
Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 1 Mobile Image Processing Part 1: Introduction to mobile image processing on Android Part 2: Real-time augmentation of viewfinder frames Part 3: Utilizing optimized functions in the OpenCV library

Transcript of Mobile Image Processing - Stanford...

Page 1: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 1

Mobile Image Processing

n  Part 1: Introduction to mobile image processing on Android"n  Part 2: Real-time augmentation of viewfinder frames"n  Part 3: Utilizing optimized functions in the OpenCV library"

Page 2: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 2

Mobile landmark recognition

Page 3: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 3

Mobile product recognition

Page 4: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 4

Spotlight on Android

n  Open source mobile platform developed by Google"n  Supported and maintained by Open Handset Alliance"

l  13 mobile operators"l  22 handset manufacturers"l  20 semiconductor companies"l  17 software makers"

n  Uses an open-source kernel and a virtual machine designed for mobile hardware"n  Commands the largest share of the smartphone market in the world"n  Google Play contains over 800k apps"

Page 5: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 5

Distribution of worldwide smartphone sales in Q4 2012

World Smartphone Sales to End Users!Gartner (Q4 2012)!

Android"

iOS"RIM"MS"Other"

Page 6: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 6

Android software stack

Linux Kernel"

Professional Android Application Development!

Page 7: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 7

Programming Android applications in Java

n  Android encourages high-level app development"n  Android uses Java as the main programming language"n  Android inherits basic classes from conventional Java"

l  String, Container, Math, IO, Network, …"n  Android also adds new classes specific to mobile devices"

l  Camera, Telephony, Map, GPS, Speech, …"

Page 8: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 8

Android development with Eclipse

Android!SDK!

Java!Runtime!

program installation and execution"

system messages"

programmer inputs"

data and messages" Internet!

Eclipse!IDE!

Page 9: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 9

???"

Page 10: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 10

Class tutorials for mobile image processing

n  Android tutorials designed specifically for mobile image processing applications in the EE368/CS232 class"

n  Tutorial #1: Basic Android Setup"l  Image processing-oriented introduction to Android"l  Explains how to download and install the different software packages (SDK, Eclipse) on your

own computer"l  Shows how to build and run viewfinder augmentation apps in real time"

n  Tutorial #2: OpenCV for Android Setup"l  Builds on core skills developed in Tutorial #1"l  Explains how to download and install OpenCV for Android"l  Shows how to build viewfinder apps that detect circles and lines, " detect feature keypoints, track feature keypoints, perform locally" adaptive thresholding, detect human faces, …"

Page 11: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 11

Class tutorials for mobile image processing

http://ee368.stanford.edu/Android!

Covers all existing versions of Android"

Covers API-8 for Droid and API-11 for newer devices "

Page 12: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 12

Class tutorials for mobile image processing

http://ee368.stanford.edu/Android!

Page 13: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 13

Eclipse integrated development environment

Project files!

Class hierarchy!

Text editor!

Errors and warnings!

Different perspectives!

Page 14: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 14

Structure of an Android project

Programmer-defined Java files!Program new functions here"

Auto-generated Java files!Don’t edit anything here"

Android library!Don’t edit anything here"

Resource files!Edit layout, define constants,

import external media files, "change program permissions"

Java Native Interface files!C/C++ code"

Page 15: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 15

???"

Page 16: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 16

“Hello Viewfinder” project

n  Goals of this project"l  Learn how to create a simple Android project"l  Learn how to display viewfinder frames"l  Learn how to process viewfinder frames"

n  Full source available on class website:"l  http://ee368.stanford.edu/Android/HelloViewfinder"

"

Page 17: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 17

“Hello Viewfinder” class hierarchy

Hello Viewfinder!(Activity)!

Preview!(View)!

Draw on Top!

(View)!

Manage two views and manage program open and close"

Handle incoming viewfinder frames and adjust camera

parameters"

Process viewfinder frames and draw modified frames"

Page 18: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 18

Main activity class public class HelloViewfinderActivity extends Activity { private Preview mPreview; private DrawOnTop mDrawOnTop; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); // Hide the window title and set full screen

getWindow().setFlags(... Full Screen Parameters ...); requestWindowFeature(Window.FEATURE_NO_TITLE);

// Create Preview and DrawOnTop mDrawOnTop = new DrawOnTop(this); mPreview = new Preview(this, mDrawOnTop); setContentView(mPreview); addContentView(mDrawOnTop, ... Layout Options ...) } }

Make this class inherit the properties of an Activity"

Called when the activity is first created"

Create two children objects for displaying frames"

Page 19: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 19

“Hello Viewfinder” class hierarchy

Hello Viewfinder!(Activity)!

Preview!(View)!

Draw on Top!

(View)!

Manage two views and manage program open and close"

Handle incoming viewfinder frames and adjust camera

parameters"

Process viewfinder frames and draw modified frames"

Page 20: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 20

Preview class: viewfinder frames go down two paths

Preview!(View)!

Viewfinder frames"

…!

Display on phone screen "

Forward to custom callback function"

myCamera.setPreviewCallback(new PreviewCallback() { public void onPreviewFrame(byte[] data, Camera camera) { ... Pass data to DrawOnTop class ... } });

Data in YCbCr 4:2:0 format!!!!!

w"

h"

w/2" w/2"

h/2"

h/2"

Y!Cb! Cr!

Page 21: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 21

Preview class: toggle states via touch screen

// Define on touch listener this.setOnTouchListener(new OnTouchListener() { public boolean onTouch(View v, MotionEvent event) {

if (mDrawOnTop.mState == DrawOnTop.STATE_ORIGINAL) { mDrawOnTop.mState = DrawOnTop.STATE_PROCESSED; } else if (mDrawOnTop.mState == DrawOnTop.STATE_PROCESSED) { mDrawOnTop.mState = DrawOnTop.STATE_ORIGINAL; } return false;

} });

Define an anonymous touch listener object"

If in original state, toggle to processed state"

If in processed state, toggle to original state"

Page 22: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 22

“Hello Viewfinder” class hierarchy

Hello Viewfinder!(Activity)!

Preview!(View)!

Draw on Top!

(View)!

Manage two views and manage program open and close"

Handle incoming viewfinder frames and adjust camera

parameters"

Process viewfinder frames and draw modified frames"

Page 23: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 23

Draw-on-top class: process viewfinder frames

// Called whenever a repaint is requested protected void onDraw(Canvas canvas) { ... // Convert from YCbCr to RGB if (mState == STATE_ORIGINAL) decodeYCbCr420RGB(mRGBData, mYCCData, mWidth, mHeight); else decodeYCbCr420RGBHistEq(mRGBData, mYCCData, mWidth, mHeight); // Draw bitmap mBitmap.setPixels(mRGBData, 0, mWidth, 0, 0, mWidth, mHeight); Rect src = new Rect(... Size parameters ...); Rect dst = new Rect(... Size parameters ...); canvas.drawBitmap(mBitmap, src, dst, mPaintBlack); ... }

Called whenever this view is repainted"

Draw decoded frame in new layer"

Decode frame with or without hist. eq."

Page 24: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 24

???"

Page 25: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 25

Running the program on an Android device

Page 26: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 26

“Hello Viewfinder” application running on device

Page 27: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 27

Class project: jigsaw puzzle solver

L. Liang and Z. Liu, Spring 2010"http://ee368.stanford.edu/Project_10"

Page 28: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 28

Class project: plant leaf classification

D. Knight, J. Painter, and M. Potter, Spring 2010"http://ee368.stanford.edu/Project_10"

Page 29: Mobile Image Processing - Stanford Universityweb.stanford.edu/class/ee368/Handouts/Lectures/2013_Spring/Android... · Digital Image Processing: Bernd Girod, David Chen, Matt Yu ©

Digital Image Processing: Bernd Girod, David Chen, Matt Yu © 2013 Stanford University -- Mobile Image Processing 29

???"