Share
I den forrige artikkelen har jeg introdusert to designprinsipper rettet mot wearables, signaler og mikrointeraksjoner. I denne artikkelen lager vi et eksempel på Android Wear-prosjekt for å vise hvordan disse prinsippene gjelder i praksis.
Tenk deg at du er i den siste timen av en budkrig for et mye ettertraktet element. Det siste du vil ha, og hva som ofte skjer, blir overbudt like før budet lukkes. I dette scenariet er det åpenbare fordeler med å ha en smartwatch som tillater deg en praktisk måte å kunne overvåke et slikt bud på, og sørge for rettidig handling uten å forstyrre deg, brukeren, for mye. I vårt eksempelprosjekt går vi gjennom hvordan vi kan innse dette på en Android Wear-enhet.
Handelsstedet som vi baserer vårt eksempel på, heter TradeMe, mitt hjemlands ekvivalent med eBay. Som med flertallet av vellykkede online-tjenester, tilbyr TradeMe en ren og enkel API som viser størstedelen av funksjonaliteten til utviklere. Fordi denne artikkelen handler om Android Wear, fokuserer vi bare på koden relatert til Android Wear.
Flytdiagrammet nedenfor viser hovedlogikken til prosjektet vårt.
Hoveddelen av logikken håndteres av en tjeneste, BidWatcherService, På den parrede håndholdte hvor den rutinemessig trekker ned brukerens oversikt. For hvert element kontrollerer tjenesten om det har skjedd noen endringer, og hvis brukeren har blitt overbudt. For de som samsvarer med disse kriteriene, oppretter tjenesten et varsel der brukeren blir varslet om endringene og gitt muligheten til lett å foreta handling, for eksempel å øke budet.
Den faktiske Android Wear-spesifikke koden står for svært lite av den generelle applikasjonen, men som forhåpentligvis vektlagt i denne artikkelen, er utfordringen i å designe hensiktsmessige kontekstuelle erfaringer fremfor selve implementeringen. Selvfølgelig kan du opprette et tilpasset og komplekst brukergrensesnitt hvis du ønsker det.
Hvis du vil bruke funksjoner som er spesifikke for Android Wear, må du sikre at prosjektet ditt refererer til v4-støttebiblioteket. Vi starter med å få en referanse til systemets varslingsbehandling under initialisering. For å gjøre dette bruker vi NotificationManagerCompat klasse fra støttebiblioteket i stedet for NotificationManager klasse.
beskyttet NotificationManagerCompat mNotificationManager; ... mNotificationManager = NotificationManagerCompat.from (mContext);
For hver av våre ventelister som har endret seg og vurdert som viktige for å varsle brukeren, oppretter og viser vi et varsel.
NotificationCompat.Builder notificationBuilder = ny NotificationCompat.Builder (dette) .setSmallIcon (R.drawable.small_icon) .setContentTitle (mContext.getString (R.string.title_auction_update)) .setContentText (item.mTitle); mNotificationManager.notify (notificationId, notificationBuilder.build ());
Det er det. Vi er nå i stand til å varsle brukeren om eventuelle overvåkte elementer som har blitt endret. Dette vises på skjermbildene nedenfor.
Ovennevnte skjermbilder viser den emulerte versjonen av varselet vårt på en Android Wear-enhet. Det venstre skjermbildet viser en forhåndsvisning av varselet. Sentral og høyre skjermbilder viser meldinger i fokus.
Vi kan, som Android Wear-dokumentasjonen antyder, gjøre denne informasjonen mer overskuelig ved å legge til et bakgrunnsbilde i varselet for å gi det mer kontekst. Det er to måter å oppnå dette på. Vi kan angi varselet BigIcon, bruker setBigIcon metode, eller ved å utvide varselet med en WearableExtender objekt og angi bakgrunnsbilde. Fordi vi fokuserer på Android Wear, bruker vi WearableExtender klasse.
Som navnet antyder, den WearableExtender klassen er en hjelpeklasse som bryter opp varslingsutvidelsene som er spesifikke for bærbare enheter. Følgende kode viser hvordan vi legger til et bakgrunnsbilde i våre varsler.
NotificationCompat.WearableExtender wearableExtender = ny NotificationCompat.WearableExtender (); wearableExtender.setBackground (BitmapFactory.decodeResource (getResources (), R.drawable.notification_background)); NotificationCompat.Builder notificationBuilder = ny NotificationCompat.Builder (dette) .setSmallIcon (R.drawable.small_icon) .setContentTitle (mContext.getString (R.string.title_auction_update)) .setContentText (item.mTitle) .extend (wearableExtender);
Vi lager en WearableExtender objekt, angi bakgrunnen, og tilordne det til varselet ved hjelp av forlenge metode. Følgende skjermbilde viser oppdatert varsel.
Jeg har tre elementer på kleslisten min. For øyeblikket har jeg et eget kort for hvert av elementene. Ved utforming av varsler for en håndholdt, vil vi bruke en oppsummeringsvarsling, men dette oversetter ikke godt til Android Wear-enheter. Av denne grunn er begrepet a Stable Ble introdusert.
Stabler er opprettet ved å tilordne relaterte varsler til samme gruppe. Dette tillater brukeren å kaste bort eller ignorere dem som en gruppe eller utvide dem til å håndtere hvert varsel individuelt. Dette oppnås ved å sette inn gruppe av hvert varsel ved hjelp av setGroup metode som vist i neste kodeblokk.
NotificationCompat.Builder notificationBuilder = ny NotificationCompat.Builder (dette) .setSmallIcon (R.drawable.small_icon) .setContentTitle (mContext.getString (R.string.title_auction_update)) .setContentText (item.mTitle) .setGroup (NOTIFICATION_GROUP_KEY) .extend ( wearableExtender);
Følgende skjermbilder viser eksempler på at meldinger blir stablet og utvidet.
Stabler er en erstatning for sammendrapporter på en håndholdt. Stabler vises ikke på en håndholdt, og du må derfor eksplisitt lage et sammendrag for håndholdte. Ligner på hva vi gjorde i den ovennevnte kodeblokken, angi varselet gruppe, bruker setGroup metode, til stablingsgruppen, men også sette gruppesammendrag til ekte ved å påkalle setGroupSummary metode.
I noen tilfeller vil du kanskje vise mer detaljert informasjon til brukeren. Dette kan være nyttig for å gi brukeren tilleggsinformasjon uten at de trenger å trekke ut sin håndholdte. Android Wear har sider for denne nøyaktige grunnen. Sider lar deg tildele flere kort til et varsel for å avsløre mer informasjon. Disse blir avslørt ved å sveipe til venstre.
For å legge til en ekstra side, oppretter vi bare et nytt varsel og legger det til i vår WearableExtender objekt ved hjelp av addPage metode.
BigTextStyle autionDetailsPageStyle = new NotificationCompat.BigTextStyle () .setBigContentTitle (mContext.getString (R.string.title_auction_details)) .bigText (String.format (this.getString (R.string.copy_notification_details), item.mMaxBidAmount, item.getTimeRemainingAsString () , item.mBidCount)); VarslingsdetaljerPageNotification = ny NotificationCompat.Builder (dette) .setSmallIcon (R.drawable.small_icon) .setStyle (autionDetailsPageStyle) .build (); NotificationCompat.WearableExtender wearableExtender = ny NotificationCompat.WearableExtender (); wearableExtender.setBackground (BitmapFactory.decodeResource (getResources (), R.drawable.notification_background)); wearableExtender.addPage (detailsPageNotification);
Følgende skjermbilder viser et varsel med to sider. Vi gir nå brukeren rettidig og relevant informasjon.
Det siste trinnet er å gjøre denne informasjonen tiltak. For å gjøre dette, legger vi til handlinger akkurat som vi gjorde med varsler tidligere. De to handlingene vi legger till, tillater brukeren å automatisk øke budet eller eksplisitt sette budet sitt.
La oss først legge til et automatisk bud. Følgende kodestykke skal vises kjent for enhver Android-utvikler.
Intent defaultBidIntent = ny Intent (DEFAULT_BID_ACTION) .putExtra (EXTRA_WATCHLIST_ITEM, element) .putExtra (EXTRA_NOTIFICATION_ID, notificationId); PendingIntent pendingDefaultBidIntent = PendingIntent.getBroadcast (mContext, 0, defaultBidIntent, PendingIntent.FLAG_UPDATE_CURRENT); NotificationCompat.Action defaultBidAction = ny NotificationCompat.Action.Builder (R.drawable.icon_action_bid, mContext.getString (R.string.label_auto_bid), pendingDefaultBidIntent) .build (); NotificationCompat.WearableExtender wearableExtender = ny NotificationCompat.WearableExtender (); wearableExtender.setBackground (BitmapFactory.decodeResource (getResources (), R.drawable.notification_background)); wearableExtender.addPage (detailsPageNotification); wearableExtender.addAction (defaultBidAction);
Følgende skjermbilder viser handlingen sammen med bekreftelsestillatelsen.
Med den andre handlingen vil vi gjøre det mulig for brukeren å angi en bestemt pris. Arbeide med begrensningene i Android Wear-enheten er alternativene våre:
En av de attraktive aspektene ved Android Wear er arkitektur og design mot stemme. Dette gir mening å gi formfaktoren og konteksten der en brukbar enhet som en smartwatch brukes.
Implementering av dette ligner på det ovenfor, men i tillegg til a RemoteInput objekt, vi instantierer og tildeler en RemoteInput motsette seg handlingen. De RemoteInput eksempel tar vare på resten.
Intent customBidIntent = new Intent (CUSTOM_BID_ACTION) .putExtra (EXTRA_WATCHLIST_ITEM, element) .putExtra (EXTRA_NOTIFICATION_ID, notificationId); PendingIntent pendingCustomBidIntent = PendingIntent.getBroadcast (mContext, 0, customBidIntent, PendingIntent.FLAG_UPDATE_CURRENT); RemoteInput remoteInput = ny RemoteInput .Builder (EXTRA_BID_AMOUNT) .setLabel (mContext.getString (R.string.copy_specify_bid)) .build (); NotificationCompat.Action customBidAction = ny NotificationCompat.Action .Builder (R.drawable.icon_action_bid, mContext.getString (R.string.label_bid), pendingCustomBidIntent) .addRemoteInput (remoteInput) .build (); NotificationCompat.WearableExtender wearableExtender = ny NotificationCompat.WearableExtender (); wearableExtender.setBackground (BitmapFactory.decodeResource (getResources (), R.drawable.notification_background)); wearableExtender.addPage (detailsPageNotification); wearableExtender.addAction (defaultBidAction) .addAction (customBidAction);
De RemoteInput objektet tar en streng i konstruktøren. Denne strengen, EXTRA_BID_AMOUNT, er identifikatoren som brukes av kringkasting mottakeren når du henter resultatet som vist nedenfor.
Bundle remoteInput = RemoteInput.getResultsFromIntent (hensikt); hvis (remoteInput! = null) CharSequence inputAsCharSequence = remoteInput.getCharSequence (EXTRA_BID_AMOUNT); hvis (inputAsCharSequence! = null) input = inputAsCharSequence.toString ();
Følgende skjermbilde viser et eksempel på a RemoteInput forekomst i aksjon.
En åpenbar utvidelse av dette ville være å gjøre det mulig for brukeren å eksplisitt be om en oppdatering. For å implementere dette, ville du opprette en aktivitet for Android Wear-enheten som lytter etter talekommandoer. Når mottatt, send forespørselen til den parrede mobilenheten og avslutt aktiviteten. Men det er for en annen gang.
Som avsluttes vårt eksempelprosjekt, hvor vi nå tilbyr brukeren relevant og handlingsbar informasjon, leverer den til dem med minimal forstyrrelse. Som nevnt i forrige artikkel, lar Android Wear deg implementere alt du vil, men jeg håper denne artikkelen har vist hvordan forbedrede varsler er en effektiv og effektiv måte å utvide tjenesten din på Android Wear-enheter.
Accentsconagua