WORKSHOP
SECOMP UNESP 2016
19/10/2016
Ok, Google.
Como fazer um aplicativo
Android Wear?

Cesar A. Nogueira
Analista de Software
Instituto de Pesquisas Eldorado
SouJava Campinas JUG Leader
Ex-estagiário de Engenharia de Software na
IBM Lenexa, KS - USA
www.cesarnogueira.me

UI baseada em um
stream de cards

Clima Trânsito Lembretes Vôos
Batimentos
Cardíacos
Atender/rejeitar
ligações
Busca por voz

Navegação Música
Navegação
sem mobile
Música sem
mobile
Lembretes
Voice
memos

UX para wear
NÃO é UX
para um
(mini)
smartphone
http://minuum.com/typing-on-android-wear/

Lançadas
automaticamente
Glanceable
Princípios de UI
Micro-interações

Princípios de UI
Não interrompa
o usuário…
Crie grandes áreas de toque
Não seja um
“shoulder tapper"

Desenvolvendo para Android Wear

Android Wear
SmartWatch
ou Emulador
O que vamos precisamos?
Android
Studio

Escolha seu modelo
LG
G Watch R
Motorola
Moto 360
LG Watch
Urban Silver

Escolha seu modelo
Asus
ZenWatch
LG G
Watch
Samsung
Gear Live
Sony
SmartWatch 3

Android Wear App

Digite no Terminal
adb forward tcp:5601 localabstract:/adb-hub
adb connect localhost:5601
Caso não dê certo com a porta 5601,
tente com outra porta:
adb forward tcp:4444 localabstract:/adb-hub
adb connect localhost:4444

adb -d forward tcp:5601 tcp:5601

Depuração USB ou Bluetooth
adb forward tcp:4444 localabstract:/adb-hub; adb connect localhost:4444

Notificações
Sincronizadas
Comandos
de Voz
Aplicações
Wear
Envio e sincronização
de dados
APIs

Notificações
Sincronizadas
Comandos
de Voz
Aplicações
Wear
Envio e sincronização
de dados
APIs

Notificações simples

Notificações com ação

Notificações com ação
✓ Se quiser a ação no mobile e no wearable, use
a classe NotificationCompat.Action.
✓ Se quiser a ação apenas no wearable use o
método addAction(Action) da classe
NotificationCompat.WearableExtender.

Notificações empilhadas

Notificações com páginas

Detalhes sobre notificações…
✓ Notificações disparadas pelo mobile,
são exibidas no mobile e no wear, mas
são executadas no mobile.
✓ Notificações disparadas pelo wear, só
são
exibidas e executadas no wear.
✓ Você pode exibir notificações apenas no
mobile ou apenas no wear.

Notificações
Sincronizadas
Comandos
de Voz
Aplicações
Wear
Envio e sincronização
de dados
APIs

Respondendo com voz

Comandos de voz
Call me a car/taxi Take a note
Set alarm for 8 AM Set timer for 10 minutes
Start/stop bike Start/stop a run
Start/stop workout Show heart rate
Show step count App Name :)
https://developer.android.com/training/wearables/apps/voice.html

Notificações
Sincronizadas
Comandos
de Voz
Aplicações
Wear
Envio e sincronização
de dados
APIs

Aplicações Wear
MinhaApp
MobileAPK WearAPK

Dependências
dependencies {
compile
wearApp
compile
compile
fileTree(dir: 'libs', include: ['*.jar']) project(':wear')
‘com.android.support:appcompat-v7:23.+'
'com.google.android.gms:play-services-wearable:+'
}
dependencies {
compile
compile
compile
fileTree(dir: 'libs', include: ['*.jar'])
'com.google.android.support:wearable:1.3.0'
'com.google.android.gms:play-services-wearable:+'
}

Componentes
android.support.wearable.view
WatchViewStub
BoxInsetLayout
WearableListView
CircledImageView
GridViewPager
GridPagerAdapter
FragmentGridPagerAdapter
CardFragment
DelayedConfirmationView
ConfirmationActivity
DismissOverlayView

Tela Quadrada
ou Redonda?

Tela Quadrada ou
Redonda?

BoxInsetLayout

<android.support.wearable.view.WatchViewStub
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/watch_view_stub"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:rectLayout="@layout/rect_activity_main_wear"
app:roundLayout="@layout/round_activity_main_wear">
</android.support.wearable.view.WatchViewStub>
res/layout/rect_activity_main_wear.xml
res/layout/round_activity_main_wear.xml

WearableListView
WearableListView
WearableListView.ClickListener
WearableListView.Adapter
CircledImageView

GridViewPager
GridViewPager
GridPagerAdapter
FragmentGridPagerAdapter
CardFragment
CardFrame

2D
Picker

Estrutura de um app wear
2D
Picker

DelayedConfirmationView

<android.support.wearable.view.DelayedConfirmationView
android:id="@+id/delayed_confirm"
android:layout_width="40dp" android:layout_height="40dp"
android:src="@drawable/cancel_circle"
app:circle_border_color="@color/lightblue"
app:circle_border_width="4dp" app:circle_radius=“16dp"/>
DelayedConfirmationView mDelayedView =
(DelayedConfirmationView) findViewById(R.id.delayed_confirm);
mDelayedView.setListener(
new DelayedConfirmationView.DelayedConfirmationListener(){
@Override
public void onTimerFinished(View view) {
}
onTimerSelected(View view) {
@Override
public void
}
});

ConfirmationActivity
Intent intent = new Intent(context,
ConfirmationActivity.class);
intent.putExtra(ConfirmationActivity.EXTRA_ANIMATION_TYPE,
ConfirmationActivity.SUCCESS_ANIMATION);
intent.putExtra(ConfirmationActivity.EXTRA_MESSAGE,
getString(R.string.msg_sent));
context.startActivity(intent);

My app
always-on!!!

public class MainWearActivity extends WearableActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main_wear);
setAmbientEnabled();
...}
@Override
public void onEnterAmbient(Bundle ambientDetails) {
super.onEnterAmbient(ambientDetails);
}
@Override
public void onExitAmbient() {
super.onExitAmbient();
@Override
public void onUpdateAmbient() {
super.onUpdateAmbient();
}
}

DismissOverlayView
<style name="AppTheme" parent="Theme.DeviceDefault">
name="android:windowSwipeToDismiss">false</item><item
</style>

Notificações
Sincronizadas
Comandos
de Voz
Aplicações
Wear
Envio e sincronização
de dados
APIs

Comunicação Mobile/Wear
MinhaApp
MobileAPK WearAP
K

Google Play Services
compile ‘com.google.android.gms:play-services-wearable:9.6.1’
<meta-data android:name="com.google.android.gms.version"
android:value="@integer/google_play_services_version" />
GoogleApiClient googleApiClient =
new GoogleApiClient.Builder(context)
.addApi(Wearable.API)
.addConnectionCallbacks(cc)
.addOnConnectionFailedListener(cfl)
.build();

Node API
Message API
Data API
Channel API

Wearable.NodeApi.getConnectedNodes(mGoogleApiClient).setResultCallback(
new ResultCallback<NodeApi.GetConnectedNodesResult>() {
@Override
public void onResult(NodeApi.GetConnectedNodesResult result) { Node
node = result.getNodes().get(0);
}
});
Wearable.NodeApi.addListener(
mGoogleApiClient, new NodeApi.NodeListener() {
@Override
public void onPeerConnected(Node node) {
}
onPeerDisconnected(Node node) {
@Override
public void
}
});
Node API

Wearable.MessageApi.sendMessage(mGoogleApiClient,
node.getId(), "/mensagens", new byte[]{ 1, 2, 3 } );
Message API
Wearable.MessageApi.addListener(mGoogleApiClient,
new MessageApi.MessageListener() {
@Override
public void onMessageReceived(MessageEvent messageEvent) {
String
String
byte[]
remetente = messageEvent.getSourceNodeId();
caminho = messageEvent.getPath();
dados = messageEvent.getData();
}
});

PutDataMapRequest putDataMapRequest =
PutDataMapRequest.create("/dados");
DataMap dataMap = putDataMapRequest.getDataMap();
dataMap.putInt("numero",
dataMap.putString("nome",
1);
"Glauber");
Wearable.DataApi.putDataItem( mGoogleApiClient,
putDataMapRequest.asPutDataRequest());
Data API

Wearable.DataApi.addListener(mGoogleApiClient,
new DataApi.DataListener() {
@Override
public void onDataChanged(DataEventBuffer dataEvents) {
for (DataEvent dataEvent : dataEvents){
if (dataEvent.getType() == DataEvent.TYPE_CHANGED){
DataMapItem dataMapItem =
DataMapItem.fromDataItem(dataEvent.getDataItem()); Uri uri =
dataMapItem.getUri();
if (uri.getPath().equals("/dados")) {
DataMap dataMap = dataMapItem.getDataMap();
int numero
String nome
= dataMap.getInt("numero");
= dataMap.getString("nome");
}
}
}
}
});

WearableListenerService extends
Service implements
NodeApi.NodeListener,
MessageApi.MessageListener,
DataApi.DataListener
Node API
Message API
Data API
<service android:name=“com.example.android.MeuService”>
<intent-filter>
<action
android:name="com.google.android.gms.wearable.BIND_LISTENER"/>
</intent-filter>
</service>

Channel API
API usada para enviar
arquivos de
dispositivo wearable para um
outro wearable or celular.

Maps!

WatchFaces

Funcionar em telas redondas e quadradas
Pense no modo interativo e ambiente
Use preto e branco para telas
OLED em modo ambiente e
mantenha 95% dos pixels pretos

Acomode bem os
elementos do sistema
Adicione configurações ao
aplicativo do Android Wear

•Android Wear para iOS já está disponível
para iPhone 5 ou superior.
•Alguns dos relógios que suportam iOS:
✓ ASUS ZenWatch 2
✓ Huawei Watch
✓ LG Watch Urbane
✓ Moto 360 (2nd Gen)
✓ Moto 360 for Women
✓ Moto 360 Sport.

http://developer.android.com/training/building-wearables.html

Dúvidas?

Cesar A. Nogueira
Analista de Software
Instituto de Pesquisas Eldorado
SouJava Campinas JUG Leader
@cesarnogcps
+CesarAugustoNogueira
www.cesarnogueira.me
Obrigado,
SECOMP Unesp 2016