writing a simple appevcomp.dcc.ufmg.br/wp-content/uploads/kotlin-firstapp.pdf · android studio -...

WritingaSimpleApp

[email protected]

Whatdoweneedtowriteanapp?

Whatdoweneedtowriteanapp?

- IntegratedDevelopmentEnvironment

- AndroidStudio

- Device- orEmulator

WhichIDEsexistforAndroid?

WhichIDEsexistforAndroid?

- What'swhatabove?

And,whataretheIDEsbelowthatsupportKotlin?

- Anyothers?

VisualStudio

UnrealEngine

AndroidStudio

CoronaLabs IntelliJIDEA

ApacheCordova

And,whataretheIDEsbelowthatsupportKotlin?

AndroidStudio

IntelliJIDEA

- TryKotlin

- Eclipse

- Vim

- SublimeTest

- Atom

- ...

AndroidStudio

- Google,JetBrains- Kotlin,Java,C++

- Freeware- Sourcecode

Google intros Android Studio, an IDE for building appshttps://www.engadget.com/2013/05/15/google-android-studio/ ZachHonig,05.15.13

Google releases Android Studio 1.0, the first stable version of its IDEhttps://venturebeat.com/2014/12/08/google-releases-android-studio-1-0-the-first-stable-version-of-its-ide/ EmilProtalinsk,08.12.14

StartingaProjectonAndroidStudio


RemembertoenableKotlinsupport!


WhichAPItochoose?

TheStructureofaProject

- Whatareeachofthesefilesandfolders?

TheActivityCode

- What'sanActivity?

- Explainthesyntax"Bundle?",e.g.,thequestionmark.

packagecom.example.fernando.helloworld

importandroid.support.v7.app.AppCompatActivityimportandroid.os.Bundle

classMainActivity:AppCompatActivity(){overridefunonCreate(savedInstanceState:Bundle?){super.onCreate(savedInstanceState)setContentView(R.layout.activity_main)}}

TheActivityCode

- What'stheoverridekeyworddoing?

- Whydon'twehavesemicolons?




RunningtheApp

EnablinganAndroidDevicetoRunourApp

1. Onyourdevice,openSettings>AboutphoneandtapBuildnumberseventimes.

EnablinganAndroidDevicetoRunourApp

1. Returntothepreviousscreen(Settings).Developeroptionsappearsatthebottomofthelist.TapDeveloperoptions.

2. EnableUSBDebugging.

RunningtheAppontheDevice

- Clickrun.

Selectthetargetdeviceyouwant

RunningtheAppontheEmulator

- EmulatorsimulatesanactualAndroiddevice

- Incomingcalls- Incomingtextmessages

- Geolocation- Simulatedifferentnetworkspeeds

- Hardwaresensors:- Rotationandbearing

- AccessGooglePlayStore

AndroidVirtualDevice(AVD)

- Hardwarecharacteristics- Softwarecharacteristics- Privatestorage

ThesameemulatorcanrundifferentAndroidVirtualDevices

LaunchingtheEmulator

- Viathecommandline

$cd/Users/pronesto/Library/Android/sdk/emulator$emulator-avdNexus_5X_API_28-netdelaynone-netspeedfull

- Viatheandroidstudio- Run→Runapp


- Viathecommandline

$cd/Users/pronesto/Library/Android/sdk/emulator$emulator-avdNexus_5X_API_28-netdelaynone-netspeedfull

- Viatheandroidstudio- Run→Runapp- Selectthevirtualdevice


- Viatheandroidstudio- Run→Runapp- Selectthevirtualdevice

Andbeaware:startingtheemulatormighttakeforever...

LeavetheEmulatorinStandBy

- Theemulator'sprocessisindependentfromAndroidStudio

- YoucanevenstartitwithoutAS

CreatinganewAndroidVirtualDevice

- Viathecommandline

$cd/Users/pronesto/Library/Android/sdk/tools/bin$avdmanagercreateavd-ntest-k"system-images;android-25;google_apis;x86"


- Viathecommandline


- Viatheandroidstudio- Tools→AVDManager


- Viathecommandline


- Viatheandroidstudio- Tools→AVDManager→+CreateVirtualDevice


- Viathecommandline


- Viatheandroidstudio- Tools→AVDManager→+CreateVirtualDevice

- Youmustselectanimagetodownload


Anotherthingthatcantakeforever...

DEPARTMENTOFCOMPUTERSCIENCEUNIVERSIDADEFEDERALDEMINASGERAIS

FEDERALUNIVERSITYOFMINASGERAIS,BRAZIL

EDITINGTHEACTIVITY

Whatgoesintoeachfolder?

- Let'sstarttakingalookintothelayoutfolder.Whatdoyouthinkwewillfindthere?

Thisviewhasfourparts.Whatarethey?

Canyoupicturethislayout?

<?xml version="1.0" encoding="utf-8"?> <android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity">

<TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Hello World!" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintLeft_toLeftOf="parent" app:layout_constraintRight_toRightOf="parent" app:layout_constraintTop_toTopOf="parent" />

</android.support.constraint.ConstraintLayout>

Whatarethesetwoviews?

DesignEditororTextEditor?

- Bothviewshaveadvantagesanddisadvantages.Canyoulistthem?

Exercise:changethetextview

Whataretheresourcevalues?

- Whatarecolors,stringsandstyles?

- Howcanwecreatenewvalues?

Creatingnewstrings

<resources> <string name="app_name">HelloWorld</string> <string name="hello_Text">Hello World!</string> </resources>

activity_main.xml

strings.xml

Whataretheadvantagesofusingresources?

AddinganewComponenttotheView

HowtoDeterminethePositionoftheButton?

- Forinstance,relativetotheTextView?

HowtoDeterminethePositionoftheButton?

- Forinstance,relativetotheTextView?

<Button android:id="@+id/button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="8dp" android:text="Button" app:layout_constraintTop_toBottomOf="@+id/textView" tools:layout_editor_absoluteX="147dp" />

Playingwiththelayout

- Addasecondbuttontoyourview,andtrytopositionthemusingrelativeconstraitns,liketheblueprintontheright.

PlayingwithAttributes

- Trytochangetheattributesofbuttons.Addnewresourcestoyourcolorpalette.

<?xml version="1.0" encoding="utf-8"?> <resources> <color name="colorPrimary">#3F51B5</color> <color name="colorPrimaryDark">#303F9F</color> <color name="colorAccent">#FF4081</color> <color name="buttonBackground">#BBDEFB</color> </resources>

PlayingwithAttributes

- Trytoarriveatthelayoutontheright§.

§:takenfromhttps://codelabs.developers.google.com/codelabs/build-your-first-android-app-kotlin/index.html#5

DEPARTMENTOFCOMPUTERSCIENCEUNIVERSIDADEFEDERALDEMINASGERAIS

FEDERALUNIVERSITYOFMINASGERAIS,BRAZIL

HANDLINGEVENTS

LinkingJavaandXML

- WhatisthecallsetContentView(...activity_main)doing?




Addingasimpleevent

- Wheneverweclickonthe"TOAST"button,weshalldisplaythe"HellowToast!"message.

- Howtoconnectbuttonandevent?

funtoastMe(view:View){valmyToast=Toast.makeText(this,"HelloToast!",Toast.LENGTH_SHORT)myToast.show()}

Linkingviewandevent

WecanedittheXMLlayoutdirectly

<Button android:id="@+id/toast_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginBottom="8dp" android:layout_marginLeft="24dp" android:layout_marginStart="8dp" android:layout_marginTop="8dp" android:background="@color/buttonBackground" android:onClick="toastMe" android:text="@string/str_toast" android:textSize="18sp" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toBottomOf="@+id/textView" />

AddingtheEventHandlerProgramatically

classMainActivity:AppCompatActivity(){overridefunonCreate(savedInstanceState:Bundle?){super.onCreate(savedInstanceState)setContentView(R.layout.activity_main)valtoastButton=findViewById<Button>(R.id.toast)toastButton.setOnClickListener{toastMe()}}privatefuntoastMe(){valmyToast=Toast.makeText(this,"Hello!",Toast.LENGTH_SHORT)myToast.show()}}

Keepingtrackofstate

- Wewouldliketoadda"countMe"eventontotheapp.

- ItincrementsthetextwheneverwetouchCOUNT

- What'sthestateinthiscase?

- Howtokeeptrackofit?

Implementingthecounter

funcountMe(view:View){//GetthetextviewvalshowCountTextView=findViewById<TextView>(R.id.textView)//Getthevalueofthetextview.valcountString=showCountTextView.text.toString()//Convertvaluetoanumberandincrementitvarcount:Int=Integer.parseInt(countString)count++//Displaythenewvalueinthetextview.showCountTextView.text=count.toString();}

- Howtoconnectbuttonandevent?

Associatingbuttonwithevent

Creatinganewactivity

- Again:what'sanactivity?- WhytohavemultipleactivitiesinanAndroidapp?- CreateanewemptyactivitycalledSecondActivity.

<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.example.fernando.helloworld"> <application android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:roundIcon="@mipmap/ic_launcher_round" android:supportsRtl="true" android:theme="@style/AppTheme"> <activity android:name=".MainActivity"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> <activity android:name=".SecondActivity"></activity> </application> </manifest>

TheManifestFile

- What'sthemeaningofthedifferententriesforactivities?

- What'sthedifferencebetweenMAINandLAUNCHER?

MAIN+LAUNCHER

<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.example.fernando.helloworld"> <application android:allowBackup="true" android:icon="@mipmap/ic_launcher" android:label="@string/app_name" android:roundIcon="@mipmap/ic_launcher_round" android:supportsRtl="true" android:theme="@style/AppTheme"> <activity android:name=".MainActivity"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> <activity android:name=".SecondActivity"></activity> </application> </manifest>

TheCodeoftheSecondActivity

- Let'screatethelayoutforthisactivity.



classSecondActivity:AppCompatActivity(){overridefunonCreate(savedInstanceState:Bundle?){super.onCreate(savedInstanceState)setContentView(R.layout.activity_second)}}

AddingoneTextViewtothelayout

TrytoaddthefollowingTextViewtotheLayout

- Howwouldyouinvokethesecondactivity?

InvokingtheSecondActivity

funrandomMe(view:View){//CreateanIntenttostartthesecondactivityvalrandomIntent=Intent(this,SecondActivity::class.java)//Startthenewactivity.startActivity(randomIntent)}

MainActivity.kt

- AndhowtoassociatethismethodwiththeRANDOMbutton?

Associatingtheobserverwiththehandler

Thusfar,that'sallthatwehave

- Howtogeneratearandomnumberbetween1andcount?

- WeneedtotellSecondActivitywhat'sthevalueofcount.

- Howtodoit?

GlobalVariables

classSecondActivity:AppCompatActivity(){//TOTAL_COUNTislikeastaticvariableinjavacompanionobject{constvalTOTAL_COUNT="total_count"}

overridefunonCreate(savedInstanceState:Bundle?){...}}

SecondActivity.kt

- WestillneedtotellSecondActivitywhat'sthevalueofcount.

- Howtousetheglobalvariabletodoit?

Senddatafromanactivitytoanother

funrandomMe(view:View){//CreateanIntenttostartthesecondactivityvalrandomIntent=Intent(this,SecondActivity::class.java)

//GetthetextviewvalshowCountTextView=findViewById<TextView>(R.id.textView)

//Getthevalueofthetextview.valcountString=showCountTextView.text.toString()

//Convertthecounttoanintvalcount=Integer.parseInt(countString)

//AddthecounttotheextrasfortheIntent.randomIntent.putExtra(SecondActivity.TOTAL_COUNT,count)

//Startthenewactivity.startActivity(randomIntent)}

MainActivity.kt

Gettinginfofromanotheractivity

- Now,SecondActivityneedstogettheinformationpassedbyMainActivity,anduseitasthelimittotherandomnumberthatitwilldisplay.- Howtodoit?

Displayingtherandomnumber

classSecondActivity:AppCompatActivity(){companionobject{constvalTOTAL_COUNT="total_count"}

overridefunonCreate(savedInstanceState:Bundle?){super.onCreate(savedInstanceState)setContentView(R.layout.activity_second)showRandomNumber()}

funshowRandomNumber(){...}}

SecondActivity.kt

- WeneedtoimplementshowRandomNumber...

Displayingtherandomnumber

funshowRandomNumber(){//Getthecountfromtheintentextrasvalcount=intent.getIntExtra(TOTAL_COUNT,0)

//Generatetherandomnumbervalrandom=Random()varrandomInt=0

if(count>0){//AddonebecausetheboundisexclusiverandomInt=random.nextInt(count+1)}

//Displaytherandomnumber.findViewById<TextView>(R.id.textview_random).text=Integer.toString(randomInt)

//Substitutethemaxvalueintothestringresource//fortheheading,andupdatetheheadingfindViewById<TextView>(R.id.textview_label).text=getString(R.string.random_heading,count)}

SecondActivity.kt

Whatarethesetwoparameters?

Buildingstrings

<resources>...<stringname="random_heading">Hereisarandomnumberbetween0and%1d.</string></resources>

strings.xml

writing a simple appevcomp.dcc.ufmg.br/wp-content/uploads/kotlin-firstapp.pdf · android studio -...

Documents