A guided tour in Android World
Fundamental Session 1
6-1-2016
© For internal use Who are we ? Practical Work - Session 1
▶ Maxime PERON ▶ François FACON ▶ Ibrahim GHARBI ▶ François Julien Ritaine SDCO Engineer Mobile software R&D Engineer Mobile Web & Mobile architect expert [email protected] [email protected] [email protected]
L’Appli Mon Coffre
Mes Transferts
Our job explained in 7 minutes (koreus.com)
2 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Quizz time About you… ▶ Go to http://www.socrative.com – Then click on « STUDENT LOGIN »
From A to H From I to Z
T6SXFNK4 CWVS25TY
▶ Wait until I start the Quizz, then enter your « first name » & « last name » like this: FirstName LastName ▶ Complete the Quizz…
3 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline About Worldline by Atos
4 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline About Worldline by Atos
5 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline About Worldline by Atos
R&D
Strategy, Marketing & Communication
Software Development Comunity Office
Technical Operations
Merchant Services Mobility & Financial Processing & e-Transactional & Terminals Services Software Licensing
Retail, industry, Telco, medias, Bank, finance, hardware governement, sport assurance
6 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Internships Objectives …What we will do together
1. Dive into 3. Work in a team The Android World and make great apps !
2. Take a look at 4. Share our an application experiences, (main structure, tools, to be more components, efficient GUI, tools…)
7 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Planning P2
Practical Work Project teams Project presentation
D1 D2 D3 D4 D5 D6 P1 P2 26/11 03/12 10/12 17/12 07/01 14/01 21/01 28/01
QUIZZ D1 QUIZZ D2 QUIZZ D3 QUIZZ D4 QUIZZ D5 QUIZZ D6 - A bit of History… - Layout - ListView - SQLite - CursorAdapter - Thread - Deep in - Activity - Custom Cell - SQLiteDatabase - ContentObserver android - Intent - AsyncTask - Custom - ContentValues - Service - Buttons - Fragment - Adapter - Cursor - Inside an - PendingIntent - Listeners - ViewHolder - ContentProvider Android - ListView - Toast application - ImageView - ContentResolver - AlarmManager - Adapter - Preferences - Bitmap - URI - BroadcastReceiver - Menu - LayoutInflater - Authority - Notification
Twitter Twitter Twitter Twitter Twitter Project Project App App App Hello World App App part 1 part 2 Step1 Step2 Step3 Step4 Step5
I.Gharbi I.Gharbi I.Gharbi I.Gharbi I.Gharbi I.Gharbi I.Gharbi I.Gharbi F.Facon F.Facon F.Facon F.Facon F.Facon F.Facon F.Facon F.Facon M.Peron FJ.Ritaine FJ.Ritaine
8 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Agenda
▶ A little bit of history … – The mobile world – Android ecosystem
▶ Deep in android – How my apps are running inside android ? – Android for a developer
▶ Inside an android application – Prepare your environment and create your first app ! – Structure of an application
9 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline A little bit of history….
The mobile world
10 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline The mobile world From a simple phone to a « smart » one
2G : First Iphone 2G : Colors on Emergence of Android 1.0 First Phones Phone growth Web app & web phones Smartphones released (80s) (end of 90s) Experience experience (2004) (1997) (2001) (2007) (2008)
Nokia Apple Nokia Sony Ericsson N95 Iphone HTC 3210 G1 Motorola T68i DynaTAC 8000X
L'HISTOIRE DU SMARTPHONE EN 25 TÉLÉPHONES EMBLÉMATIQUES (CLUBIC.COM)
11 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline The mobile world A new device with new usages (1/2)
▶ 2010 : more Smartphones sales than PC
▶ 2013 : more tablets sales than PC in France
IL S’EST-VENDU PLUS DE TABLETTES QUE DE PC EN FRANCE EN 2013 (LE FIGARO)
12 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline The mobile world A new device with new usages (2/2)
▶ Smartphone = consuming the Web
▶ Still less productivity than a standard PC
DIGITAL SOCIAL MOBILE, LES CHIFFRES (WEARESOCIAL.FR)
13 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline The mobile world Mobile constraints
User Interface (UI) User Experience (UX)
!=
Bandwid Performa Ubiquity Battery Security Sensors th nce
▶ Operating System for mobile need to be specific. ▶ it’s a compromise of all those constraints
14 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline The mobile world Mobile operating system
“An operating system (OS) is system software that manages computer hardware and software resources and provides common services for computer programs.” (Wikipedia)
OS mobile Timeline :
90s 2010 2017
2000 2015
15 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline The mobile world Market share
16 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline SMARTPHONE OS MARKET SHARE (KANTARWORLDPANEL.COM) The mobile world Manufacturer share
http://dazeinfo.com/2015/04/30/worl dwide-smartphone-shipments-q1- 2015-samsung-is-back-to-business/
SAMSUNG IS BACK TO BUSINESS 17 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline (DAZEINFO.COM) A little bit of history….
Android ecosystem
18 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Android ecosystem What is android ?
▶ Mobile OS based on Linux ▶ Open Handset Alliance created in 2007 ▶ Designed to work on a large set – Develop open standards for mobile of devices devices ▶ Initially developed by a startup, ▶ AOSP ; open source version of bought by Google in 2005 android
19 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline A brief Android History
A BRIEF HISTORY OF ANDROID 20 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline (THE VERGE) Android ecosystem To summarize
M
2007 2015
▶ The platform evolved with lots of changes between each versions providing to developers new possibilities
ANDROID DE 2003 21 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline À AUJOURD’HUI (PRESSE-CITRON.NET) Android ecosystem Fragmentation (1/5) : Versions
22 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline ANDROID VERSION FRAGMENTATION IN REAL TIME ! Android ecosystem Fragmentation (2/5) : Hardware fragmentation
▶ Differences : – CPU/GPU – Memory – Storage – Screen size – Density – Battery – Sensors
23 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline ANDROID DEVICE FRAGMENTATION (OPEN SIGNAL) Android ecosystem Fragmentation (3/5) : Manufacturer / M(V)NO fragmentation
▶ Apps (browser , sms , photo manager …)
▶ GUI (Graphical User Interface) – Samsung Touchwizz – HTC Sense – LG UX – Sony Timescape – …
▶ Android customization (custom room) – CyanogenMod – Remix OS …..
24 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Android ecosystem Fragmentation (4/5) : Devices fragmentation
▶ Designed to run on a large set of devices : – Smartphone, Tablet – TV – Watch – Car player – Washing machine…
▶ … on specific operating system version :
Android M
25 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Android ecosystem Fragmentation (5/5) : solutions ?
▶ For new theme, components, design pattern , backport exist : Use support library
▶ Android design ▶ Google play support library services
▶ Google Cloud Testing ▶ Android system webview
26 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline ANDROID SUPPORT LIBRARY Android ecosystem design history
Android iOS
→
(2012) Holo (2014) Material design (2013) Flat design
27 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline ANDROID MATERIAL DESIGN Agenda
▶ A little bit of history … – The mobile world – Android ecosystem
▶ Deep in android – How my apps are running inside android ? – Android for a developer
▶ Inside an android application – Prepare your environment and create your first app ! – Structure of an application
28 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Deep in android…
How my apps are running inside android ?
29 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline How my apps are running inside android ? 4 Fundamentals
▶ Language for your applications : – Java 6… not 7 !
▶ A Virtual Machine like JVM: Dalvik – JIT – Compiled in DEX files
▶ Dalvik is now replaced by ART – experimental on 4.4 – fully integrated on android 5.x
▶ Application packaged in Android PacKage (APK) that contains : – .dex with Java classes – Manifest in binary – Resources (images, labels, themes, …)
30 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline How my apps are running inside android ? Simple architecture
▶ Both on KitKat ( Dalvik by default) ▶ ART only on Lollipop
31 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Architecture : the 5 rules
1. You developed in Java, your java files are compiled in .class files
2. “.class” files are converted by the compiler in DEX bytecode that is the code running on your virtual machine (Dalvik or ART) – DEX bytecode format is independent of device processor architecture (i386, x64, armv6…). You have 1 APK for every android devices in the world !
3. DEX bytecode needs to be translated to your native machine by the Runtime (Dalvik or ART)
4. Dalvik is based on Just-in-Time (JIT) compilation – Each time when the app is run, it dynamically translates a part of the Dalvik bytecode into machine code
5. ART is based on Ahead-of-Time (AOT) compilation – At app’s installation, DEX bytecode is translated into machine code and stores in the device’s storage. This is a one-time event.
32 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Full Architecture
33 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Deep in android…
Android for a developer
34 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Android for a developer Compilation (1/2)
▶ How from my java code I can build a fully functional APK working on my device ?
35 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Android for a developer Compilation (2/2)
36 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Android for a developer Developer toolbox
1. Documentation
2. An SDK (Java) for every version of Android
3. NDK (C/C++) : native development kit
4. IDE
deprecated ADT plugin for Eclipse VS Android Studio based on IntelliJ
1. Debugging tools 2. Emulator (AVD) 3. Logs …and a lot more
ALL ANDROID DEVELOPPEMENT 37 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline TOOLS
Android for a developer Documentation / Guidelines / Training
http://developer.android.com/index.html
38 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline ANDROID CHANGELOGS (ANDROID DEVELOPPER) Android for a developer Tool focus (1/6) : Android SDK Manager
▶ Install/update/delete – Android SDK – Tools – Drivers (for windows) – Additional API – External libraries (from Google) – System images (emulator)
39 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Android for a developer Tool focus (2/6) : Android Studio IDE
▶ IDE ▶ Launch simulator ▶ Debug tools ▶ … ▶ Access to AVD, SDK Manager
40 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Android for a developer Tool focus (3/6) : Android Studio IDE
41 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Android for a developer Tool focus (4/6) : Android Virtual Device (AVD) Manager ▶ Manage emulators – Based on provided images – Custom emulators
42 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Android for a developer Tool focus (4/6) : Dalvik Debug Monitor Server (DDMS)
▶ Monitor :
– Devices – Threads – Heap – Memory – Network – FS – Emulator – Logs…
43 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Android for a developer Tool focus (5/6) : Android Debug Bridge (ADB)
▶ Command line tool to communicate with an emulator instance or connected Android device
▶ Client/server program with a daemon
▶ List of commands – List connected devices – Install/uninstall apps – Push/Pull data…
44 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline ADB COMMAND LINE TOOL (ANDROID DEVELOPPER) Android for a developer Tool focus (6/6) : Google Play Developer console
▶ 25$ once
▶ Publish your app
▶ Analyse feedbacks from users
▶ Get some sta tistics , usages
▶ Soon …Test your app !
45 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Agenda
▶ A little bit of history … – The mobile world – Android ecosystem
▶ Deep in android – How my apps are running inside android ? – Android for a developer
▶ Inside an android application – My first application – Structure of an application
46 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Inside an android application
My First Application
47 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline My first application Prerequires
▶A Laptop
▶SDK downloaded and installed https://goo.gl/DJXUN
▶An Android device to run your first projet
▶Or an emulator
▶Start Android studio
48 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline My first application The twitter project
▶ During our next 5 sessions , we will try to make and improve a Twitter wall app
▶ This application will provide : – Authentication to the twitter feed – A page containing the wall – A detail page showing a twit
49 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline My first application The twitter project : how it works
Activity Service HTTP Twitter API Fragment
UI Database
Notifications Model Preferences
50 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline My first application Start a project (1/6)
51 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline My first application Start a project (2/6)
52 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline My first application Start a project (3/6)
53 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline My first application Start a project (4/6)
54 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline My first application Start a project (5/6)
55 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline My first application Create an emulator in AVD
56 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline My first application Start a project (6/6)
Build
Deploy
Run
Test
57 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline My First Application Start an android project
Create your first single activity project
58 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Inside an android application
Structure of an application
59 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline Structure of an application Agenda
▶Project settings ▶Permissions ▶Folder Structure ▶Resources ▶Manifest File – Folders ▶Application design – Dimentions – Internationalization ▶Activity – Drawables – lifecycle – Theme & style – Layout and views
60 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An android app from the inside “Project structure” menu : Your app configuration
▶ Build flavor, types ▶ Dependencies ▶ Services ▶ Modules….
61 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Folders structure
▶ src – Java classes ▶ gen – Auto-generated files (BuildConfig, R) ▶ assets – Raw files ▶ bin – Output directory of the build ▶ libs – Private libraries ▶ res – Resources : drawables, animations, string resources, layouts, …
62 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Manifest : the center point of an application
▶ ID card of your application : the central file that describes the nature of the application and each of its components
▶ It describes: – Activities – Services – Broadcast receivers – Content providers – Features needed/required – Requested Permissions – API level – …
63 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Application design
▶ MVC pattern – Model is your data structure – View loaded from XML layout – Controller is the Activity
▶ Other existing pattern for android : – MVVM (windows phone C# style) – MVP – Data Binding (introduced in Android Studio 1.3)
▶ http://developer.android.com/guide/components/activities.html
64 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Activity (1/9) : Principles
▶ An Activity is an application component that provides a screen (such as dial the phone, take a photo, send an email, or view a map) ▶ Each activity is given a window in which to draw its user interface.
▶ Because state of your application changes, activity has a lifecycle
65 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Activity (2/9) : Lifecycle
▶ Many event can occur when your app is running
▶ SDK use callback to properly handle lifecycle
▶ Three essential states : – Resumed • Running, in foreground
– Paused • Running, but another activity is on top • Other activity doesn’t cover the entire screen
– Stopped • In background, another activity is on top • Other activity covers the entire screen
66 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Activity (3/9) : Lifecycle in your code
from
▶ An Activity is a java object with different types.
67 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Activity (4/9) : Layout & Views
▶ An activity provide a user interface with a hierarchy of views packaged in a single layout file located on the Layout Folder
▶ The language to describe a layout is XML
▶ ViewGroup : used to layout multiple views
from
68 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Activity (5/9) : Layout & Views
▶ You can edit your layout in plain XML or with the layout editor where you can drag and drop views
▶ It’s also possible to create a layout and views with code only.
69 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Activity (6/9) : Layout & Views
▶ Android provides a number of ready-made views that you can use to customize and organize your layout.
70 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Activity (7/9) : Layout & Views
▶ The layout is provided to the activity programmatically by “setContentView” methods :
HOW EVERYTHING IS DRAWN 71 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline (INOVEX.DE) An Android app from the inside Activity (8/9) : the manifest declaration
▶ You must declare your activity in the manifest file in order for it to be accessible to the system.
▶ Lots of activity properties could be set inside the manifest (portrait/landscape mode, theme …)
MANIFEST PROPERTIES FOR AN 72 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline ACTIVITY (ANDROID DEVELOPPER) An Android app from the inside Activity (9/9) : the manifest declaration
▶ “An Intent is a messaging object you can use to request an action from another app component ” (ex: activities)
▶ Intent filter : it specifies the type of intents accepted by the activity based on the intent's action, data, and category. The system will deliver an implicit intent to your app component only if the intent can pass through one of your intent filters.
▶ “Launcher” is the default one when you create an application
INTENT FILTERS 73 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline (ANDROID DEVELOPPER) An Android app from the inside Permissions
▶ Declares a security permission that can be used to limit access to specific components or features of this or other applications
PERMISSIONS (ANDROID DEVELOPPER)
NB : Before android 6.0, users validate permissions only at app install on google playstore. Now permission need to be accepted the first time the feature is used
74 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Resources (1/5): Folder description
▶ res/values – arrays • Define arrays (string, int, …) – attrs • Define some specific component attributes – colors • Define colors – dimens • Define dimensions used in the layouts – style • Customize application theme • Define style to be reused in other components
– strings • Define labels used in the app
75 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline
An Android app from the inside Resources (2/5): Dimensions
▶ Device Pixel (DP) or Device Independant Pixel (DIP) : – A virtual pixel unit that you should use when defining UI layout, to express layout dimensions or position in a density-independent way
– In LDPI : 1dp = 0.75px – In MDPI : 1dp = 1px – In HDPI : 1dp = 1.5px – In XHDPI : 1dp = 2px – XXHDPI…
76 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Resources (3/5): : Drawables & DPIs
▶ Drawables (=images), depend on dpi – drawable : no density specified – drawable-ldpi : low density devices (~120dpi) – drawable-mdpi : medium density devices (~160dpi) – drawable-hdpi : high density devices (~240dpi) – drawable-xhdpi : extra high density devices (~320dpi) – drawable-xxhdpi : extra extra high density devices (~480dpi)
Nexus 4 ▶ Layout also support multiple screen size : ▶ 4,7 inch – layout-small : ~ 426dp x 320dp Galaxy Ace 3 ▶ Type normal
– layout-normal : ~ 470dp x 320dp ▶ 4 inch ▶ XHDPI ▶ Type normal
– layout-large : ~ 640dp x 480dp Galaxy Y ▶ HDPI ▶ 1280x768px - 3 inch
– layout-xlarge : ~ 960dp x 720dp - Type small ▶ 800x480px
- ldpi ▶ 317dpi ▶ 233dpi – … - 320x240px
- 133dpi
77 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline
An Android app from the inside Resources (3/5): : Calculate density 768px How many pixels for 4,7̋ ?
(7682 + 12802) = 1492, 72px
Which density ?
1280px 1492,72 = 317,6 dpi
4,7
78 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Resources (3/5): Determine size and density
768px ▶ Densities – drawable-ldpi : low density devices (~120dpi) – drawable-mdpi : medium density devices (~160dpi) 384dp – drawable-hdpi : high density devices (~240dpi) – drawable-xhdpi : extra high density devices (~320dpi)
– drawable-xxhdpi : extra extra high density 640
1280 devices (~480dpi) dp
px ▶ Screen size Nexus 4
– layout-small : ~ 426dp x 320dp ▶ 4,7 inch
– layout-normal : ~ 470dp x 320dp ▶ Type normal – layout-large : ~ 640dp x 480dp ▶ XHDPI – layout-xlarge : ~ 960dp x 720dp ▶ 1280x768px 317dpi – … ▶ 317dpi
Remember, in XHDPI, 1dp = 2px
79 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Resources (3/5): How many UI to manage ?
80 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline ANDROID DASHBOARD Exercise Screen densities
Calculate your Smartphone screen size and density
81 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline An Android app from the inside Resources (4/5): management
▶ Internationalization (I18n) – res/values – res/values-fr – res/values-de – …
▶ OS version specific – res/values-v11 – res/values-v14
▶ Size/density dependant – values/w820dp – values/sw600dp SCREEN SIZES (ANDROID DEVELOPPER)
82 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline
An Android app from the inside Resources (5/5): Theme & Style
▶ Located in res/values/style.xml or res/values/theme.xml it’s near CSS class principles :
– Define your own app theme – Change colors – Change component UI
▶ OS version specific theme is possible – res/values/style.xml – res/values-v11/style.xml – …
83 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline
Exercise Your first layout
▶ Create a new layout file My Profile ▶ Use LinearLayout as base ViewGroup
▶ With orientation:vertical Michel Moustache ▶ Translate in English and French Age : 32 City of birth : Arras
Status : First Android ▶ Run on emulator or physical device training today !
Edit profile
84 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline TODO For next week
Android Studio Import your twitter project skeleton 1.3+ Gradle You can download sources at 2.4 Android Gradle Plugin http://awl.li/ISENBaseApp 1.1.0 Build tools 21.1.2 Minimum SDK 14 Targeted SDK 21 SupportV4 version 21.0.+ AppCompat version 21.0.3
85 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline That’s all for Today
▶ Threesome programming next week, – find your partners
▶ Bring your computer
▶ Be ready for 1st Quizz…
Download this presentation here http://awl.li/ISENSession1
86 | 1/6/2016 | Maxime Peron, Bruno Verachten, Ibrahim Gharbi, François Facon © Worldline