conhecendo o android wear
TRANSCRIPT
Conhecendo o
+Nelson Glauber@nglauber nglauber.blogspot.com
Android Wear
Nelson GlauberEngenheiro de Sistemas do C.E.S.A.R.
Professor da Unibratec GDE Android 2014
@nglauber +NelsonGlauber
nglauber.blogspot.com
Conhecendo o Android Wear
https://github.com/nglauber/NextLevelApps
125 vezes ao dia em média!!!
Vida realPega o telefone
Devagando no telefone
Mais tempo para interagir com as pessoas à sua volta
Serve para que?
Android Wear estende a plataforma Android para uma nova geração de dispositivos, com uma usabilidade desenhada especificamente para os wearables.
UI baseada em um stream de cards
Comandos de voz
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
Lançadas automaticamente Glanceable
Princípios de UI
Sugestão e demanda Micro-interações
Princípios de UI
Não interrompa o usuário… Crie grandes áreas de toque
Não seja um “shoulder tapper"
Estrutura de um app wear
Notificações simples
Notificações contextuais
Estrutura de um app wear
2D Picker
Estrutura de um app wear
2D Picker
Estrutura de um app wear
1. Exibe um card 2. Clica na ação do card
3. Exibe activity em full-screen
4. Quando a activity terminar, volta ao fluxo de
cards
Desenvolvendo para Android Wear
O que precisamos?
Android Wear Device
Android Wear App
O que precisamos?
Android Studio
LG G Watch
Samsung Gear Live
Motorola Moto 360
Escolha seu modelo
LG G Watch R
Sony SmartWatch 3
Asus ZenWatch
O que precisamos?
Android Wear App
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 a car/taxi Take a note
Set alarm Set timer
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 fileTree(dir: 'libs', include: ['*.jar']) wearApp project(':wear') compile 'com.android.support:appcompat-v7:21.0.2' compile 'com.google.android.gms:play-services-wearable:6.5.87' }
dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) compile 'com.google.android.support:wearable:1.1.0' compile 'com.google.android.gms:play-services-wearable:6.5.87' }
WatchViewStub BoxInsetLayout
WearableListView CircledImageView GridViewPager
GridPagerAdapter FragmentGridPagerAdapter
CardFragment DelayedConfirmationView ConfirmationActivity DismissOverlayView
Componentesandroid.support.wearable.view
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
DelayedConfirmationView
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"> </android.support.wearable.view.DelayedConfirmationView>
DelayedConfirmationView mDelayedView = (DelayedConfirmationView) findViewById(R.id.delayed_confirm);
mDelayedView.setListener( new DelayedConfirmationView.DelayedConfirmationListener(){ @Override public void onTimerFinished(View view) { }
@Override public void onTimerSelected(View view) { } });
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);
DismissOverlayView
<style name="AppTheme" parent="Theme.DeviceDefault"> <item name="android:windowSwipeToDismiss">false</item> </style>
Notificações Sincronizadas
Comandos de Voz
Aplicações Wear
Envio e sincronização de dados
APIs
Comunicação Mobile/Wear
MinhaApp
MobileAPK WearAPK
Google Play Services
GoogleApiClient googleApiClient = new GoogleApiClient.Builder(context) .addApi(Wearable.API) .addConnectionCallbacks(cc) .addOnConnectionFailedListener(cfl) .build();
compile ‘com.google.android.gms:play-services:6.5.87’
<meta-data android:name="com.google.android.gms.version" android:value="@integer/google_play_services_version" />
Node API
Message API
Data 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) { } @Override public void onPeerDisconnected(Node node) { } });
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 remetente = messageEvent.getSourceNodeId(); String caminho = messageEvent.getPath(); byte[] dados = messageEvent.getData(); } });
PutDataMapRequest putDataMapRequest = PutDataMapRequest.create("/dados"); DataMap dataMap = putDataMapRequest.getDataMap(); dataMap.putInt("numero", 1); dataMap.putString("nome", "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 = dataMap.getInt("numero"); String nome = dataMap.getString("nome"); } } } } });
Data API
WearableListenerService extends Service implements NodeApi.NodeListener, MessageApi.MessageListener, DataApi.DataListener
Node API
Message API
Data API
<service android:name=“br.com.nglauber.nextlevelapps.MeuService”> <intent-filter> <action android:name="com.google.android.gms.wearable.BIND_LISTENER"/> </intent-filter> </service>
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
Dúvidas?
Nelson GlauberEngenheiro de Sistemas do C.E.S.A.R.
Professor da Unibratec GDE Android 2014
@nglauber +NelsonGlauber
nglauber.blogspot.com
https://github.com/nglauber/NextLevelApps