The document discusses a CodeLab on Android Wear. It includes an agenda for the CodeLab that covers creating a new project, adding libraries, layouts for smartwatches, communication with smartphones, and multi-fragment layouts. It provides code examples for creating WatchViewStubs, communicating between the mobile and wear modules using Teleport, and implementing a GridViewPager with fragments. The CodeLab aims to demonstrate building a simple survey app with Android Wear, including syncing data and updating the UI in response to changes.

1. Android Wear CodeLab
GDG Firenze
Fabio Collini

2. Android Wear CodeLab – November 2015 – @fabioCollini 2
Ego slide
@fabioCollini
linkedin.com/in/fabiocollini
Folder Organizer
cosenonjaviste.it
nana bianca
Freapp
instal.com
Rain tomorrow?

3. Android Wear CodeLab – November 2015 – @fabioCollini 3
Agenda
1. Android Wear
2. Creazione nuovo progetto
3. Aggiunta librerie
4. Layout per smartwatch
5. Comunicazione con smartphone
6. Layout multi fragment

4. Android Wear CodeLab - November 2015 - @fabioCollini 4
Android Wear
1

5. Android Wear CodeLab – November 2015 – @fabioCollini 5
Android Wear
Notifiche
Watch faces
Wear apps

6. Android Wear CodeLab – November 2015 – @fabioCollini 6
Citymapper

7. Android Wear CodeLab – November 2015 – @fabioCollini 7

8. Android Wear CodeLab - November 2015 - @fabioCollini 8
2Creazione nuovo progetto

9. Android Wear CodeLab – November 2015 – @fabioCollini 9
Wizard creazione nuovo progetto

10. Android Wear CodeLab – November 2015 – @fabioCollini 10
Due moduli nel progetto

11. Android Wear CodeLab - November 2015 - @fabioCollini 11
3Aggiunta librerie

12. Android Wear CodeLab – November 2015 – @fabioCollini 12
Progetto su github
https://github.com/fabioCollini/AndroidWearCodeLab

13. Android Wear CodeLab – November 2015 – @fabioCollini 13
App smartphone

14. Android Wear CodeLab - November 2015 - @fabioCollini 14
4Layout per smartwatch

15. Android Wear CodeLab – November 2015 – @fabioCollini 15
WatchViewStub
<?xml version="1.0" encoding="utf-8"?>
<android.support.wearable.view.WatchViewStub
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:id="@+id/watch_view_stub"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:rectLayout="@layout/rect_activity_main"
app:roundLayout="@layout/round_activity_main"
tools:context=".MainActivity"
tools:deviceIds="wear">

16. Android Wear CodeLab – November 2015 – @fabioCollini 16
WearableFrameLayout
<android.support.wearable.view.WearableFrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:layout_height="@dimen/watch_face_width"
android:layout_width="@dimen/watch_face_width"
android:layout_marginTop="@dimen/watch_face_margin_top"
app:layout_heightRound="@dimen/watch_face_circular_size"
app:layout_widthRound="@dimen/watch_face_circular_size"
app:layout_marginTopRound="@dimen/watch_face_circular_margin_top"
app:layout_gravityRound=“center_horizontal" />
</android.support.wearable.view.WearableFrameLayout>

17. Android Wear CodeLab – November 2015 – @fabioCollini 17
BoxInsetLayout
Gestisce il padding di un layout adattandolo a
smartwatch quadrati e rotondi
Il layout contenuto specifica quali lati gestire (per
esempio con app:layout_box=“all”)
Non deve contenere un padding specificato

18. Android Wear CodeLab – November 2015 – @fabioCollini 18
Layout risposta sondaggio

19. Android Wear CodeLab - November 2015 - @fabioCollini 19
5Comunicazione con
smartphone

20. Android Wear CodeLab – November 2015 – @fabioCollini 20
GoogleApiClient
DataApi
MessageApi
NodeApi
CapabilityApi
ChannelApi

21. Android Wear CodeLab – November 2015 – @fabioCollini 21
Teleport
Data Sync & Messaging Library for Android Wear

22. Android Wear CodeLab – November 2015 – @fabioCollini 22
TeleportClient
public class MobileActivity extends Activity {
private TeleportClient teleportClient;
@Override protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.my_layout);
teleportClient = new TeleportClient(this);
}
@Override protected void onStart() {
super.onStart();
teleportClient.connect();
}
@Override protected void onStop() {
super.onStop();
teleportClient.disconnect();
}
}

23. Android Wear CodeLab – November 2015 – @fabioCollini 23
ClickListener
Aggiungere il click listener sui due button che
mandano un messaggio usando teleportClient

24. Android Wear CodeLab – November 2015 – @fabioCollini 24
Service
public class MyService extends TeleportService {
private SurveyManager surveyManager;
@Override public void onCreate() {
super.onCreate();
surveyManager = new SurveyManager(this);
setOnGetMessageCallback(new MyOnGetMessageCallback());
}
private class MyOnGetMessageCallback extends OnGetMessageCallback {
@Override public void onCallback(String s) {
…
setOnGetMessageCallback(new MyOnGetMessageCallback());
}
}
}

25. Android Wear CodeLab – November 2015 – @fabioCollini 25
Mobile manifest
<service android:name=".MyService" android:enabled="true"
android:exported="true">
<intent-filter>
<action android:name=
"com.google.android.gms.wearable.BIND_LISTENER"/>
</intent-filter>
</service>

26. Android Wear CodeLab – November 2015 – @fabioCollini 26
Activity di conferma
Intent intent = new Intent(getActivity(),
ConfirmationActivity.class);
intent.putExtra(ConfirmationActivity.EXTRA_ANIMATION_TYPE,
ConfirmationActivity.SUCCESS_ANIMATION);
intent.putExtra(ConfirmationActivity.EXTRA_MESSAGE,
getString(R.string.answer_sent));
startActivity(intent);
<activity android:name=
"android.support.wearable.activity.ConfirmationActivity" />

27. Android Wear CodeLab - November 2015 - @fabioCollini 27
6Layout multi fragment

28. Android Wear CodeLab – November 2015 – @fabioCollini 28
Activity -> Fragment
Spostare tutto il codice in una nuova classe
Creazione del layout in onCreateView usando
inflater.inflate(R.layout.answer, container, false);
Metodi protected -> public
this -> getActivity()

29. Android Wear CodeLab – November 2015 – @fabioCollini 29
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id=“@+id/root"
android:layout_width="match_parent"
android:layout_height="match_parent">
<fragment
android:name="it.cosenonjaviste.mywearapp.AnswerFragment"
android:layout_width="match_parent"
android:layout_height=“match_parent"/>
</FrameLayout>

30. Android Wear CodeLab – November 2015 – @fabioCollini 30
GridViewPager & DotsPageIndicator
<FrameLayout
….
>
<android.support.wearable.view.GridViewPager
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
<android.support.wearable.view.DotsPageIndicator
android:id="@+id/page_indicator"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal|bottom"
android:layout_marginBottom="10dp"/>
</FrameLayout>

31. Android Wear CodeLab – November 2015 – @fabioCollini 31
FragmentGridPagerAdapter
Tre metodi da implementare:
• getRowCount
• getColumnCount
• getFragment(int row, int column)

32. Android Wear CodeLab – November 2015 – @fabioCollini 32
Activity
GridViewPager pager =
(GridViewPager) findViewById(R.id.pager);
pager.setAdapter(new MyAdapter(getFragmentManager()));
DotsPageIndicator dotsPageIndicator =
(DotsPageIndicator) findViewById(R.id.page_indicator);
dotsPageIndicator.setPager(pager);

33. Android Wear CodeLab – November 2015 – @fabioCollini 33
survey_detail.xml

34. Android Wear CodeLab – November 2015 – @fabioCollini 34
Survey detail fragment
onCreate
aggiunge un listener sul sync per aggiornare la UI
onStart
invia un messaggio di start allo smartphone
onStop
invia un messaggio di stop allo smartphone

35. Android Wear CodeLab – November 2015 – @fabioCollini 35
Service su mobile
Messaggio di start
surveyManager.addValueEventListener per
eseguire un sync ogni volta che cambiano i dati
su Firebase usando
syncString("survey", survey.toJson());
Messaggio di stop
surveyManager.removeEventListener

36. Android Wear CodeLab – November 2015 – @fabioCollini 36
Sync su wear
Prendere la stringa con il json dal dataMap
Eseguire il parsing usando Survey.parse
Aggiornare la ui con i dati

37. Android Wear CodeLab – November 2015 – @fabioCollini 37
Thanks for your attention!
androidavanzato.it
Questions?