CS 4518 Mobile And Ubiquitous Computing

CS 4518 Mobile and UbiquitousComputingLecture 7: Fragments, CameraEmmanuel Agu

Fragments

Recall: Fragments Sub-components of an Activity (screen)An activity can contain multiple fragments, organized differentlyon different devices (e.g. phone vs tablet)Fragments need to be attached to Activities.

FragmentsRef: Android Nerd Ranch (2nd ed), Ch 7, pg 121 To illustrate fragments, we create new app CriminalIntentUsed to record “office crimes” e.g. leaving plates in sink, etcRecord includes: Title, date, photo List-detail app Fragments On tablet: show list detailOn phone: swipe to show next crime

Fragments Activities can contain multiple fragmentsFragment’s views are inflated from alayout fileCan rearrange fragments as desired on anactivity i.e. different arrangement on phone vs tablet

Starting Criminal Intent Initially, develop detail view of CriminalIntent usingFragmentsFinal Look of CriminalIntentStart smallDevelop detail view using Fragments

Starting Criminal Intent Crime: holds record of 1 office crime. Has Title e.g. “Someone stole my yogurt!”ID: unique identifier of crimeCrimeFragment: UI fragment to display Crime DetailsCrimeActivity: Activity that contains CrimeFragmentNext: Create CrimeActivity

Create CrimeActivity in Android StudioCreates CrimeActivity.javaFormatted usingactivity crime.xml

Fragment Hosted by an Activity Each fragment must be hosted by an ActivityTo host a UI fragment, an activity must Define a spot in its layout for the fragmentManage the lifecycle of the fragment instance (next)E.g.: CrimeActivity defines “spot” for CrimeFragment

Fragment’s Life Cycle Fragment’s lifecycle similar to activitylifecycle Has states running, paused and stoppedAlso has some similar activity lifecyclemethods (e.g. onPause(), onStop( ), etc)Key difference: Android OS calls Activity’s onCreate,onPause( ), etcFragment’s onCreateView( ), onPause( ), etccalled by hosting activity NOT Android OS!E.g. Fragment has onCreateView

Hosting UI Fragment in an Activity 2 options. Can add fragment to either Activity’s XML file (layout fragment), orActivity’s .java file (more complex but more flexible)We will add fragment to activity’s .java file nowFirst, create a spot for the fragment’s view in CrimeActivity’slayout

Creating a UI Fragment Creating Fragment is similar to creating activity1.2.3. Define widgets in a layout (XML) fileCreate java class and specify layout file as XML file aboveGet references of inflated widgets in java file (findviewbyId), etcXML layout file for CrimeFragment (fragment crime.xml)

Java File for CrimeFragment In CrimeFragment Override CrimeFragment’s onCreate( )functionFormat Fragmentusing fragment crime.xml Note: Fragment’s view inflated in Fragment.onCreateView(), NOT onCreate

Wiring up the EditText WidgetAdd listener to listenfor text change eventsStore user’sinput asCrime Title(if textentered)Get handleto EditTextwidget

Adding UI Fragment to FragmentManager We add new fragment to activity using FragmentManagerFragmentManager Manages fragmentsAdds fragment’s views to activity’s viewHandles List of fragmentBack stack of fragment transactionsFind Fragmentusing its IDInteractions with FragmentManagerare done using transactionsAdd Fragmentto activity’s view

Examining Fragment’s Lifecycle FragmentManager calls fragmentlifecycle methods onAttach( ), onCreate( ) andonCreateView() called when a fragmentis added to FragmentManager onActivityCreated( ) called after hostingactivity’s onCreate( ) method is executed If fragment is added to already runningActivity then onAttach( ), onCreate( ),onCreateView(), onActivityCreated( ),onStart( ) and then onResume( ) called

The Mobile CameraInteresting application

Mobile App: Word Lens Translates signs in foreign LanguageGoogle bought company. Now integrated into GoogleTranslate[ Video ]

Camera:Taking Pictures

Taking Pictures with CameraRef: obasics.html How to take photos from your app using existing AndroidCamera appSteps:1.2.3.4.Request Camera PermissionTake a Photo with the Camera AppGet the ThumbnailSave the Full-size Photo

Request Permission to Use SmartPhone Camera If your app takes pictures using Android Camera, on Google Play, canmake your app visible only to devices with a cameraE.g. This app requires a smartphone cameraMake the following declaration in AndroidManifest.xml

Take a Photo with the Camera App To take picture, your app needs to send Intent to Android’s Camera app,(i.e. action is capture an image)Potentially, multiple apps/activities can handle take a pictureCheck that at least 1 Activity that can handle request to take picture usingresolveActivityCall startActivityForResult( ) with Camera intent since picture sent backBuild Intent describing taking a pictureCheck that there’s at least 1 Activity thatcan handle request to take pictureSend Intent requesting taking a picture(usually handled by Android’sCamera app)

Get the Thumbnail Android Camera app returns thumbnail ofphoto (small bitmap)startActivityForResult Thumbnail returned in “extra” of Intentdelivered to onActivityResult( )Your ApponActivityResultAndroidCamera app

Save Full-Sized PhotoRef: -storage/files.html Android Camera app can save full-size photo to1.Public external storage (shared by all apps) 2.Private storage (Seen by only your app, deleted when your appuninstalls): getExternalStoragePublicDirectory( )Need to get permissiongetExternalFilesDir( )Either way, need phone owner’s permission to write to externalstorageIn AndroidManifest.xml, make the following declaration

Taking Pictures: Bigger Example

Taking Pictures with IntentsRef: Ch 16 Android Nerd Ranch 2nd edition Would like to take picture of “Crime” to document itUse implicit intent to start Camera app from our CrimeIntent appRecall: Implicit intent used to call component in different activityClick hereto take pictureLaunchesCamera app

Create Placeholder for Picture Modify layout to include ImageView for pictureButton to take picture

Create Layout for Thumbnail and Button First, build out left side

Create Camera and Title Build out right side

Include Camera and Title in Layout Include in previously created toppartCreate, add in bottom partCamera andTitleThe rest ofthe layout

Get Handle of Camera Button andImageView To respond to Camera Button click, in camera fragment, needhandles to Camera buttonImageView

Firing Camera IntentCreate new intentfor image captureCheck with PackageManagerthat a Camera exists on thisphoneBuild Intent to captureimage, store at uri locationTake picture whenbutton is clicked

Declaring Features Declaring “uses-features” in Android manifest means only cameras withthat feature will “see” this app for download on the app storeE.g. declaring “uses-feature android.hardware.camera”, only phoneswith cameras will see this for download

References Google Camera “Taking Photos Simply” mera/photobasics.htmlBusy Coder’s guide to Android version 4.4CS 65/165 slides, Dartmouth College, Spring 2014CS 371M slides, U of Texas Austin, Spring 2014

Take a Photo with the Camera App To take picture, your app needs to send Intent to Android’s amera app, (i.e. action is capture an image) Potentially, multiple apps/activities can handle take a picture Check that at least 1 Activity that can handle request to take picture using resolveActivity Call startActivityForResult( ) with Camera intent since picture sent back