Spēles android html5 krievu valodā. HTML5 spēļu izstrāde Android ierīcēm no nulles līdz izlaišanai

Braiena Makharga stratēģija, lai veiksmīgi izstrādātu vairāku pārlūkprogrammu HTML5 spēles.

HTML5: zibspuldžu likumīgais troņmantnieks. Patiesi starpplatformu izstrāde ļauj vienreiz uzrakstītu programmu palaist personālajā datorā, planšetdatorā un viedtālrunī, tā darbosies arī viedtelevizorā, kā arī galddatoros un mobilajās ierīcēs, tostarp spēļu konsoles piemēram, Xbox360 vai PlayStation 3, izmantojot iebūvētās pārlūkprogrammas. Ir skaidrs, ka tas ir ļoti pievilcīgi tiem, kas vēlas izstrādāt spēles pēc iespējas vairākām ierīcēm un platformām.

Terminam HTML5, kā arī tā pārstāvētajām specifikācijām ir atšķirīga nozīme atkarībā no tā, kurš to apraksta. Klientiem šī ir izstrādes tehnoloģija, kas sola patiesu Svēto Grālu-un rentablu starpplatformu izstrādi.

Izstrādātājiem tas ir kolektīvs lietvārds daudzām dažādām tehnoloģijām: JavaScript, WebSockets, WebAudio, Canvas, CSS3 un WebGL ir tikai daži no tiem, katrs ar saviem standartiem, spēcīgi vāji platformas ierobežojumi.

Un visbeidzot, tas izskatās kā vissvarīgākais: lietotājiem! Šeit ir svarīgi tikai tas, ka lietotāji vēlas tādu pašu pieredzi un pieredzi, kādu viņi ir pieraduši. Un tas ir galvenais izaicinājums izstrādātājiem, it īpaši, ja viņu mērķis ir īstenot spēli pēc iespējas vairāk platformu.

Dators pret mobilo q starpplatformu

Tagad mēs visi zinām fantastiskus HTML5 spēļu piemērus, kas darbojas datoru pārlūkprogrammās. Tos bieži izveido pārlūkprogrammu autori, lai īpaši demonstrētu stiprās puses pašu programmatūru vai noteiktām API, kuras tās vēlētos ratificēt HTML5 specifikācijā.

Lieliski piemēri ir tādas spēles kā Cutthe Rope un Contre Jour pārlūkprogrammai Internet Explorer vai daži lieliski eksperimenti pārlūkā Chrome, piemēram, Jam vai Racer. Lai uzzinātu nākotnes iespējas, apskatiet tādas bibliotēkas kā three.js, nesen izlaisto atvērtā pirmkoda Turbulenz vai Epic HTML5, ko darbina Unreal Engine.

Tomēr mēģiniet aplūkot kādu no šiem piemēriem operētājsistēmā Android, kurā ir instalēta OS2.3 (piparkūkas), un jūs redzēsit pavisam citu ainu, un dažos gadījumos jūs neko neredzēsit. Jā, šī operētājsistēma ir gandrīz trīs gadus veca, taču tā joprojām ir instalēta trešdaļā no visām Android ierīcēm, un šis skaitlis varētu būt vēl lielāks atkarībā no jūsu mērķauditorijas. Un tas notiek ne tikai vecā versija Android. To pašu var redzēt vietnē Apple ierīces darbojas iOS 5 vai mazāk jaudīgas ierīces, piemēram, iekurt Fire. Patiesībā tagad jūs neatradīsit nevienu mobilo ierīci, kurā kāda no iepriekš minētajām programmām tiktu parādīta pareizi.

Kā minēts iepriekš, lielākā daļa klientu izvēlas HTML 5, lai pārlūkprogrammas spēle būtu patiesi daudzplatformu. Ja izstrādājat spēles tikai personālajam datoram, Unity un Flash ir lieliskas iespējas, kurām jāpievērš uzmanība. Abiem ir lielisks pārlūka atbalsts un iespēja eksportēt uz ierīcēm kā atsevišķas lietotnes, tāpēc tos var pārnest uz viedtālruni vai planšetdatoru ar precīzu nepieciešamo kodu.

Izstrādājot vairāku platformu spēli HTML5, pastāv divas acīmredzamas problēmas. Pirmais ir HTML5 specifikācijas izplūdušā rakstura sekas, kā rezultātā turpmākais atbalsts nav nodalīts pēc ierīces veida, bet gan pēc katras šīs ierīces pārlūkprogrammas veida. Otrais un visgrūtākais izstrādātājiem ir pastāvīgas mobilo ierīču iespēju izmaiņas, kas nozīmē, ka pat ar vienādu funkciju kopumu spēle vienā ierīcē ļoti atšķirsies no tās pašas spēles, kas instalēta citā sīkrīkā.

Lai iegūtu priekšstatu par to, cik daudz iespēju ir, vienkārši palaidiet vienu no daudzajiem JavaScript etaloniem, lai pārbaudītu ierīces veiktspēju. Piemēram, 100 kadru pārsūtīšana uz audekla tiks atskaņota salīdzinoši labi ar 60 kadriem sekundē ierīcēs, piemēram, iPhone 4S vai 5, Galaxy S3, Nexus 7 vai Lumia 820. Taču izmēģiniet to pašu kodu citās ierīcēs, piemēram, HTC Desire(19 kadri sekundē), Galaxy ace(7 kadri) vai iPad 1 (9 kadri sekundē), un jums būs ļoti smagi jāstrādā, lai iegūtu vismaz kaut ko līdzīgu dzīvotspējīgai spēlei.

Ja jūsu projekta mērķis bija viedtālrunis vai planšetdators, un jo īpaši, ja tajos bija vecas vai mazjaudas ierīces, tad ir ļoti svarīgi veikt testēšanu un noteikt standartus agrīnā stadijā. Tas ir nepieciešams, lai izprastu ierīču klāsta ierobežojumus un noteiktu gan tehnisko pieeju, gan spēles dizainu, pie kura strādāsit.

Ja jūsu projekts nebija paredzēts viedtālruņiem vai planšetdatoriem, iespējams, jums vajadzētu pārskatīt savus mērķus. Piemēram, viedtālruņi un planšetdatori veido gandrīz trešdaļu Apvienotās Karalistes lapu skatījumu, un šis skaitlis pieaug ar ātrumu, kas 2014. gadā pārsniegs datoru skatījumus. Neskatoties uz to, ka galddatoru ierīces joprojām dominē darba laikā, tās noved no rīta mobilās ierīces un planšetdatoriem vakaros, šīs divas reizes ir ideāli piemērotas tīmekļa pārlūkošanai un spēlēm.

Izvēlieties savas cīņas

Chunk jau divus gadus izstrādā pārrobežu platformas HTML5 spēles raidorganizācijām un zīmoliem, kā arī ir radījis uz pārlūkprogrammām balstītas mobilās spēles tādiem klientiem kā BBC un Disney, kas darbojas visās ierīcēs, sākot no HTC Desire līdz iPad4, no Nexus 7 līdz Xbox 360.


Viņiem kā izstrādātājiem būtu lieliski izlemt, cik dziļi iekļūt šajā procesā, taču to nosaka viņu mērķauditorija un izmantotās ierīces. Strādājot pie bērniem paredzētiem zīmoliem, viņi bieži nonāca vecāku tālruņu vai zemu izmaksu un mazjaudas ierīču ierobežojumu dēļ, tomēr rūpīgi izstrādā un optimizē daudzas citas lietas, tāpēc viņi joprojām uzskata, ka ir iespējams izstrādāt iespaidīgas spēles internets.

Un ko viņi mācījās no šīs pieredzes? Ja jūs sastādītu sarakstu ar 10 populārākajiem padomiem HTML5 spēļu izstrādātājiem, tas izskatītos šādi:

1. Izlemiet par savu auditoriju

Apskatiet demogrāfiskos datus un to, kādas ierīces izmanto tie, kuriem ir izstrādāts jūsu dizains. Kad esat ieguvis datus, izmantojiet tos, lai identificētu galveno apmeklētāju izmantoto ierīču klāstu, un atlasiet šīs ierīces, pieņemot lēmumus.

2. Izlemiet par dizainu tehnoloģiju ziņā

Jā, tam tā vienmēr vajadzētu būt, taču HTML5 ierobežojumi un sadrumstalotība padara to vēl aktuālāku. WebGL ļaus jums izveidot izcilu 3D pirmās personas šāvēju, taču maz ticams (lasiet - nemaz), ka tas darbosies planšetdatoros, ja tie ir jūsu mērķa platformu sarakstā.

3. Draudzēties ar caniuse.com

Tas ir lielisks veids, kā ātri pārbaudīt atbalstu jebkurai HTML5 funkcijai, kuru vēlaties izmantot savā attīstībā - gandrīz visām pārlūkprogrammām un ierīcēm.

4. Izmantojiet ierīces, nevis tikai simulatorus

Paņemiet rokās, cik vien iespējams dažādas ierīces, palaidiet pēc iespējas vairāk dažādu operētājsistēmu versiju. Simulatori jums palīdzēs izstrādes laikā, bet jūs varat iegūt tikai precīzu priekšstatu par to, kā jūsu kods darbosies reālā ierīcē. Ir milzīgs skaits laboratoriju ar testēšanas ierīcēm, piemēram, Open Device Lab, kas ļaus piekļūt milzīgam ierīču skaitam. Pretējā gadījumā izpētiet resursus, piemēram, eBay, lai atrastu vecos tālruņus un iepazīstinātu tos ar savu testa vidi.

5. Esi informēts par izmaiņām

HTML5 specifikācijas tiek nemitīgi mainītas, tāpat kā ierīces atbalsts, tāpēc jums ir jābūt informētiem par izmaiņām šajās jomās. Tas jo īpaši attiecas uz tādām jomām kā audio, kur tādas funkcijas kā WebAudio API var radikāli mainīt iespējas.

6. Esi elastīgs visā attīstības laikā.

Tas, kas darbojas šodien, var nedarboties rīt. Tas, kas jums šodien nav pieejams, var kļūt pieejams rīt. Ļaujiet sev būt elastīgam un pielāgoties izmaiņām, kas notiek darba laikā.

7. Mēroga funkcionalitāte

Mobilo ierīču izvirzīšana pirmajā vietā ir noderīga ne tikai tradicionālajam tīmekļa dizainam. Apskatiet, kā viedtālruņiem varat izveidot kaut ko labu, un pēc tam izlemiet par funkcionalitāti un veiktspēju citās platformās, ja tās to atļauj. Strādājiet ar tām ierīcēm, kurās tiek izmantoti lietotāju aģenti vai multivides ierīces, un izmantojiet tām savu pieredzi.

8. KISS (Keep it Simple, Stupid) - Neapgrūtiniet savu dzīvi, jūs stulbie

Mēģiniet ar visiem līdzekļiem noteikt robežas un paplašināt iespējas, taču atcerieties, ka strādājat ar tehnoloģiju, kas ir sākumstadijā, palielināta sarežģītība vai pārvērtētas projekta ambīcijas tikai pasliktinās jūsu situāciju.

9. Izlemiet par savu dizainparaugu kalpošanas laiku

Funkcijas visu laiku mainās, un jūsu saturs var kļūt pārāk novecojis, pateicoties ierīcēs pieejamajām jaunajām funkcijām. Ja jūsu spēlei ir jāilgst pietiekami ilgi, veltiet laiku kļūdu labošanai un spēles atjaunināšanai.

O jā. Pārbaudiet savas spēles ikvienam pieejamās ierīces cik bieži vien iespējams!

Gladiator, tu brauc ar manu otro signālu

Šķiet, ka HTML5 ir neoficiāla vispārpieņemta tehnoloģija dažādu platformu spēļu izstrādei dažādām pārlūkprogrammām, par to nav šaubu. Pašlaik tā nav visdrošākā telpa, bet tas ir labi tehnoloģijām sākumstadijā. Lai pārbaudītu pārlūkprogrammu iespējas, ir vērts apskatīt tādas vietnes kā caniuse.com. Regulāri pārbaudiet savas spēles vairāk jums pieejamās ierīces un esiet pragmatiski ar spēļu dizainu. Tas palīdzēs izvairīties no problēmām ne tikai tagad, bet arī būs labākā stāvoklī, kad uzlabosies ierīces atbalsts, kas ir neizbēgami.

Bezmaksas spēles operētājsistēmā Android. Izgatavots html5, tāpēc varat tos atskaņot savā tālrunī un planšetdatorā. Papildus Android sistēmai tiek atbalstītas Windows, Linux, Mac un Apple mobilās ierīces. Galvenais ir tas, ka pārlūkprogramma ir moderna un sistēma ir jauna. Pele vai skārienekrāna vadība.

Spēles operētājsistēmā Android ir ideālas. Jūs varat tos atskaņot savā datorā un tālrunī. Tos var lejupielādēt (instalēt) ātrai piekļuvei.

Kā lejupielādēt HTML5 spēli savā tālrunī

Dodieties uz spēles lapu mūsu vietnē. Atveriet spēli pilnekrāna režīmā modernā pārlūkprogrammā, piemēram, Chrome. Pārlūkprogrammā noklikšķiniet uz trīs punktu pogas, kas slēpj izvēlnes komandas darbam ar lapu. Ritiniet sarakstu uz leju un atlasiet “Pievienot spēli galvenajam ekrānam” (ja jums ir nepārkrāsots pārlūks Chrome). Pēc tam spēle parādīsies tālruņa ekrānā, un to būs iespējams palaist tiešā palaišanā, neuzsākot pārlūkprogrammu.

Šī darbība ir pieejama tālruņiem un Android planšetdatori un Apple, taču pēdējam var būt komanda citur - Safari apakšējā izvēlnē.

Spēlei var būt nepieciešams interneta savienojums (vai arī tas nav nepieciešams atkarībā no konkrētās spēles īpašībām - vairākas spēles ir pieejamas bezsaistē, bet tagad jums tas ir jāpārbauda.) Spēle tiek automātiski lejupielādēta un saglabāta tālrunis, taču, lai lejupielādētu tiešsaistes uzvarētāju sarakstus vai citas funkcijas, var būt nepieciešams savienojums.

Instalējiet kā parastu Android spēli

Gandrīz katrai HTML5 spēlei ir versija operētājsistēma Android vai iOS. Ja HTML5 spēles instalēšana galvenajā ekrānā jums nav piemērota - teiksim, jūs vēlaties spēlēt pastāvīgi, nevis tikai tad, kad ir internets -, tad meklējiet ikonu spēļu ekrānsaudzētājos Google play un AppStore. Lai gan spēles ābolu ierīcēm tiek izlaistas retāk un biežāk jūs varat redzēt tikai Android pogas, piemēram:

Instalēšanas poga - meklējiet to spēlēs

Pašās spēlēs poga ir daudz mazāka, šeit tā ir palielināta, lai to atcerētos. Apskatiet zemāk esošās spēles ekrānuzņēmumu - mēģiniet tur atrast šo pogu. Tie novirza uz oficiālo Google Play, kur varat lejupielādēt bezmaksas versija spēles ar papildu funkcijām - piemēram, iespēja spēlēt bez interneta.

Veltīts spēles faniem operētājsistēmā Android ...

Kad man tikko teica, ka kaut kas tāds pastāv, es nepievērsu lielu uzmanību, jo es nemaz neesmu liels visu šo jauno tendenču cienītājs. Tomēr tad es sapratu, ka spēles operētājsistēmā Android ir kaut kas līdzīgs "platformas" rotaļlietām - es uzreiz gribēju izmēģināt, kas tas ir. Es joprojām atceros, cik aizraujošas spēles man šķita "astoņu bitu" konsolei Dandy vai Sega. Un šeit civilizācija ir nogrimis līdz kādam - tikai padomājiet, tālrunis bez pogām un ar funkciju, kas ļauj spēlēt spēles. Vilinoši, jūs neko neteiksit!

Faktiski tālrunī ir instalēta spēle (vai spēles process tiek veikta tikai caur pārlūkprogrammu - tiek apsvērta arī šī iespēja), pievēršot uzmanību tam, lai jūs varētu konkurēt ne tikai ar mākslīgo intelektu (tas nozīmē Personālais dators), bet arī ar citiem dalībniekiem (viss process notiek tiešsaistē).

Acīmredzamās HTML5 priekšrocības

Nevienam nav noslēpums, ka HTML5 aizstāj Flash un ir mūsdienu tīmekļa pamats. Tieši šī iemesla dēļ uz tā izveidotās spēles sāka darboties internetā - turklāt šodien spēles, kas ļauj konkurēt ar citiem lietotājiem, arvien vairāk interesē klientus (īpaši, ja tas nav nepieciešams lejupielādēt un instalēt datorā ). Šī funkcija savukārt palīdz atbrīvoties no daudziem ļaunprātīga programmatūra kas neļauj strādāt pie datora.

Visas šīs spēles Android un PC ir paredzētas mūsdienu pārlūkprogrammas un veiksmīgai darbībai ir nepieciešams tikai JavaScript, Canvas un HTML5. Atkarībā no tā, kādi uzdevumi būs jāveic šīs spēles laikā, ir ierasts atšķirt dažas šķirnes:

  • Pasāža
  • prāta mežģis
  • Stratēģijas
  • Lidot
  • Piedzīvojumi
  • Rase
  • Lejupielādējams
  • Pārlūkprogramma

Tiešsaistes spēļu piemēri Android ierīcēm

Iepriekš spēles par tālruni mani vispār neinteresēja, bet pēc vietnes nokļūšanas viss mainījās. Tur es iepazinos ar Android tiešsaistes spēlēm, izmēģināju milzīgu skaitu dažādu "rotaļlietu". Kas attiecas uz mani, labākās Android spēles, kas tiek piedāvātas šajā vietnē (un ne tikai šajā), ir madžongs un.

Kāpēc es to saku? Viss ir ļoti vienkārši. Visu savu dzīvi es esmu devis priekšroku spēlēm ar stratēģisku aizspriedumu, ar skaidru viduslaiku tēmu nokrāsu, kā arī fantāziju. Tātad mēs varam teikt, ka es patiešām atradu to, kas man patīk. Bet ne jau par to ir runa.

Visvairāk man šī vietne patika sakarā ar to, ka tajā ir visvairāk dažādi veidi tiešsaistes spēles un turklāt - patiešām, tām visām ir vajadzīgs ļoti maz programmatūras (patiesībā, izņemot JavaScript, Canvas un HTML5, lai tās darbotos, nekas nav vajadzīgs).

Bezmaksas spēles Android ierīcēm

Pateicoties Free2Play modelim, visas šajā vietnē piedāvātās Android spēles ir bezmaksas. Tos var atskaņot pilnekrāna režīmā gan datorā, gan planšetdatorā. Bet galvenais, kas tās atšķir no zibspēlēm, ir tas, ka tās beidzot var spēlēt pa tālruni.

Pamattehnoloģija, kas padara iespējamas HTML5 spēles, ir HTML un JavaScript kombinācija. Hiperteksta iezīmēšanas valoda (HTML) bija daļa no sākotnējā interneta lielceļa, kā toreiz to sauca, un mūsdienās to turpina izmantot, lai apkalpotu katru vietni. JavaScript kods tika pievienots otrās versijas pārlūkiem, piemēram, Netscape 2.0, 1995. gadā, un gadu gaitā tas ir attīstījies, lai kļūtu patīkamāks lasīt un rakstīt. Pirmajās dienās to sauca par DHTML vai dinamisku HTML, jo tas ļāva interaktīvam saturam bez lapas atsvaidzināšanas. Tomēr tīmekļa laikmeta sākumā bija grūti iemācīties un izmantot. Laika gaitā Javascript ar Google hroms izstrādātāji kļuva par vienu no ātrākajām skriptu valodām. Tam ir arī brīvi pieejami moduļi, bibliotēkas un skripti nekā jebkurā citā kodēšanas valodā.

Agrīnās DHTML spēles bija ļoti vienkāršas. Daži toreizējo spēļu piemēri bija Tic-Tac-Toe un. Tā kā ar šo tehnoloģiju veidotajās spēlēs tiek izmantots atklātais HTML5 standarts, šīs salīdzinoši senās spēles vēl šodien var spēlēt mūsdienīgā tīmekļa pārlūkprogrammā. Šīs tehnoloģijas ir pārcēlušās uz pārlūkprogrammu spēļu priekšplānu, jo tām nav nepieciešami spraudņi un tās ir drošākas spēlēt nekā vecākas tehnoloģijas. Arī HTML5 spēles atbalsta un ir uzlabotas iespējas atbalstīt sarežģītas 2D un

Ievadā vietā.
Pavadot vairākas dienas pēc kārtas (bez miega pārtraukuma), pētot visu iecienītāko Android sīkrīku HTML5 atbalstu, es nolēmu, ka šai tēmai jāpievērš uzmanība. Rakstā es mēģināšu soli pa solim atklāt visus HTML5 spēļu lietojumprogrammas Android izveides posmus (protams, pamata / atslēgas / galvenās), sākot no idejas līdz pašai izlaišanai APK fails.
Iespējams, es neatvēru neko jaunu cienījamiem izstrādātājiem, bet iesācējiem es centīšos visu aprakstīt pēc iespējas vienkāršāk, ar ekrānuzņēmumiem un paskaidrojumiem.

Es aicinu tos, kas vēlas uzzināt vairāk zem kaķa.

Ideja
Kopumā jūs varat daudz runāt par Android potenciālu, par HTML5 attīstību un par to mijiedarbību. Es to nedarīšu. Tātad, tieši pie lietas.

Ideja par spēles izveidi operētājsistēmai Android, visticamāk, ir prātā desmitiem simtu izstrādātāju un tiem, kas sevi uzskata par tādiem. Es neesmu izņēmums.

Kāpēc tieši HTML5? - Dzimtība. Jūs rakstāt spēli JS, un pēc tam absolūti jebkurai OS izveidojat iesaiņojumu ērtā formā un jebkurā valodā.

Viss process tiks sadalīts vairākos posmos, un galīgais pieteikums sastāvēs no divām daļām:
- Ietīt (iekšā Šis gadījums Android ierīcēm)
- Spēle

Solis 1. Pašas spēles rakstīšana
Vēl viens pluss spēles rakstīšanai HTML5 ir fakts, ka tas neprasa daudz darbojas programmas, IDE, emulatori un tā tālāk. Viss, kas jums nepieciešams, ir pārlūkprogramma (manā gadījumā tas ir Chromium) un teksta redaktors(BlueFish)

Spēle būs vienkārša: ja zils taisnstūris ir zaļš taisnstūris. Spēlētāja uzdevums ir vilkt zilo taisnstūri uz zaļo, apejot sarkano, kas pārvietojas pa spēles laukumu patvaļīgā virzienā.

Spēles izstrādei es izmantošu J2ds (spēļu dzinēju)

Pabeigts spēles kods:

index.html

Demo spēle vietnē J2ds v.0

Jūs varat ignorēt spēles koda kvalitāti, jo tas nav raksta mērķis. Lai gan, protams, jūs varat optimizēt, cik vēlaties, šis process kopumā, iespējams, ir bezgalīgs.

2. solis. Android Studio... Iesaiņojuma izveide spēlei
Es netaisos ar kādu mērīt šī vai tā IDE vēsumu Android izstrādei, bet es jums parādīšu Android piemērs Studija. Darbam mums ir nepieciešams:
- Java mašīna (OpenJDK ir piemērots manam Linux)
- Android Studio izplatīšanas komplekts.

Lejupielādējiet, instalējiet.
Kad viss ir instalēts (pietiek ar šīm divām programmām), palaidiet Android Studio.

Tiks atvērts sākuma logs (ja pirmā palaišana), ja ne pirmā, tad tiks atvērts pats IDE, bet tas nemaina būtību, ejam uz SDK pārvaldnieku:


Šeit jums jāatzīmē nepieciešamās Android versijas, ar kurām strādāsit, manā gadījumā tā ir Android 4.4.2, jūs varat izvēlēties vismaz visu uzreiz.

Galvenais ir tas, ka jums jāizvēlas "Rīki" un "Papildu" un noklikšķiniet uz "instalēt paketes".

Tiklīdz viss būs lejupielādēts, IDE sāksies ar blāvi pelēku fonu un vairākām pogām, nospiediet pirmo un izveidojiet jaunu projektu. Ja IDE nekavējoties sākās darba kārtībā, tad: "Fails-> Jauns-> Jauns projekts"


Aizpildiet nepieciešamos laukus un noklikšķiniet uz Tālāk


Atlasiet vajadzīgo android versiju un Tālāk


Šeit mēs izvēlamies Blank Activity (tukša veidne ar Hello, World!)

Nākamajā logā aizpildiet datus klašu izveidei, es skaidrības labad nemainīšu:

Mēs svinīgi nospiežam Finich un gaidām, kamēr IDE konfigurēs un sagatavos visu darbam.

Tiks atvērts logs ar veidlapu noformētāju. Tas nav tas pats, kas Lācars, Delfi, bet kaut kas līdzīgs joprojām ir pieejams:

Nesteidzieties kaut ko mainīt vai noklikšķināt, iestatīšana vēl nav beigusies.
Atveriet "Maksas-> Android-> AVD pārvaldnieks", lai konfigurētu emulatoru.

Šeit, ja nekā nav, noklikšķiniet uz "Cereate Virtual Device", ja tāds ir, jūs nevarat izveidot jaunu, man tas jau bija, jo Es to "paklupu", kamēr to sapratu. Ja jums ir jāizveido jauns emulators, tad tur viss ir vienkārši:
1. Izvēlieties ekrāna izmēru un tālruņa modeli
2. Izvēlieties android versiju (man ir 4.4.2)
3. Ierīces konfigurēšana.

Trešajā solī sīkāk:

T.K. spēle ir izstiepta horizontāli, jums jāizvēlas ainavas režīms.

Kad visi iestatījumi ir ievadīti, noklikšķiniet uz zaļā trīsstūra un palaidiet emulatoru. Pēc palaišanas mēs gaidām, kamēr ierīce tiks pilnībā sāknēta un palaista OS:

Neaizveriet šo logu, tajā notiks emulācija. Tagad varat atgriezties redaktorā un mainīt veidlapas noformētāja orientāciju:

Jūs varat skriet! Tagad tas noteikti ir iespējams.
Ja jums tiek piedāvāts izvēlēties emulatoru, varat atzīmēt tālāk esošo izvēles rūtiņu:

Apsveicu! Viss darbojas, pārbaudīts!

Mēs minimizējam savu emulatoru (bet neaizveriet to!) Un dodieties uz redaktoru, tur viss ir nedaudz sarežģītāk (mazliet).
Jums jāpāriet uz režīmu "Teksts". Sadaļā activity_main ir aprakstīti visi veidlapā esošie elementi. Ieskaitot pašu veidlapu. Un tā nemaz nav forma =).

Jo mēs veidojam spēli HTML5 formātā, un šeit mums ir tikai spēles iesaiņojums, izdzēsiet visu tekstu un ievietojiet šādu informāciju:

Tagad, ja atgriezīsities pie dizaina, tas izskatīsies citādi:

Kā redzat, tagad “Sveiki, pasaule” vietā tiek parādīts pilnekrāna režīms - WebView. Šis objekts ir mūsu "logs" uz spēļu pasauli.

Jūs pat varat skriet, redzēt, vai būs balts ekrāns. Virzieties tālāk.

Un tad mums jādodas uz savu projektu, lai to izdarītu, kreisajā pusē atveriet lauku "Projekts" un atlasiet cilni "Android", ja tā nav atlasīta:

Šī cilne parāda projekta struktūru un visus tā iekšējos failus un resursus.

Spoilera galvene

Mums jāatrod "manifesta" fails un definīcijai jāpievieno "lietojumprogramma" nākamā rinda:
android: hardwareAccelerated = "true"

Ir pienācis laiks strādāt pie mūsu "pārlūkprogrammas" funkcionalitātes, jo tā tas ir! Atveriet klasi "MainActivity.java" un noņemiet visas nevajadzīgās lietas, atstājot tikai galvenās:

Spoilera galvene

Pakotne com.soft.skaner.demogamehtml5; importēt android.support.v7.app.AppCompatActivity; importēt android.os.Bundle; publiskā klase MainActivity paplašina AppCompatActivity (@Orride protected void onCreate (Bundle savedInstanceState) (super.onCreate (savedInstanceState); setContentView (R.layout.activity_main);))

Ja neesat aizmirsis, mēs pievienojām WebView failā activity_main, pievērsiet uzmanību treknrakstā iezīmētajai rindai:
android: layout_width = "fill_parent"
android: layout_height = "fill_parent"
android: id = "@ + id / webView"
android: clickkable = "true"
android: ritjoslas = "nav" />

Mums ir jādeklarē WebView klases objekts.

Lai to izdarītu, importa sarakstam pievienojiet:

Importēt android.webkit.WebView;

Un tad mēs deklarējam savu myWeb objektu MainActivity klasē:

Aizsargāts WebView myWeb;

Tagad, pēc rindas setContentView (R.layout.activity_main); ievietojiet šādu kodu:

/ * Atrodiet mūsu pārlūkprogrammu * / myWeb = (WebView) findViewById (R.id.webView); / * Iestatiet mūsu pārlūkprogrammu * / myWeb.getSettings (). SetUseWideViewPort (true); myWeb.setInitialScale (1); myWeb.getSettings (). setJavaScriptEnabled (true); / * Ielādējiet lapu */myWeb.loadUrl ("fails: ///android_asset/index.html");

Redaktora rīcībā ir šāda informācija:

Un lūk, kas ir emulatorā:

Ja jūs darāt to pašu - mēs esam uz pareizā ceļa!

Atliek tikai maz darīt:
Vietnē, kur mēs ielādējam lapu savā pārlūkprogrammā, faila ceļš izskatās šādi: "file: ///android_asset/index.html"
Jāatzīmē, ka mēs varam glabāt jebkādus failus savā spēlē, piekļūstot tiem.

Mūsu gadījumā atslēgu mape: "android_asset", izveidosim to (jā, pēc noklusējuma tas nav projektā):
"Fails -> Jauns -> Mape -> Īpašumu mape", tiks atvērts logs, kurā jums vienkārši jāpiekrīt IDE.
Vai esat ievērojuši? Projektā parādījās jauna mape:

Noklikšķiniet uz tā ar peles labo pogu -> "Rādīt failos", tiks atvērts sistēmas pētnieks (manā gadījumā Nautilus), pievērsiet uzmanību ceļam uz mapi. Ņemiet vērā arī to, ka mapi sauc par “īpašumiem”, bet tai var piekļūt, izmantojot “android_asset”.

Tad viss ir pavisam vienkārši - nokopējiet mūsu spēli aktīvu mapē:

Fails index.html ir tas pats indekss no šī raksta sākuma. Nu, mēģināsim to palaist!

Neliels padoms: vislabāk ir pārbaudīt, izmantojot reālu ierīci, izmantojot USB, tāpēc testa rezultāti būs skaidrāki, un peles vadība nav ērtākā iespēja, nemaz nerunājot par vairākiem klikšķiem.

Solis 3. Android Studio. Izveidojiet lietotni un parakstiet to

Kad esat pilnībā atkļūdojis spēli (pārlūkprogrammā vai emulatorā), iesaiņojums ir pilnībā gatavs un visi izstrādes posmi ir beigušies, varat izveidot lietojumprogrammu. Android Studio ļauj veidot lietotnes un parakstīt tās ar savām atslēgām.

Lai izveidotu atslēgas, šim IDE ir īpaša lietderība"KeyTool".

Sāksim ar lietojumprogrammas izpildāmā faila izveidi ("Veidot -> Ģenerēt parakstītu APK"):

Ja iepriekš neesat izveidojis atslēgas un aizstājvārdus, noklikšķiniet uz "Izveidot jaunu"
Jūs varat aizpildīt laukus pēc saviem ieskatiem, datu precizitāte ir pilnībā jūsu ziņā.

Pirmais lauks ir ceļš uz mapi, kurā tiks saglabāta atslēga.
Pēc noklikšķināšanas uz Labi veidlapa tiks aizpildīta automātiski:

Turpmākajām lietojumprogrammām nav nepieciešams izveidot jaunas atslēgas, jūs varat parakstīt citas lietojumprogrammas ar savu atslēgu, tieši tam ir paredzēta poga "Izvēlēties esošo".
Nākamajā darbībā IDE lūgs ievadīt paroli vēlreiz un pēc tam norādīs mapi, kurā saglabāt APK failu.
admin virsrakstā Uncategorized. Grāmatzīme.

Pavadot vairākas dienas pēc kārtas (bez miega pārtraukuma), pētot visu iecienītāko Android sīkrīku HTML5 atbalstu, es nolēmu, ka šai tēmai jāpievērš uzmanība. Rakstā es mēģināšu soli pa solim atklāt visus HTML5 spēles lietojumprogrammas izveides posmus (protams, pamata / atslēgas / galvenās) Android ierīcēm no idejas līdz paša APK faila izlaišanai. Iespējams, es neatvēru neko jaunu cienījamiem izstrādātājiem, bet iesācējiem es centīšos visu aprakstīt pēc iespējas vienkāršāk, ar ekrānuzņēmumiem un paskaidrojumiem.

Es aicinu tos, kas vēlas uzzināt vairāk zem kaķa.

Ideja

Kopumā jūs varat daudz runāt par Android potenciālu, par HTML5 attīstību un par to mijiedarbību. Es to nedarīšu. Tātad, tieši pie lietas.

Ideja par spēles izveidi operētājsistēmai Android, visticamāk, ir prātā desmitiem simtu izstrādātāju un tiem, kas sevi uzskata par tādiem. Es neesmu izņēmums.

Viss process tiks sadalīts vairākos posmos, un galīgais pieteikums sastāvēs no divām daļām:
- Iesaiņotājs (šajā gadījumā Android ierīcēm)
- Spēle

Solis 1. Pašas spēles rakstīšana

Vēl viens pluss spēles rakstīšanai HTML5 ir fakts, ka testēšanai nav nepieciešama virkne darbināmu programmu, IDE, emulatoru utt. Viss, kas jums nepieciešams, ir pārlūkprogramma (manā gadījumā tas ir Chromium) un teksta redaktors (BlueFish)

Spēle nebūs grūta: ir zils taisnstūris un ir zaļš taisnstūris. Spēlētāja uzdevums ir vilkt zilo taisnstūri uz zaļo, apejot sarkano, kas pārvietojas pa spēles laukumu patvaļīgā virzienā.

Spēles attīstībai es izmantošu J2ds (spēles dzinējs).

Pabeigts spēles kods:

index.html

Demo spēle vietnē J2ds v.0



Jūs varat ignorēt spēles koda kvalitāti, jo tas nav raksta mērķis. Lai gan, protams, jūs varat optimizēt, cik vēlaties, šis process kopumā, iespējams, ir bezgalīgs.

Solis 2. Android Studio. Iesaiņojuma izveide spēlei

Es nevienam netaisos mērīt šī vai tā IDE vēsumu Android izstrādei, bet parādīšu to, izmantojot piemēru Android Studio. Darbam mums ir nepieciešams:
- Java mašīna (OpenJDK ir piemērota manam Linux);
- Android Studio izplatīšanas komplekts.

Lejupielādējiet, instalējiet.

Kad viss ir instalēts (pietiek ar šīm divām programmām), palaidiet Android Studio.

Tiks atvērts sākuma logs (ja pirmā palaišana), ja ne pirmā, tad tiks atvērts pats IDE, bet tas nemaina būtību, ejam uz SDK pārvaldnieku:

Šeit jums jāatzīmē nepieciešamās Android versijas, ar kurām strādāsit, manā gadījumā tā ir Android 4.4.2, jūs varat izvēlēties vismaz visu uzreiz.

Galvenais ir tas, ka jums jāizvēlas "Rīki" un "Papildu" un noklikšķiniet uz "instalēt paketes".

Tiklīdz viss būs lejupielādēts, IDE sāksies ar blāvi pelēku fonu un vairākām pogām, nospiediet pirmo un izveidojiet jaunu projektu. Ja IDE nekavējoties sākās darba kārtībā, tad: "Fails-> Jauns-> Jauns projekts"


Aizpildiet nepieciešamos laukus un noklikšķiniet uz Tālāk


Atlasiet vajadzīgo android versiju un Tālāk


Šeit mēs izvēlamies Blank Activity (tukša veidne ar Hello, World!)

Nākamajā logā aizpildiet datus klašu izveidei, es skaidrības labad nemainīšu:

Mēs svinīgi nospiežam Finich un gaidām, kamēr IDE konfigurēs un sagatavos visu darbam.

Tiks atvērts logs ar veidlapu noformētāju. Tas nav tas pats, kas Lācars, Delfi, bet kaut kas līdzīgs joprojām ir pieejams:

Nesteidzieties kaut ko mainīt vai noklikšķināt, iestatīšana vēl nav beigusies. Atveriet "Maksas-> Android-> AVD pārvaldnieks", lai konfigurētu emulatoru.

Šeit, ja nekā nav, noklikšķiniet uz "Izveidot virtuālo ierīci", ja tāds ir, jūs nevarat izveidot jaunu, man tas jau bija, jo Es to "paklupu", kamēr to sapratu. Ja jums ir jāizveido jauns emulators, tad tur viss ir vienkārši:
1. Izvēlieties ekrāna izmēru un tālruņa modeli
2. Izvēlieties android versiju (man ir 4.4.2)
3. Ierīces konfigurēšana.

Trešajā solī sīkāk:

T.K. spēle ir izstiepta horizontāli, jums jāizvēlas ainavas režīms.

Kad visi iestatījumi ir ievadīti, noklikšķiniet uz zaļā trīsstūra un palaidiet emulatoru. Pēc palaišanas mēs gaidām, kamēr ierīce tiks pilnībā sāknēta un palaista OS:

Neaizveriet šo logu, tajā notiks emulācija. Tagad varat atgriezties redaktorā un mainīt veidlapas noformētāja orientāciju:

Jūs varat skriet! Tagad tas noteikti ir iespējams.

Ja jums tiek piedāvāts izvēlēties emulatoru, varat atzīmēt tālāk esošo izvēles rūtiņu:

Apsveicu! Viss darbojas, pārbaudīts!

Mēs minimizējam savu emulatoru (bet neaizveriet to!) Un dodieties uz redaktoru, tur viss ir nedaudz sarežģītāk (mazliet).
Jums jāpāriet uz režīmu "Teksts". Sadaļā activity_main ir aprakstīti visi veidlapā esošie elementi. Ieskaitot pašu veidlapu. Un tā nemaz nav forma.

Jo mēs veidojam spēli HTML5 formātā, un šeit mums ir tikai spēles iesaiņojums, izdzēsiet visu tekstu un ievietojiet šādu informāciju:

Tagad, ja atgriezīsities pie dizaina, tas izskatīsies citādi:

Kā redzat, tagad “Sveiki, pasaule” vietā tiek parādīts pilnekrāna režīms - WebView. Šis objekts ir mūsu "logs" uz spēļu pasauli.

Jūs pat varat skriet, redzēt, vai būs balts ekrāns. Virzieties tālāk.


Šī cilne parāda projekta struktūru un visus tā iekšējos failus un resursus.

Skaidrojums

Mums jāatrod "manifesta" fails un "lietojumprogrammas" definīcijai jāpievieno šāda rinda:
android: hardwareAccelerated = "true"

Ir pienācis laiks strādāt pie mūsu "pārlūkprogrammas" funkcionalitātes, jo tā tas ir! Atveriet klasi "MainActivity.java" un noņemiet visas nevajadzīgās lietas, atstājot tikai galvenās:

Skaidrojums

pakete com.soft.skaner.demogamehtml5; importēt android.support.v7.app.AppCompatActivity; importēt android.os.Bundle; publiskā klase MainActivity paplašina AppCompatActivity (@Orride protected void onCreate (Bundle savedInstanceState) (super.onCreate (savedInstanceState); setContentView (R.layout.activity_main);))

Ja neesat aizmirsis, mēs pievienojām WebView failā activity_main, pievērsiet uzmanību treknrakstā iezīmētajai rindai:
android: layout_width = "fill_parent"
android: layout_height = "fill_parent"
android: id = "@ + id / webView"
android: clickkable = "true"
android: ritjoslas = "nav" />

Mums ir jādeklarē WebView klases objekts.

Lai to izdarītu, importa sarakstam pievienojiet:

Importēt android.webkit.WebView;
Un tad mēs deklarējam savu myWeb objektu MainActivity klasē:

Aizsargāts WebView myWeb;
Tagad, pēc rindas setContentView (R.layout.activity_main); ievietojiet šādu kodu:

/ * Atrodiet mūsu pārlūkprogrammu * / myWeb = (WebView) findViewById (R.id.webView); / * Iestatiet mūsu pārlūkprogrammu * / myWeb.getSettings (). SetUseWideViewPort (true); myWeb.setInitialScale (1); myWeb.getSettings (). setJavaScriptEnabled (true); / * Ielādējiet lapu */myWeb.loadUrl ("fails: ///android_asset/index.html");

Redaktora rīcībā ir šāda informācija:

Un lūk, kas ir emulatorā:

Ja jūs darāt to pašu - mēs esam uz pareizā ceļa!

Atliek tikai maz darīt:
Vietnē, kur mēs ielādējam lapu savā pārlūkprogrammā, faila ceļš izskatās šādi: "file: ///android_asset/index.html"
Jāatzīmē, ka mēs varam glabāt jebkādus failus savā spēlē, piekļūstot tiem.

Mūsu gadījumā atslēgu mape: "android_asset", izveidosim to (jā, pēc noklusējuma tas nav projektā):
"Fails -> Jauns -> Mape -> Īpašumu mape", tiks atvērts logs, kurā jums vienkārši jāpiekrīt IDE.
Vai esat ievērojuši? Projektā parādījās jauna mape:

Noklikšķiniet uz tā ar peles labo pogu -> "Rādīt failos", tiks atvērts sistēmas pētnieks (manā gadījumā Nautilus), pievērsiet uzmanību ceļam uz mapi. Ņemiet vērā arī to, ka mapi sauc par “īpašumiem”, bet tai var piekļūt, izmantojot “android_asset”.

Fails index.html ir tas pats indekss no šī raksta sākuma. Nu, mēģināsim to palaist!

Neliels padoms: vislabāk ir pārbaudīt, izmantojot reālu ierīci, izmantojot USB, tāpēc testa rezultāti būs skaidrāki, un peles vadība nav ērtākā iespēja, nemaz nerunājot par vairākiem klikšķiem.

Solis 3. Android Studio. Izveidojiet lietotni un parakstiet to

Kad esat pilnībā atkļūdojis spēli (pārlūkprogrammā vai emulatorā), iesaiņojums ir pilnībā gatavs un visi izstrādes posmi ir beigušies, varat izveidot lietojumprogrammu. Android Studio ļauj veidot lietotnes un parakstīt tās ar savām atslēgām.

Lai šajā IDE izveidotu atslēgas, ir īpaša utilīta "KeyTool".

Sāksim ar lietojumprogrammas izpildāmā faila izveidi ("Veidot -> Ģenerēt parakstītu APK"):

Ja iepriekš neesat izveidojis nevienu atslēgu vai aizstājvārdu, noklikšķiniet uz “Izveidot jaunu”. Jūs varat aizpildīt laukus pēc saviem ieskatiem, datu precizitāte ir pilnībā jūsu ziņā.

Pirmais lauks ir ceļš uz mapi, kurā tiks saglabāta atslēga. Pēc noklikšķināšanas uz Labi veidlapa tiks aizpildīta automātiski:

Nākamajām lietojumprogrammām nav nepieciešams izveidot jaunas atslēgas, ar savu atslēgu varat parakstīt arī citas lietojumprogrammas, tāpēc ir poga "Izvēlēties esošo".

Nākamajā darbībā IDE lūgs ievadīt paroli vēlreiz un pēc tam norādīs mapi, kurā saglabāt APK failu.

Tagad jūs varat atpūsties un dzert, piemēram, kafiju. Sistēma sāka apkopot, rezultāts statusa joslā:

Pēc apkopošanas pabeigšanas sistēma jūs par to informēs.

Tagad jums vienkārši jāpārvieto fails uz tālruni / planšetdatoru un jāinstalē tā kā parasta lietojumprogramma.

Rezultāts:

Piemēram, LAN, ja nepieciešams.