OutlineIntroduction
UI GuidelinesActivities and Fragments
Activities, Fragments and IntentsMobile App Development
Przemyslaw Pawluk
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
1 IntroductionConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
2 UI Guidelines
Design Principles
3 Activities and FragmentsActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
1 IntroductionConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
2 UI Guidelines
Design Principles
3 Activities and FragmentsActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
Manifest file
AndroidManifest.xml
XML file
Contains name of the application and a default package,
Sets up the various permissions required by this application,
Defines the application-wide parameters,
Defines the startup Activity for the application.
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
1 IntroductionConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
2 UI Guidelines
Design Principles
3 Activities and FragmentsActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
res/values/strings.xml
You can use file string.xml to keep global constants such as nameof the app, communicates, headers etc.
1 < s t r i n g name=” a b o u t t i t l e ”>About Android </ s t r i n g >2 < s t r i n g name=” a b o u t t e x t ”>\3 Andro id a l l o w s you to use xml to d e s c r i b e GUI and to s t o r e
v a l u e s .4 You can a s l o use <i >HTML</i > t a g s i n t h e r e .5 </ s t r i n g >
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
1 IntroductionConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
2 UI Guidelines
Design Principles
3 Activities and FragmentsActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
res/values/colors.xml
You can define custom colors that can be used in definitions oflayout and layout elements
1 <r e s o u r c e s >2 <c o l o r name=” background ”>#3500 f f f f </c o l o r >3 </ r e s o u r c e s >
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
1 IntroductionConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
2 UI Guidelines
Design Principles
3 Activities and FragmentsActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
How?
Declarative
Statically (off-line) declare the interface using XML-basedlanguage. It is similar to building XHTML web page.
Procedural
Simply means in code. You write Java code to create andmanipulate all the user interface objects called Views.
Mixed
Android allows you also to mix both methods. You can build askeleton declaratively and fill in required elements during theexecution. This approach allows for flexibility minimizing coding.
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
How?
Declarative
Statically (off-line) declare the interface using XML-basedlanguage. It is similar to building XHTML web page.
Procedural
Simply means in code. You write Java code to create andmanipulate all the user interface objects called Views.
Mixed
Android allows you also to mix both methods. You can build askeleton declaratively and fill in required elements during theexecution. This approach allows for flexibility minimizing coding.
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
How?
Declarative
Statically (off-line) declare the interface using XML-basedlanguage. It is similar to building XHTML web page.
Procedural
Simply means in code. You write Java code to create andmanipulate all the user interface objects called Views.
Mixed
Android allows you also to mix both methods. You can build askeleton declaratively and fill in required elements during theexecution. This approach allows for flexibility minimizing coding.
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
Advice from Google
Google’s advice is to use declarative XML as much as possible.
The XML code is often shorter and easier to understand than thecorresponding Java code, and its less likely to change in futureversions.
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
Why XML? Isn’t it ineffective?
Although you see XML when writing your program, the Eclipseplug-in invokes the Android resource compiler, aapt, to preprocessthe XML into a compressed binary format. It is this format, notthe original XML text, that is stored on the device.
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
1 IntroductionConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
2 UI Guidelines
Design Principles
3 Activities and FragmentsActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
Basic elements
View
An object that knows how to draw itself to the screen.
ViewGroup
Views that can contain or group other Views.
Layout
Gives Android hints about how youd like to see the Views arranged.
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
Layout
View 1 View 2 ViewGroup
View 3 View 4
Figure: A concept of layouts, groups and views
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
Layout
Layout is:
a container for one or more child objects
a behaviour to position them on the screen within therectangle of the parent object
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
Layout
Commonly used layouts
FrameLayout – all children start at the top left of the screen
LinearLayout – children in a single column or row
RelativeLayout – children in relation to each other or to theparent
TableLayout – children in rows and columns, similar to anHTML table
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
Vertical vs. Horizontal
You can declare layouts fitted for specific position of the device
Horizontal
res/layout/main.xmlCan contain e.g. ListLayout
Vertical
res/layout-land/main.xmlCan contain TableLayout nested in ListLayout to make better useof the space
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
Design Principles
1 IntroductionConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
2 UI Guidelines
Design Principles
3 Activities and FragmentsActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
Design Principles
Design Principles
Enchant Me
Simplify My Life
Make Me Amazing
Source: http://developer.android.com/design/get-started/principles.html
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
Design Principles
Action Bars and other ...
Action Bar
1 Home button that takes your user to ”Home Screen/Activity”
2 View control (e.g. in Calendar it may be option to showYear/Month/Week/Day)
3 Action buttons such as Search, Zoom etc
4 Overflow actions ...
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
Design Principles
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
Design Principles
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
1 IntroductionConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
2 UI Guidelines
Design Principles
3 Activities and FragmentsActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Activity
What is it?
An activity is a user interface screen. Applications can define oneor more activities to handle different phases of the program.
Declaration
In AndroidManifest.xml
Definition
In Java as an extension ofActivity class
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Declaration
1 <a p p l i c a t i o n . . . >2 . . .3 <a c t i v i t y a n d r o i d : name=” . S u n C a l c u l a t o r A c t i v i t y ”4 a n d r o i d : l a b e l=” @ s t r i n g / app name ”>5 < i n t e n t− f i l t e r >6 <a c t i o n a n d r o i d : name=” a n d r o i d . i n t e n t . a c t i o n . MAIN”/>7 <c a t e g o r y a n d r o i d : name=” a n d r o i d . i n t e n t . c a t e g o r y .
LAUNCHER”/>8 </ i n t e n t− f i l t e r >9 </ a c t i v i t y >
10 . . .11 </ a p p l i c a t i o n >
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Definition
1 p u b l i c c l a s s S u n C a l c u l a t o r A c t i v i t y e x t e n d s A c t i v i t y {2
3 /∗∗ C a l l e d when t h e a c t i v i t y i s f i r s t c r e a t e d . ∗/4 @ O v e r r i d e5 p u b l i c v o i d o n Cr e at e ( Bundle s a v e d I n s t a n c e S t a t e ) {6 s u p e r . on C re a te ( s a v e d I n s t a n c e S t a t e ) ;7
8 // Here you i n i t i a l i z e , b u i l d t h e UI e l e m e n t s e t c9
10 }11
12 // then you can add v a r i o u s c a l l b a c k f u n c t i o n s to h a n d l ee v e n t s
13 }
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Activity – main app component
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
1 IntroductionConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
2 UI Guidelines
Design Principles
3 Activities and FragmentsActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Intent
What is it?
An intent is a mechanism for describing a specific action, such aspick a photo, phone home, or show map
How is it done?
An instance of Intent class is created and parameters such asaction, category and data are set.
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Calling specific activity
1
2 I n t e n t myI ntent = new I n t e n t ( t h i s , C a l l e d A c t i v i t y . c l a s s ) ;3 s t a r t A c t i v i t y ( myIntent ) ;4
5 // o r s t a r t A c t i v i t y F o r R e s u l t ( m yIntent resCode ) ;6 // i f you want to g e t a r e s u l t
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Component based architecture
Ask others to do it for you
Android allows you to call activities and services from otherapps!
You can send a request e.g. to open a photo or show a mapand (if there is an app accepting such call) it will be served.
If multiple apps can handle it then user can choose who(which app) will be used.
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Calling activity based on action/category
1
2 I n t e n t myI ntent = new I n t e n t (3 a n d r o i d . c o n t e n t . I n t e n t . ACTION VIEW ,4 // White house l o c a t i o n5 U r i . p a r s e ( ” geo :38 .899533 ,−77.036476 ” )6 ) ;7
8 s t a r t A c t i v i t y ( myIntent ) ;9
10 // o r s t a r t A c t i v i t y F o r R e s u l t ( m yIntent resCode ) ;11 // i f you want to g e t a r e s u l t
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
1 IntroductionConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
2 UI Guidelines
Design Principles
3 Activities and FragmentsActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Fragment
Encapsulated, reusable component with own lifecycle and UI thatcan be used to build activity.It is tightly bound to the Activity into which it is placed.They can be reused in various activities.
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Fragments in Android
Fragments were introduced as a part of Android 3.0 Honeycomb(API level 11).
Recquired
Your activity has to extend FragmentActivity
public class MyActivity extends FragmentActivity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Create a Fragment Class
Extend Fragment class
Create layout file with view hierarchy (optionally)
If your fragment requires UI override onCreateView handlerto inflate and return the view hierarchy (from layout file orautomatically).
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
1 IntroductionConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
2 UI Guidelines
Design Principles
3 Activities and FragmentsActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Created
Fragment.onAttach
Fragment.onCreate
Fragment.onCreateView
Fragment.onActivityCreated
Fragment.onDeatach
Fragment.onDestroy
Fragment.onDestroyView
..
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Visible
Active
.
Fragment.onStart
Fragment.onResume
Fragment.onStop
Fragment.onPause
.
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Fragment-specific Lifecycle Events
Attach/Deattach
Start and End of the life-cycle
Create/Destroy
Start and End of the created lifetime
Create/Destroy UI
onCreateView should be used to initialize fragment’s UI
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Fragment States
State
A state of the fragment is closely related to the correspondingActivity state and it’s transitions are related to Activity’stransitions.
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
1 IntroductionConfigurationGlobal ValuesColorsUser InterfaceBuilding elements
2 UI Guidelines
Design Principles
3 Activities and FragmentsActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Fragment Manager
FragmentManager is used to manage fragments that the Activitycontains. It provides the methods to perform fragment transactionto add, remove and replace fragments.
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Layout file
Simplest way to add a fragment to an activity is to add<fragment> tag to the layout.
1 <f ragment2 a n d r o i d : name=”com . paad . w e a t h e r s t a t i o n . D e t a i l s F r a g m e n t ”3 a n d r o i d : i d=”@+i d / f ragment14 a n d r o i d : l a y o u t w i d t h=” m a t c h p a r e n t ”5 a n d r o i d : l a y o u t h e i g h t=” m a t c h p a r e n t ”6 a n d r o i d : l a y o u t w e i g h t=”3”7 />
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Fragment transaction
Fragment Transactions can be used to add, remove, and replacefragments within the activity at runtime.
1 F r a g m e n t T r a n s a c t i o n t = fragmentManager . b e g i n T r a n s a c t i o n ( ) ;2 // to add3 t . add (R . i d . u i c o n t a i n e r , new MyFragment ( ) ) ;4
5 // to remove6 Fragment f = fragmentManager . f i n d F r a g m e n t B y I d (R . i d .
myfragment ) ;7 t . remove ( f ) ;8
9 // to r e p l a c e10 t . r e p l a c e (R . i d . myfragment , new MyFragment ( ) ) ;11
12 t . commit ( ) ;
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Back Stack
If you use fragments to display different screens within the sameactivity, user will expect that back button will revers the FragmentTransaction effects. You can fulfill this expectation by adding thetransaction to the back stackfragmentTransaction.addToBackStack(tag).
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Built-in Fragment Classes
DialogFragment – floating dialog
ListFragment – wrapper class featuring ListView
WebViewFragment – wrapper class featuring WebView
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Summary
Fragment should encapsulate a functionality and be fairyindependent
Fragment can have own UI (but it’s possible to create onewithout it)
Fragments can be dynamically added, removed and replaced
Fragments can communicate through Activity
Przemyslaw Pawluk Activities, Fragments and Intents
OutlineIntroduction
UI GuidelinesActivities and Fragments
ActivitiesIntentsIntroducing fragmentsFragment Life-CycleFragments in Activity
Przemyslaw Pawluk Activities, Fragments and Intents