Google Development and Design - Cebu Google DevFest 2013

131
Keith Levi Lumanog Mobile and Web Developer www.micab.co

description

http://devfest.gdgcebu.org/2013/09/gdg-devfest-cebu-2013-agenda.html

Transcript of Google Development and Design - Cebu Google DevFest 2013

Page 1: Google Development and Design - Cebu Google DevFest 2013

Keith Levi LumanogKeith Levi LumanogMobile and Web DeveloperMobile and Web Developer

www.micab.cowww.micab.co

Page 2: Google Development and Design - Cebu Google DevFest 2013

Intro on Android DevtIntro on Android DevtBuilding Mobile AppsBuilding Mobile Apps

Page 3: Google Development and Design - Cebu Google DevFest 2013

Android VersionsAndroid Versions

Page 4: Google Development and Design - Cebu Google DevFest 2013

Android User BaseAndroid User Base“Every day more than 1 million new Android devices are activated worldwide.”

“Every day more than 1 million new Android devices are activated worldwide.”

Page 5: Google Development and Design - Cebu Google DevFest 2013

Why learn Android?Why learn Android?Cool FactorCool Factor

Page 6: Google Development and Design - Cebu Google DevFest 2013

Why learn Android?Why learn Android?Easy to LearnEasy to Learn

String s2 = s1.replace(“abc”,”xyz”);String s2 = s1.replace(“abc”,”xyz”);

NSString *s2 = [s1 stringByReplacingOccurrencesOfString:@"abc"

withString:@"xyz"];

NSString *s2 = [s1 stringByReplacingOccurrencesOfString:@"abc"

withString:@"xyz"];

Page 7: Google Development and Design - Cebu Google DevFest 2013

Why learn Android?Why learn Android?Web Development are too mainstreamWeb Development are too mainstream

Not just for MobileNot just for Mobile

Fully DocumentedFully Documented

Page 8: Google Development and Design - Cebu Google DevFest 2013

Why learn Android?Why learn Android?

SweldoSweldoJunior - 12,000Junior - 12,000

Mid Level - 20,000Mid Level - 20,000

Senior - 60,000Senior - 60,000

Page 9: Google Development and Design - Cebu Google DevFest 2013

Android ToolsAndroid Tools

Page 10: Google Development and Design - Cebu Google DevFest 2013

Android ToolsAndroid Tools

IntelliJ IDEAIntelliJ IDEA Android StudioAndroid Studio

Page 11: Google Development and Design - Cebu Google DevFest 2013

Android Development

Android DevelopmentNOTE TAKING APP FROM SCRATCHNOTE TAKING APP FROM SCRATCH

Page 12: Google Development and Design - Cebu Google DevFest 2013

Create an android project

Create an android project

Page 13: Google Development and Design - Cebu Google DevFest 2013
Page 14: Google Development and Design - Cebu Google DevFest 2013
Page 15: Google Development and Design - Cebu Google DevFest 2013
Page 16: Google Development and Design - Cebu Google DevFest 2013
Page 17: Google Development and Design - Cebu Google DevFest 2013
Page 18: Google Development and Design - Cebu Google DevFest 2013
Page 19: Google Development and Design - Cebu Google DevFest 2013

Right ClickRight Click

Page 20: Google Development and Design - Cebu Google DevFest 2013
Page 21: Google Development and Design - Cebu Google DevFest 2013
Page 22: Google Development and Design - Cebu Google DevFest 2013

Exercise : Create UI like shown belowExercise : Create UI like shown below

Page 23: Google Development and Design - Cebu Google DevFest 2013

SolutionSolution

Page 24: Google Development and Design - Cebu Google DevFest 2013

Creating the appCreating the app

Page 25: Google Development and Design - Cebu Google DevFest 2013
Page 26: Google Development and Design - Cebu Google DevFest 2013

1. get the text from two input

fields

1. get the text from two input

fields

Page 27: Google Development and Design - Cebu Google DevFest 2013

Double click the textbox to switch to XML view

Double click the textbox to switch to XML view

set id = etTitleset id = etTitle set id = etNoteset id = etNote

Page 28: Google Development and Design - Cebu Google DevFest 2013
Page 29: Google Development and Design - Cebu Google DevFest 2013
Page 30: Google Development and Design - Cebu Google DevFest 2013

exercise #2Do the same thing for “Note” EditText

exercise #2Do the same thing for “Note” EditText

Page 31: Google Development and Design - Cebu Google DevFest 2013

Solution

Page 32: Google Development and Design - Cebu Google DevFest 2013

exercise #3set reference to

save button

Page 33: Google Development and Design - Cebu Google DevFest 2013

solutionsolution

Page 34: Google Development and Design - Cebu Google DevFest 2013

onclick listenersonclick listeners

Page 35: Google Development and Design - Cebu Google DevFest 2013
Page 36: Google Development and Design - Cebu Google DevFest 2013
Page 37: Google Development and Design - Cebu Google DevFest 2013
Page 38: Google Development and Design - Cebu Google DevFest 2013
Page 39: Google Development and Design - Cebu Google DevFest 2013
Page 40: Google Development and Design - Cebu Google DevFest 2013
Page 41: Google Development and Design - Cebu Google DevFest 2013
Page 42: Google Development and Design - Cebu Google DevFest 2013

WHAT’S WRONG WITH THE CODE?

WHAT’S WRONG WITH THE CODE?

Page 43: Google Development and Design - Cebu Google DevFest 2013
Page 44: Google Development and Design - Cebu Google DevFest 2013

SAVING DATASAVING DATA

Page 45: Google Development and Design - Cebu Google DevFest 2013
Page 46: Google Development and Design - Cebu Google DevFest 2013
Page 47: Google Development and Design - Cebu Google DevFest 2013
Page 48: Google Development and Design - Cebu Google DevFest 2013

when opening a file, always close it!when opening a file, always close it!

Page 49: Google Development and Design - Cebu Google DevFest 2013
Page 50: Google Development and Design - Cebu Google DevFest 2013

DDMS modeDDMS mode

Page 51: Google Development and Design - Cebu Google DevFest 2013
Page 52: Google Development and Design - Cebu Google DevFest 2013
Page 53: Google Development and Design - Cebu Google DevFest 2013
Page 54: Google Development and Design - Cebu Google DevFest 2013

return to previous perspective

return to previous perspective

Page 55: Google Development and Design - Cebu Google DevFest 2013

create new activitycreate new activity

Page 56: Google Development and Design - Cebu Google DevFest 2013
Page 57: Google Development and Design - Cebu Google DevFest 2013
Page 58: Google Development and Design - Cebu Google DevFest 2013
Page 59: Google Development and Design - Cebu Google DevFest 2013
Page 60: Google Development and Design - Cebu Google DevFest 2013

MainActivity.javaMainActivity.java

Page 61: Google Development and Design - Cebu Google DevFest 2013

Run and TestRun and Test

Page 62: Google Development and Design - Cebu Google DevFest 2013
Page 63: Google Development and Design - Cebu Google DevFest 2013
Page 64: Google Development and Design - Cebu Google DevFest 2013

Exercise #4 add new activity in manifest fileExercise #4 add new

activity in manifest file

Page 65: Google Development and Design - Cebu Google DevFest 2013
Page 66: Google Development and Design - Cebu Google DevFest 2013

Run and Test

Page 67: Google Development and Design - Cebu Google DevFest 2013
Page 68: Google Development and Design - Cebu Google DevFest 2013
Page 69: Google Development and Design - Cebu Google DevFest 2013
Page 70: Google Development and Design - Cebu Google DevFest 2013
Page 71: Google Development and Design - Cebu Google DevFest 2013
Page 72: Google Development and Design - Cebu Google DevFest 2013
Page 73: Google Development and Design - Cebu Google DevFest 2013
Page 74: Google Development and Design - Cebu Google DevFest 2013

Run and TestRun and Test

Page 75: Google Development and Design - Cebu Google DevFest 2013

exercise #5exercise #5Read the file without overriding the current file dataRead the file without overriding the current file data

Page 76: Google Development and Design - Cebu Google DevFest 2013

use String builderuse String builder

Page 77: Google Development and Design - Cebu Google DevFest 2013

finishing touchesfinishing touches

READACTIVITY.JAVAREADACTIVITY.JAVA

Page 78: Google Development and Design - Cebu Google DevFest 2013

mainactivity.javamainactivity.java

Page 79: Google Development and Design - Cebu Google DevFest 2013

main.xmlmain.xml

Page 80: Google Development and Design - Cebu Google DevFest 2013

Android SMS APIAndroid SMS APISend and Receive SMS programmaticallySend and Receive SMS programmatically

Page 81: Google Development and Design - Cebu Google DevFest 2013
Page 82: Google Development and Design - Cebu Google DevFest 2013
Page 83: Google Development and Design - Cebu Google DevFest 2013

Android SMS APIAndroid SMS APISend any message to this number:Send any message to this number:

0926.650.96920926.650.9692

Page 84: Google Development and Design - Cebu Google DevFest 2013

AndroidAndroidUser Interface and ExperienceUser Interface and Experience

Page 85: Google Development and Design - Cebu Google DevFest 2013

AndroidAndroid Devices and DisplaysDevices and Displays

Page 86: Google Development and Design - Cebu Google DevFest 2013

AndroidAndroid Devices and DisplaysDevices and Displays

Page 87: Google Development and Design - Cebu Google DevFest 2013

AndroidAndroid Devices and DisplaysDevices and Displays

Page 88: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Multiple Views Into OneMultiple Views Into One

Page 89: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Multiple Views Into OneMultiple Views Into One

Page 90: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Orientation ChangesOrientation Changes

Page 91: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Don’t Mimic!Don’t Mimic!

Android, iOS and Windows Phone 7.Android, iOS and Windows Phone 7.

Page 92: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Don’t Mimic!Don’t Mimic!

Android, iOS and Windows Phone 7.Android, iOS and Windows Phone 7.

Page 93: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Don’t Mimic!Don’t Mimic!

Page 94: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Don’t Mimic!Don’t Mimic!

Page 95: Google Development and Design - Cebu Google DevFest 2013

Make Targets Fingertip-SizeMake Targets Fingertip-Size

target area of about 44 x 44 points.target area of about 44 x 44 points.

MobileMobile

Page 96: Google Development and Design - Cebu Google DevFest 2013

Make Targets Fingertip-SizeMake Targets Fingertip-Size

target area of about 44 x 44 points.target area of about 44 x 44 points.

MobileMobile

Page 97: Google Development and Design - Cebu Google DevFest 2013

Notify UsersNotify UsersMobileMobile

Page 98: Google Development and Design - Cebu Google DevFest 2013

7-second rule7-second ruleMobileMobile

Page 99: Google Development and Design - Cebu Google DevFest 2013

7-second rule7-second ruleMobileMobile

Page 100: Google Development and Design - Cebu Google DevFest 2013

Pop Overs and SidebarsPop Overs and SidebarsMobileMobile

Page 101: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Pop Overs and SidebarsPop Overs and Sidebars

Page 102: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Pop Overs and SidebarsPop Overs and Sidebars

Page 103: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Lists and TablesLists and Tables

Page 104: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Lists and TablesLists and Tables

Page 105: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Search StylesSearch Styles

Page 106: Google Development and Design - Cebu Google DevFest 2013

MobileMobile MapsMaps

Page 107: Google Development and Design - Cebu Google DevFest 2013

MobileMobile MapsMaps

Page 108: Google Development and Design - Cebu Google DevFest 2013

MobileMobile GalleriesGalleries

Page 109: Google Development and Design - Cebu Google DevFest 2013

MobileMobile GalleriesGalleries

Page 110: Google Development and Design - Cebu Google DevFest 2013

MobileMobile GalleriesGalleries

Page 111: Google Development and Design - Cebu Google DevFest 2013

MobileMobile GalleriesGalleries

Page 112: Google Development and Design - Cebu Google DevFest 2013

MobileMobile No DataNo Data

Page 113: Google Development and Design - Cebu Google DevFest 2013

MobileMobile No DataNo Data

Page 114: Google Development and Design - Cebu Google DevFest 2013

MobileMobile StatisticsStatistics

Page 115: Google Development and Design - Cebu Google DevFest 2013

MobileMobile ActivityActivity

Page 116: Google Development and Design - Cebu Google DevFest 2013

MobileMobile ActivityActivity

Page 117: Google Development and Design - Cebu Google DevFest 2013

MobileMobile ActivityActivity

Page 118: Google Development and Design - Cebu Google DevFest 2013

MobileMobile SignupSignup

Page 119: Google Development and Design - Cebu Google DevFest 2013

MobileMobile SignupSignup

Page 120: Google Development and Design - Cebu Google DevFest 2013

MobileMobile SignupSignup

Page 121: Google Development and Design - Cebu Google DevFest 2013

MobileMobile SignupSignup

Page 122: Google Development and Design - Cebu Google DevFest 2013

MobileMobile SignupSignup

Page 123: Google Development and Design - Cebu Google DevFest 2013

MobileMobile ProfilesProfiles

Page 124: Google Development and Design - Cebu Google DevFest 2013

MobileMobile ProfilesProfiles

Page 125: Google Development and Design - Cebu Google DevFest 2013

Colors and TypographyColors and Typography

Page 126: Google Development and Design - Cebu Google DevFest 2013

Colors and TypographyColors and Typography

Page 127: Google Development and Design - Cebu Google DevFest 2013

Don’t be afraid to go out of the

box

Don’t be afraid to go out of the

box

Page 128: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Out of the BoxOut of the Box

Page 129: Google Development and Design - Cebu Google DevFest 2013

MobileMobile Out of the BoxOut of the Box

Page 130: Google Development and Design - Cebu Google DevFest 2013

Your only limit is your imagination

Your only limit is your imagination

Execute Fast!Execute Fast!

Page 131: Google Development and Design - Cebu Google DevFest 2013

Thank You!Thank You!

@keithics or [email protected]@keithics or [email protected]