În acest tutorial, vom lansa o serie care va permite celor două dispozitive mobile să transfere informații cu un gest "Bump". Această aplicație va necesita o combinație de programare pe partea clientului și a serverului și vom acoperi toți pașii pentru a codifica ambele aspecte. De aici încolo, această aplicație va fi denumită afectiv ca "Thump".
Funcția principală a aplicației noastre "Thump" va fi comunicarea transversală a dispozitivelor prin intermediul unui server web intermediar. Actul de lovire a două dispozitive mobile împreună va apărea pentru utilizatorul final ca comunicare locală cu dispozitivul, când de fapt serverul web a procesat schimbul de date. În timp ce ideea de comunicare locală a dispozitivului poate părea la început cea mai practică abordare, în practică este plină de hangouturi și coșuri de securitate pe mai multe platforme! Deci, în schimb, vom folosi o aplicație Rails găzduită pe platforma Heroku pentru a prelua mesajele primite de la dispozitivele noastre și pentru a le trimite destinatarului destinat.
Modul în care funcționează este destul de interesant. Serverul va realiza, în esență, o estimare a faptului că destinatarul cel mai probabil al unui mesaj se va baza pe o combinație de coordonate GPS și o marcă de timp a serverului. Dacă simultan (sau aproape în același timp) vom călca cele două dispozitive împreună, vom trimite informații latitudine și longitudine către server, astfel încât acesta să poată determina că cele două dispozitive similare locaționale încercau să comunice între ele în ceva aproape în timp real. Simplu, corect?
Deși această metodă nu este perfectă, aceasta oferă o probabilitate statistică ca cele două dispozitive să aibă intenția de a comunica între ele. Una dintre marile probleme cu un serviciu de genul acesta (și aplicația noastră nu face excepție) ar fi un eveniment ca un târg de artă sau undeva unde mulți oameni ar încerca să "bată" toți în același timp. Deși este puțin probabil, ar putea permite transmisia unui mesaj unui destinatar neintenționat.
Vom începe prin crearea unor funcționalități de bază pentru aplicația noastră mobilă. În fișierul nostru principal.lua, vom adăuga câteva linii esențiale de cod pentru a ne începe.
local ui = necesită ('ui') system.setLocationAccure (10) local isSimulator = "simulator" == system.getInfo ("mediu") local deviceId = system.getInfo
Prima linie necesită includerea bibliotecii UI care ajută foarte mult la crearea componentelor native din Corona. Acest cod va fi inclus într-un fișier zip cod sursă atașat acestui tutorial Mobiletuts +. Apoi, vom seta un prag de precizie a locației pentru dispozitivele noastre. Avem nevoie ca dispozitivul să facă tot posibilul pentru a obține o locație cu o toleranță de eroare de cel mult 10 metri. În cazul în care distanța este mai mare decât aceasta, riscăm să strângem bătăi accidentale de la dispozitive care nu se află în vecinătatea noastră. Pentru a face lucrurile mai ușor în timp ce ne dezvoltăm, vom detecta dacă aplicația noastră rulează în simulatorul Corona sau pe dispozitiv. Aceasta va fi pentru a preveni în primul rând comportamentul ciudat din caracteristici care nu sunt în prezent suportate de simulator. În cele din urmă, trebuie să identificăm un dispozitiv cu o valoare unică. Un ID de dispozitiv ca acesta va împiedica serverul să încerce să trimită un mesaj înapoi la dispozitivul care la trimis în locul destinatarului destinat.
local = display.newRect (0, 0, display.contentWidth, display.contentHeight) logo-ul local = display.newImageRect ("logo.png", 172, 107) logo.x = display.contentWidth / 2 logo.y = display.contentHeight / 2) - 150
Apoi, vom crea un dreptunghi de fundal care oferă aplicației noastre un fundal frumos, alb. Următoarele 3 linii vor afișa o siglă în partea superioară a ecranului.
titlul loculuiLabel = ui.newLabel bounds = 15, 5, 290, 55, text = "Mesaj", font = native.systemFontBold, textColor = 12, centru " titleLabel: setReferencePoint (display.TopCenterReferencePoint) titleLabel.y = logo.y + 60
Codul de mai sus utilizează accesul bibliotecii UI la componentele de afișare native pentru dispozitiv. În acest caz, afișăm pur și simplu cuvântul "Mesaj" într-o nuanță de culoare albastru închis. Domeniul de aplicare al acestui articol nu include toate intricaciile din biblioteca de afișare nativă, așadar vă recomand să aruncați o privire pe site-ul Corona dacă sunteți nou în SDK. Coordonatele Y sunt setate la 60 de pixeli mai mari decât poziția emblemei pe care tocmai am afișat-o.
dacă isSimulator atunci - simulator (simulați zona textField) textField = display.newRect (20, titleLabel.y + 60, 280, 30) textField: setFillColor (200, 200, 200) (= 20, titleLabel.y + 60, 280, 30, fieldHandler) sfârșitul textField: setReferencePoint (display.TopCenterReferencePoint) textField.x = display.contentWidth / 2 textField.y = titluLabel.y + 60
Una dintre limitările simulatorului este că nu poate afișa corect toate componentele native ale dispozitivelor mobile. Pentru a preveni aruncarea de erori, vom detecta dacă rulați aplicația în simulator și afișăm o casetă gri în locul unui câmp de intrare. Acest lucru ne va ajuta cu poziționarea elementelor. Dacă aplicația nu rulează în simulator, vom afișa o componentă nativă "textField" care va permite utilizatorului final să introducă un mesaj. Apelul de apel FieldHandler este necesar pentru a detecta o fază de "trimis" sau, cu alte cuvinte, utilizatorul apăsând butonul "return". Prin capturarea acestui eveniment putem ascunde tastatura dupa ce utilizatorul si-a terminat tastarea mesajului.
local removeKeyboard = funcție (eveniment) - Ascunde tastatura native.setKeyboardFocus (nil) end bg: addEventListener ("atinge", removeKeyboard)
Ca bonus pentru interfața cu utilizatorul, putem adăuga un ascultător al evenimentului la fundalul nostru alb care așteaptă un eveniment "tap". În acest fel, dacă utilizatorul interconectează ecranul în afara zonei tastaturii, acesta va elimina focalizarea și va cauza dispariția.
latitudine locală latitudeText = "" longitudinală localăText = "" dacă esteSimulator atunci alertă locală = native.showAlert ("Eroare", "GPS nu este disponibilă în Simulator") alt loc localHandler = funcție latitudeText = string.format ', event.latitude) longitudeText = string.format ('% .8f ', event.longitude) sfârșitul runtime: addEventListener ("location", locationHandler) end
Acum, la lucrurile bune! În primul rând, vom afla dacă rulați în simulator și afișați pur și simplu un mesaj de eroare că GPS-ul nu este disponibil. Atunci când rulați pe dispozitiv, creăm un ascultător de rulare, care ne ia în permanență locația de la serviciul de localizare a dispozitivului și sună metoda noastră de localizare cu aceste date. Noi convertim acest lucru pentru a avea 8 zecimale de precizie care ar trebui să fie mai mult decât exacte pentru scopurile noastre.
local getThump = functie (eveniment) daca event.isShake == true atunci alerta locala = native.showAlert ("Thump!", "Location:? latitudeText?", "? longitudeText?" \ r \ nMessage: text, "OK") system.vibrate () sfârșitul final Runtime: addEventListener ("accelerometer", getThump)
În cele din urmă, vom crea un alt ascultător al evenimentului de execuție care va prelua date de la accelerometrul dispozitivului și îl va transmite metodei noastre getThump. În cadrul acestei metode vom detecta dacă evenimentul a fost un eveniment "agitare". Un eveniment de agitare este un alt nume pentru ceea ce se va întâmpla atunci când vom "tampa" două dispozitive împreună în speranța de a transmite un mesaj. Deoarece nu am scris încă componenta serverului, vom afișa pur și simplu aceste date într-o casetă de alertă pentru a arăta că aplicația noastră funcționează până acum. Pentru a testa acest lucru, puteți să introduceți un mesaj și să dați dispozitivului care rulează aplicația o agitare.
Rămâneți acordat pentru partea a II-a din această serie săptămâna viitoare, unde vom aborda funcționalitatea server-side în Rails pe Heroku!