Hvordan bygge et Pebble-program

Hva du skal skape

Pebble smartwatch har eksistert siden den svært vellykkede Kickstarter-kampanjen i 2012, og er et populært valg blant smartwatch-brukere. Dette skyldes utmerket batterilevetid, lav pris, ulike modeller å velge mellom, og kompatibilitet med både iOS og Android.

Pebble har hatt utvikler SDK siden dag én, og oppfordret utviklere til å bygge interessante og innovative applikasjoner for Pebble-plattformen. SDK har alltid blitt oppdatert, med nye funksjoner lagt til i løpet av tiden.

Pebble-applikasjoner har tradisjonelt blitt kodet i C, men nylig har Pebble tatt på JavaScript og åpnet verden for app-utvikling på plattformen til enda flere utviklere. I denne introduksjonen til Pebble-utviklingen går jeg gjennom noen av grunnleggende om å komme i gang med Pebble-utvikling ved hjelp av SDK og Pebble.js-biblioteket ved å bygge en søknad og sende den til Pebble-applikasjonsbutikken.

Å eie en pebble eller noen tidligere kunnskaper om C-språket er ikke nødvendig for denne opplæringen.

1. Sette opp prosjektet

Det er for øyeblikket to miljøer hvor du kan bygge Pebble-applikasjoner. CloudPebble gjør det mulig å utvikle Pebble apps i nettleseren. Dette er flott hvis du er på Windows eller bruker en mindre kraftig maskin.

Det andre alternativet, og alternativet som denne opplæringen skal følge, er å ha utviklingsarbeidet lokalt. Dette gjør at du kan jobbe offline og bruke en redaktør etter eget valg. La oss først få Pebble-verktøyet og SDK installert.

For tiden er det ingen offisiell støtte for Pebble-verktøyet og SDK på Windows, slik at følgende avsnitt går deg gjennom trinnene for å installere Pebble-verktøyet og SDK på OS X og Linux. Pebble anbefaler at du bruker CloudPebble for utvikling på Windows, men du kan også bruke en Linux virtuell maskin.

Den enkleste måten å installere Pebble-verktøyet på OS X på er gjennom Homebrew. Hvis du ikke har Homebrew installert, kan du få installeringsinstruksjonene på Homebrew-nettstedet. Med Homebrew installert, kan du installere Pebble-verktøyet med følgende kommando:

brygg installasjon pebble / pebble-sdk / pebble-sdk

Det er noen få skritt å ta for å installere Pebble-verktøyet og SDK på Linux. Pebble har en detaljert guide tilgjengelig som du kan følge. Når du har installert Pebble-verktøyet, vil du ha småstein kommando tilgjengelig for deg fra kommandolinjen. Løping pebble - versjon viser versjonen informasjonen.

$ ~ pebble - versjon Pebble Tool v4.2.1

De småstein Kommandolinjegrensesnittet inneholder flere praktiske kommandoer. Du kan liste disse kommandoene ved å kjøre pebble - hjelp eller pebble -h. En av kommandoene setter opp et nytt prosjekt med noen boilerplate-kode. Opprett en ny katalog og kjør følgende kommando i roten til den nye katalogen:

pebble nyprosjekt hei-pebble

Hvis dette er første gang du oppretter et Pebble-program, blir du bedt om å godta vilkårene for bruk og Pebble Developer-lisensen. Når du har akseptert disse, lastes ned og installeres den nyeste Pebble SDK (3.11.1 ved skrivingstidspunktet).

Etter installasjon av Pebble SDK, er et grunnleggende Pebble-prosjekt satt opp i gjeldende katalog. For å bygge, installere og kjøre appen din, må du gjøre følgende. Først må du sørge for at du er i roten til ditt Pebble-prosjekt. I dette tilfellet er vi i roten til hallo-pebble katalog.

Deretter kjører du pebble build kommando. Når koden er samlet, bør du se meldingen "bygge" ferdig med suksess og en rekke nye filer i byggkatalogen. Den eneste filen vi trenger å bekymre deg for akkurat nå er hallo-pebble.pbw. Dette er din app som vil bli installert på klokken.

For å kjøre appen bruker vi Pebble-emulatoren som følger med Pebble SDK. Pebble bruker open source QEMU emulatoren. For tiden er det tre generasjoner av Pebble som er tilgjengelige for å utvikle seg for. Pebble and Pebble Steel er den opprinnelige generasjonen av Pebble. Pebble Time støtter 64 farger og bruker den litt nyere 3.x-versjonen av operativsystemet.

Pebble Time Round er nesten identisk med Pebble Time med unntak av den sirkulære og større skjermen. Pebble bruker plattformsnavn for å skille mellom de tre generasjonene av Pebble smartwatches.

  • aplitt er plattformnavnet som brukes til Pebble and Pebble Steel.
  • Basalt er plattformen navn for Pebble Time.
  • Og Kritt er plattformnavnet for Pebble Time Round.

Vi kan starte noen av disse emulatorene ved hjelp av --emulator flagg etter pebble install kommandoen, passerer plattformen vi ønsker å målrette. For eksempel, hvis vi ønsket å kjøre vår app på plattformen for Pebble Time, ville vi kjøre følgende kommando i rotkatalogen av Pebble-prosjektet:

pebble install - emulator basalt

Denne kommandoen starter emulatoren, starter den valgte plattformen, og installerer .VD filen lagret i byggkatalogen. Dette er hva du bør se i emulatoren:

Pebble-klokken har ikke en berøringsskjerm og kommer med fire knapper, opp, ned, å velge, og tilbake. Disse er emulert med opp, ned, Ikke sant, og venstre nøkler på tastaturet henholdsvis. Ved å trykke på disse tastene, kan du navigere i appen du opprettet.

Hvis vi åpner kildekoden til prosjektet, ser du at den er skrevet i C. For å kunne bruke Pebble.js for prosjektet, skal vi bruke en mal som kan få oss til å starte raskere. Pebble.js er fortsatt i beta på skrivingstidspunktet, slik at noen ting fortsatt kan endres i fremtiden.

La prosjektkatalogen, opprett en ny katalog og klone GitHub-repoen som vist nedenfor.

mkdir hello-pebblejs cd hello-pebblejs git klone https://github.com/pebble/pebblejs .

Når du har klonet repoen, åpne den i en tekstredigerer, og ta en titt rundt. Kildekoden til søknaden finnes i src katalogen. I den katalogen har du tre andre kataloger, js, ganske enkelt, util, og a main.c fil.

De js katalog er der vi setter søknadskoden. De ganske enkelt katalog er hvor den innfødte koden er at JavaScript funksjoner tilgang og util katalog inneholder mer innfødt kode som vi ikke trenger å røre. Inngangspunktet for søknaden skal leve i  JS / app.js. Hvis vi bygger og kjører denne applikasjonen, bør du se følgende resultat i emulatoren:

Åpen JS /app.js, ta en titt rundt, og slett denne filen. Vi skal begynne fra bunnen av.

2. La oss bygge en app

Det første vi må lære er å vise tekst på skjermen. Pebble.js har et brukergrensesnittramme for instantiating Elements. Med dette rammeverket kan du opprette elementer, for eksempel tekst, rektangler og bilder. Legg til følgende linje til app.js å kreve rammen.

var UI = krever ('ui');

Det første elementet vi vil bruke i denne opplæringen er Vindu. Windows er hovedblokken av Pebble-applikasjoner. Det er tre typer vinduer.

  • EN Kort kan brukes til å vise tekst på forhåndsformat måte, for eksempel en tittel øverst, en undertekst under den og et kroppsområde for litt tekst.
  • EN Meny brukes til å vise en liste over alternativer.
  • EN Vindu er den mest fleksible og lar deg legge til forskjellige elementer til den.

For å legge til tekst i et vindu, krever vi også Vektor2, en modul for å tegne 2D vektorer og en som du ville være kjent med hvis du har gjort noe med three.js eller et annet vektor tegnebibliotek.

Vårt første mål er å lage et vindu, lage og legge til tekst i vinduet og vise det til brukeren. Følgende utdrag er det minste som kreves for å vise tekst på skjermen.

var UI = krever ("ui"); var Vector2 = krever ("vektor2"); // Dette er vårt hovedvindu var main = nytt UI.Window (); // Dette er vårt tekstinnhold var textfield = ny UI.Text (størrelse: ny Vector2 (144, 60), tekst: 'Hello PebbleJS'); // legg til teksten i vinduet main.add (tekstfelt); // vis vinduet main.show ();

Bygg prosjektet og installer programmet for å se resultatet. I stedet for å gjøre begge trinnene separat, foretrekker jeg å koble kommandoene sammen og kjøre følgende kommando:

pebble build && pebble install - emulator basalt

Hvis du vil teste på alle tre plattformene samtidig, kan du legge til installasjonskommandoene for hver emulator:

pebble build && pebble install - emulator basalt && pebble install - emulator aplite && pebble install - emulator kritt

Du vil legge merke til det aplitt og basalt se nesten identisk mens du er kritt ser ikke så bra ut. Dette er på grunn av rundskjermen og skjermens dimensjoner. Vi diskuterer plattformsdeteksjon i et øyeblikk. For nå går vi videre med noen av grunnleggende funksjonalitet.

I det ovennevnte kodestykket oppretter vi en Tekst element ved hjelp av Tekst() metode. Opprettelsen av Tekst() tar et objekt som parameter for å konfigurere Tekst element. De størrelse nøkkel definerer størrelsen på et rektangel (definert av a Vektor2 eksempel) der Tekst elementet er tegnet. Verdien av tekst nøkkelen inneholder strengen vi vil vise. Vi legger da til Tekst element til Vindu før vi ringer vise fram() på vinduet for å vise det.

Så langt appen bruker standardinnstillingene for Vindu og Tekst. Vi har imidlertid muligheten til å tilpasse dem. Vi har kontrollen for å endre posisjon, farge og skriftstørrelse. Det er noen systemfonter tilgjengelige, og du har til og med muligheten til å laste tilpassede skrifter du kan bruke i appen din.

Vår app kommer til å regne ned til en bestemt dato. Når appen starter, vil vi at det skal ta dagens dato og beregne hvor mange dager det er til en bestemt dato i fremtiden. La oss si, for eksempel, jeg ville ha en app som fortalte meg hvor mange dager det skulle være før Star Wars, Episode VIII er her.

Jeg vet at jeg vil lage min hoved Vindu Når appen starter, beregner du antall resterende dager frem til 15. desember 2017, og legg deretter til nummeret på skjermen min i midten. Ingenting for fancy.

La oss begynne med å vise et statisk nummer, ikke så forskjellig fra den nåværende "Hello PebbleJS" -koden vi skrev. I stedet bruker vi en variabel som verdien av tekst nøkkel og legg til en ny nøkkel, Tekstjustering, å sentrere teksten.

var UI = krever ('ui'); var Vector2 = krever ('vektor2'); var daysRemaining = "400"; var main = new UI.Window (); var text = ny UI.Text (size: new Vector2 (144, 168), text: daysRemaining, textAlign: 'center'); // legg til teksten i vinduet main.add (text); // vis vinduet main.show ();

Ved å kjøre appen får du utgangen vist nedenfor.

Som jeg forklarte tidligere, finnes det en rekke systemskrifttyper. For denne opplæringen vil vi holde fast ved en av systemfonter, Bitham 42 Fet, og plasser den litt nærmere midten av skjermen, både horisontalt og vertikalt. De font alternativet tar strengen av skrifttypen du vil bruke som referert i dokumentasjonen. Stillingen bestemmes av en annen Vektor2 eksempel som definerer Teksthorisontal og vertikal stilling.

Endre Tekstkonfigurasjon som denne:

var text = ny UI.Text (størrelse: ny Vector2 (144, 168), tekst: dagerRemaining, textAlign: 'center', posisjon: ny Vector2 (0, 50), font: 'BITHAM_42_BOLD');

Du burde nå ha noe som ligner på følgende:

La oss erstatte den hardkodede verdien med riktig antall dager. Da vi klonte prosjektet fra GitHub, fikk vi alle nødvendige filer for å få tilgang til enhetens APIer og forskjellige andre verktøy for å lage en Pebble-app med JavaScript. En av disse verktøyene er moment.js biblioteket, som du finner i selger katalogen. Dette vil gjøre beregningen enklere.

Krev moment.js inn i appen og sett inn Dager igjen variabel til en funksjon med følgende implementering:

var moment = krever ('leverandør / øyeblikk'); var daysRemaining = function () var eventdate = moment ("2017-12-15"); // Dette er datoen vi teller ned til - 15. desember var todaysdate = moment (); // Et øyeblikk forekomst av todaysdate returnere eventdate.diff (todaysdate, 'days'); // beregne forskjellen i dager. 

Deretter endrer du referansen til Dager igjen til et funksjonsanrop slik:

var text = ny UI.Text (size: new Vector2 (144, 168), text: daysRemaining (), // Dette er nå en funksjonsanropstekstLett: 'senter', posisjon: ny Vector2 (0, 50) : 'BITHAM_42_BOLD');

Hvis du kompilerer og kjører app, bør du se riktig antall dager til Star Wars, Episode VIII er utgitt. Vi kan forlate dette her og ha en app som bare viser antall dager til arrangementet vi vil spore, men hvorfor ikke benytte anledningen til å legge til noen få funksjoner i appen. 

Først, la oss endre bakgrunnsfargen til Vindu og fargen på teksten slik at bakgrunnen er hvit og teksten er mørkere.

var main = new UI.Window (backgroundColor: 'white'); var text = ny UI.Text (størrelse: ny Vector2 (144, 168), tekst: dagerRemaining (), textAlign: 'senter', posisjon: ny Vector2 (0, 50), skrift: 'BITHAM_42_BOLD', farge: ' svart' );

Og la oss legge til en annen Tekst element for å indikere hva tallet representerer. Vi lager en ny Tekst element og send det til alternativer for størrelse, posisjon, skrift osv.

var eventDetail = new UI.Text (størrelse: ny Vector2 (144, 168), tekst: 'Episode VIII', textAlign: 'senter', posisjon: ny Vector2 (0, 15), skrift: 'GOTHIC_24' 'svart' );

Deretter legger vi til Tekst element til hovedvinduet etter at vi legger til tekst gjenstand.

main.add (text) main.add (eventDetail);

Til slutt, la oss legge til en tredjedel Tekst element for å indikere at nedtellingen er i dager.

var daysText = new UI.Text (size: new Vector2 (144, 168), text: 'days', textAlign: 'center', posisjon: ny Vector2 (0, 100), skrift: 'GOTHIC_24', farge: ' svart' ); main.add (daysText);

For å navigere bruker Pebble maskinvareknapper i motsetning til en berøringsskjerm, funnet på de fleste andre smartwatches. Vi kan legge til muligheten til å tillate brukeren å dykke dypere inn i vår søknad ved hjelp av disse inngangene. La oss for eksempel si at vi også vil vise utgivelsesdatoen for de andre kommende filmene i Star Wars-franchisen. Rogue One er utgitt i år, og det er allerede en utgivelsesdato for Episode IX.

Samspillet med knappene utløser hendelser som vi kan abonnere på. Når en hendelse er oppdaget, kan vi bestemme hvilken handling som skal tas. Hvis brukeren klikker, kan vi bygge en ny Vindu for å holde utgivelsesdatoen for Rogue One og vise antall dager til utgivelsen av filmen.

La oss abonnere på ned-knappen og bygge en ny Vindu. De på() Metoden tar tre parametre, handlingen, knappen og en håndterer. Som nevnt tidligere er de mulige verdiene til den andre parameteren opp, ned, å velge, eller tilbake. Handlingen er vanligvis klikk, men du har også muligheten til å bruke longClick.

main.on ('klikk', 'ned', funksjon () var ro = nytt UI.Window (); console.log ('Ned klikket'); ro.show (););

Kjør programmet, og du vil legge merke til at du får en svart skjerm når du klikker ned. Du kan spørre deg selv hvordan du kan få tilgang til konsollen for å se Pebble-loggene.

Når appen kjører, kan vi feste en annen konsoll til den og få loggene ved å kjøre pebble logs - emulator basalt. Bytt emulatornavnet hvis du bruker en av de andre emulatorene. Du kan nå se at konsollen logger Ned klikket når ned-knappen er klikket.

pebble logs - emulator basalt [06:33:11] javascript> Ned klikket [06:33:11] javascript> (+) [vindu 2]: [vindu 1], [vindu 2]

Som vi gjorde før, la oss beregne antall dager til utgivelsen og vise denne informasjonen til brukeren. For å kunne benytte datoberegningsfunksjonen, kommer jeg til å passere i datoen som en parameter. Vi ønsker ikke å kopiere kode.

var daysRemaining = funksjon (dateString) var eventdate = moment (dateString); var todaysdate = moment (); returnere eventdate.diff (todaysdate, 'days'); 
main.on ('klikk', 'ned', funksjon () var ro = ny UI.Window (); console.log ('Ned klikket'); var ro = nytt UI.Window (); var roCount = nytt UI.Text (size: new Vector2 (144, 168), text: daysRemaining ("2016-12-16"), textAlign: 'senter', posisjon: ny Vector2 (0, 50), skrift: 'BITHAM_42_BOLD' farge: 'hvit'); var eventDetail = ny UI.Text (størrelse: ny Vector2 (144, 168), tekst: 'Rogue One', textAlign: 'senter', posisjon: ny Vector2 (0, 15) skrifttype: 'GOTHIC_24', farge: 'hvit'); var roDays = ny UI.Text (størrelse: ny Vector2 (144, 168), tekst: 'dager', tekstLette: 'senter', posisjon: ny Vector2 0, 100), skrift: 'GOTHIC_24', farge: 'hvit'); ro.add (roCount); ro.add (roDays); ro.add (eventDetail); ro.show (); ro.show ););

Hvis du vil, kan du legge til en skjerm for episode IX også. Jeg lar det være en utfordring for deg å prøve deg selv.

Vi bør fikse visningsproblemet for brukere med en Pebble Time Round. For å kunne gjøre dette, må vi oppdage hvilken plattform de er på og oppdatere brukergrensesnittet tilsvarende.

I appen din har du tilgang til et globalt objekt, Småstein. Dette objektet har noen funksjoner som vi kan bruke, en av dem er getActiveWatchInfo (), som returnerer et objekt med plattformens kjøretidinformasjon.

Vi kan få plattformnavnet ved hjelp av plattform nøkkel. Hvis plattformen er lik kritt, Vi må gjøre noen tilpasninger til brukergrensesnittet.

På toppen av app.js, vi henter handlingsinformasjonen og kontroller om det nåværende plattformnavnet er lik kritt.

var info = Pebble.getActiveWatchInfo (); // Returner watch info var platform = info.platform; // Returnerer en streng av plattformnavnet var isChalk = plattform === 'kritt';

Hvis du kjører appen din på Chalk-plattformen, bør du se følgende:

Uansett hvor vi bruker størrelse og plassering av brukergrensesnittelementer, må vi gjøre små endringer for å imøtekomme for rundskjermen på Chalk-plattformen. Som en start oppretter vi en variabel som holder bredden på skjermen.

var sWidth = isChalk? 180: 144;

Pebble Time Round har en 180px x 180px skjerm. Dette betyr at vi må endre X-koordinaten til Vector objekter. Vi lager tre variabler for å hjelpe oss med dette.

var countPosition = isChalk? 65: 50; var daysPosition = isChalk? 120: 100; var titlePosition = isChalk? 25: 15;

Den endelige koden vil se slik ut:

var UI = krever ("ui"); var Vector2 = krever ("vektor2"); var øyeblikk = krever ("øyeblikk"); var info = Pebble.getActiveWatchInfo (); var platform = info.platform; var isChalk = plattform === "kritt"; var sWidth = isChalk? 180: 144; var countPosition = isChalk? 65: 50; var daysPosition = isChalk? 120: 100; var titlePosition = isChalk? 25: 15; var daysRemaining = funksjon (dateString) var eventdate = moment (dateString); // Dette er datoen vi regner ned til - 24. april var todaysdate = moment (); // Et øyeblikk forekomst av todaysdate var forskjell = eventdate.diff (todaysdate, "days"); returforskjell; var main = ny UI.Window (backgroundColor: "white"); var text = ny UI.Text (størrelse: ny Vector2 (sWidth, 168), tekst: daysRemaining ("2017-12-15"), textAlign: "center ", posisjon: ny Vector2 (0, countPosition), skrift:" BITHAM_42_BOLD ", farge:" svart ") // Eventdetalj Tekst var eventDetail = ny UI.Text (størrelse: ny Vector2 (sWidth, 168) tekst: "Episode VIII", tekstAlign: "senter", posisjon: ny Vector2 (0, tittelSituasjon), skrift: "GOTHIC_24", farge: "svart") // Eventdetalj Tekst var daysText = nytt UI.Text  størrelse: ny Vector2 (sWidth, 168), tekst: "dager", tekstLette: "senter", posisjon: ny Vector2 (0, daysPosition), font: "GOTHIC_24", farge: "svart") // legge til teksten til vinduet main.add (text); main.add (eventDetail); main.add (daysText); // vis vinduet main.show (); // ROGUE 1 vindu main.on ("klikk", "dow n ", funksjon () var ro = ny UI.Window (); var roCount = ny UI.Text (størrelse: ny Vector2 (sWidth, 168), tekst: daysRemaining ("2016-12-16"), textAlign: "senter", posisjon: ny Vector2 (0, countPosition) "BITHAM_42_BOLD", farge: "hvit"); var eventDetail = ny UI.Text (size: new Vector2 (sWidth, 168), text: "Rogue One", textAlign: "center", posisjon: ny Vector2 (0, titlePosition), font: "GOTHIC_24" "white") var roDays = ny UI.Text (størrelse: ny Vector2 (sWidth, 168), tekst: "days", textAlign: "center", posisjon: ny Vector2 (0, daysPosition), font: "GOTHIC_24 ", farge:" hvit "); ro.add (roCount); ro.add (roDays); ro.add (eventDetail); ro.show (); ro.on ("klikk", "ned", funksjon () var ni = nytt UI.Window (backgroundColor: "white"); var nineCount = nytt UI.Text (størrelse: ny Vector2 (sWidth, 168 ), tekst: dagerRemaining ("2019-05-24"), textAlign: "senter", posisjon: ny Vector2 (0, countPosition), skrift: "BITHAM_42_BOLD", farge: "svart"); var eventDetail = ny brukergrensesnitt Tekst: "senter", posisjon: ny vektor2 (0, tittelposisjon), skrift: "GOTHIC_24", farge: "svart") var nineDays = new UI.Text (size: new Vector2 (sWidth, 168), text: "days", textAlign: "center", posisjon: ny Vector2 (0, daysPosition), font: "GOTHIC_24", farge: " svart "); nine.add (nineCount); nine.add (nineDays); nine.add (eventDetail); nine.show ();); );

Jeg er sikker på at du er enig i at det er god plass til forbedring. Vi dupliserer kode på forskjellige steder, noe som ikke er en god praksis. Når det er sagt, håper jeg at du nå har en grunnleggende forståelse av hvordan du kan lage apper for Pebble ved hjelp av JavaScript og Pebble SDK.

I den siste delen av denne opplæringen vil jeg gjerne vise deg hvordan du laster opp vår app til Pebble App Store.

3. Laster opp til Pebble App Store

Før vi laster opp appen, er det en ting vi må ta vare på. Når vi startet denne appen fra en mal, er det noen detaljer i appinfo.json, manifestet for vår søknad, som vi må endre. Du kan finne denne filen i roten av prosjektet. Åpen appinfo.json og endre selskapsnavnkort navn, og longname verdier.

Det siste vi trenger er en UUID (universelt unik identifikator). Manifestet inneholder allerede en, men når du prøver å laste opp .VD fil til appbutikken, vil du få en feil fordi denne UUID allerede er i bruk.

Den enkleste måten å få en på er å ta den fra originalen hallo-pebble appen vi opprettet ved starten av denne opplæringen, fordi vi ikke vil laste opp den appen til appbutikken. Hvis du slettet prosjektet, opprett et nytt prosjekt og kopier UUID fra det prosjektet. Når det er gjort, opprett en ny bygg.

Vi har nå et program som er klar for opplasting til Pebble App Store. Gå over til Pebble Developer Portal og registrer deg for en konto eller logg inn hvis du allerede har en. Når du er logget på, klikker du koblingen som sier Publiser en Pebble App.

På neste side velger du Lag et Watchapp på bunnen.

Skjemaet på neste side ser litt skremmende ut, men feltene er ganske selvforklarende. For å fullføre innsendingen må du laste opp minst to aktiver, som begge er ikoner for appen din.

Etter dette trinnet blir du tatt til forhåndsvisning av appbutikken med noen applikasjonsdata på høyre side. Det kreves at du legger til en utgivelsesdato for appen din. For å gjøre dette, klikk Legg til en utgave og last opp .VD fil, som du finner i byggemappen av prosjektet ditt.

Når dette er gjort, går du tilbake til oversiktsskjermen og .VD filen er bekreftet. Dette tar vanligvis bare noen få sekunder. Når bekreftet, er appen klar til publisering. Hvis du får problemer med dette og bekreftelsen mislykkes, blir du presentert med en nyttig melding som forklarer hvorfor bekreftelsen mislyktes.

Før du går videre og treffer publisere knappen, kan du legge til noen skjermbilder for deg, slik at folk kan se hva du kan forvente etter å ha installert det. Disse bildene vises i forhåndsvisning av appbutikken.

Pebble CLI-verktøyet har en flott og enkel metode for å ta skjermbilder. Løping pebble skjermbilde FILENAME ta en skjermdump av den nåværende kjøreremulatoren og lagrer den i gjeldende katalog.

Etter at du har lastet opp skjermbildene og fylt ut beskrivelsen for de ulike plattformene, er du klar til å publisere din første Pebble-app.

Konklusjon

I denne artikkelen har du lært hvordan du installerer og installerer Pebble SDK, hvordan du bruker noen av de grunnleggende Pebble CLI-kommandoene, og hvordan du bygger et grunnleggende program ved hjelp av JavaScript. Det sier seg selv at vi bare klarte overflaten i denne opplæringen. Det er mye mer å lære, ikke bare om å skrive Pebble apps med JavaScript, men også om Pebble utvikling generelt og verktøyene som er tilgjengelige for deg.