Petanque / Jeu-de-Boules-telling hou aansoek: 7 stappe

2024 Outeur: John Day | [email protected]. Laas verander: 2024-01-30 07:24

Dit is 'n Petanque -telling -toepassing (soms Jeu de Boules genoem) vir Android. Hierdie toepassing kan gebruik word net soos dit is en is volledig funksioneel. Of dit kan gebruik word in kombinasie met die Petanque Matrix -skerm [aparte instruksies]. Hierdie deel van die projek is maklik, aangesien geen hardeware nodig is nie, slegs gratis beskikbare sagteware.

Voorrade

1. 'N Android -versoenbare telefoon (verkieslik)
2. 'N Toestel met toegang tot die internetblaaier, verkieslik 'n rekenaar met 'n muis vir kodering en ontwerp
3. 'N Rekening by MIT App Inventor (gratis)
4. 'N Eenvoudige tekenpakket bv. Pixlr of Gimp (alles gratis)
5. 'N Ikoonhulpbronwebwerf, bv. Materiaal -UI -ikone of Material.io (alles gratis)

Sagteware en bronkode:

U kan onderaan hierdie bladsy 'n skakel na die werklike Petanque -toepassing vind. Hier kan u ook 'n skakel na die volledige bronkode vind (jammer hiervoor, maar Instructables laat my nie toe om 'n.aia -lêer op te laai nie …).

Stap 1: Anatomie en navigasie van die app

Die ontwerp en navigasie van die app is redelik eenvoudig. Daar is altesaam 4 skerms:

1. Hoofskerm nommer 1 (waar ons die meeste van ons tyd spandeer om telling te behou)
2. Wedstrydskerm #2 (waar ons 'n lys van alle gespeelde wedstryde en tellings vind)
3. Instellingsskerm #3 (instellings vir die app, administratiewe take, ontfouting, ens.)
4. Oor skerm #0 (die ongeveer, logo en waar u die bouinstruksies kan kry, dws hierdie webblad)

Die uitleg van die skerms en die posisie van die knoppies is geoptimaliseer vir gebruik met 1 hand en 1 vinger (duim). Die knoppies op die onderste navigasiekieslys neem u na die skerms regs of links van die huidige skerm. So knoppie 0 bring u na die skerm ongeveer 0. En knoppie #1 bring u terug na die hoofskerm #1 ens., Usw.

Duidelik? Dan kan ons voortgaan …

Stap 2: Die data (basis) ontwerp

Voordat ons die eerste skerm skep, het ons 'n plek nodig om al die data wat hierdie app sal gebruik, te stoor. Hiervoor gebruik ons die eenvoudigste vorm wat die MIT App Inventor kan bied: TinyDB. Dit is redelik beperk, aangesien dit slegs 'n sleutel/waarde -paar kan stoor, maar met 'n bietjie hulp en 'n paar truuks kan ons dit alles laat doen wat ons wil.

Daar is 2 soorte waardes wat ons sal stoor:

• Ons sal tien eenvoudige sleutel-/waarde-app-brede waardes stoor (soos getoon in die 'CreateIgnoreList'-funksie hierbo).
• En 'n meer komplekse sleutel/waarde wat al die voltooide speldata in een string stoor, met die 'CurrentMatch' -sleutel/waarde wat as die primêre sleutel * dien (soos getoon in die' SaveScore' -funksie hierbo). Hierdie velde in hierdie sleutel-/waardepaar word geskei deur 'n nie-visuele beheerkarakter '\ t'. Met hierdie kontrolekarakter kan ons in die wedstrydskerm #2 al die waardes in sy afsonderlike komponente ophaal en dit vertoon en sorteer. Maar meer hieroor in die afdeling Screen 2 (matches).

* Meer inligting oor hoe om 'n PrimaryKey vir TinyDb in AppInventor op YouTube te skep.

Stap 3: Skerm 1 (hoof)

Dit is ons 'werkperd' -skerm waar ons die meeste tyd as gebruiker van die app sal deurbring. Dit is ook die beginpunt vir ons MIT App Inventor -app.

Soos u kan sien van (prentjie #1) hierbo, hoewel die skerm eenvoudig is, is daar baie verborge interaktiwiteit, fouthantering, blaai, gesplete skerm, drywende spyskaart, swaai gebare, beskerm teen foute, verkeerde insette en selfs herstel van ongelukke. Kyk na die gedetailleerde bronkode vir elke skerm vir al hierdie funksies. So, wat kan u hier doen:

• Druk 'Span 1' en u kry 'n kennisgewing waarmee u die naam van 'Span 1' kan verander. Sodra dit verander is, sal hierdie 'Span 1' verander na die naam wat u gekies het. Dit is ook die naam wat u 'spel' en 'wedstryd' telling (in die volgende skerms) weerspieël.
• Die 'telling van span 1' en 'telling van span 2' verander op grond van die '+' en '-' knoppies onderaan elke span. As die telling 0 is en '-' ingedruk word, word 'n hoorbare en visuele sein verskaf, maar die telling bly 0 (natuurlik).
• As 'n 'telling' 13 bereik, gebeur daar 'n paar dinge: 'n visuele sein word verskaf, 'n kennisgewingvenster wys die resultate (prent 2) en bied u die opsie om 'n nuwe speletjie of 'n nuwe wedstryd te begin (en natuurlik 'n nuwe spel). As u egter nie die klassieke Petanque-telling gekies het nie, maar die 2-punt-verskil-telling (wat in die instellingsskerm #3 gekies kan word), dan word een as die wenner verklaar, afhangende van die verskil tussen twee spanne (soos op foto #3 getoon).
• Die 'telling' in die huidige 'wedstryd' word in die middel van die skerm tussen die 'Span 1' en 'Span 2' tellings getoon. En dit sal aanhou tabelleer totdat 'n nuwe 'wedstryd' begin word.
• Om na ander skerms te navigeer, kan u ook 'na links vee' om die About -skerm #0 of 'regsvee' te wys om die wedstryd -skerm #2 te wys.

Uiteindelik is die navigasie -menubalk onderaan. Dit is altyd op die absolute onderkant van die skerm, ongeag die grootte van die skerm. Selfs as die Android 'Split screen' -funksie gebruik word. Die onderste navigasiekieslys het 3 knoppies:

1. Links onder: die '?' Die knoppie gaan links en wys weer die aanvanklike begin-skerm oor (#0).
2. Onder-middel: met die reset-knoppie (wat soos 'n '@' met 'n pyl lyk), kan u 'n nuwe speletjie of 'n nuwe wedstryd op 'enige tyd' in die spel begin, net deur op die middelste 'Reset' -knoppie te druk. Dit is ook 'n kennisgewingvenster wat u sal vra om 'n nuwe speletjie of 'n nuwe wedstryd te begin.
3. Regs onder: Die '->' knoppie sal regs verskyn en 'n oorsig van alle wedstryde se skerm (#2) wys.

Stap 4: Skerm 2 (wedstryde)

Alhoewel dit baie eenvoudig is in visuele grimering, bevat hierdie skerm die meer interessante kode as die ander skerms. Maar voordat ons daarop ingaan, kan ons sien wat die skerm doen:

Onder die etikette 'Span 1' en 'Span 2' is 'n lys van al die wedstryde en hul onderskeie totale tellings. Dit is 'n gesorteerde lys met die 'laaste gespeelde wedstryd' bo en die 'oudste gespeelde wedstryd' onderaan.

In die middel, tussen 'Span 1' en 'Span 2', is 'n knoppie waarmee die lys Wedstryde in stygende of dalende volgorde gesorteer kan word. Die ikoon sal verander na gelang van die gekose sorteerrigting.

Om na ander skerms te navigeer, kan u ook 'na links vee' om die hoofskerm nommer 1 te wys of 'regs te vee' om die instellingsskerm #3 te wys.

Uiteindelik is die navigasie -menubalk onderaan. Dit is altyd op die absolute onderkant van die skerm, ongeag die grootte van die skerm. Selfs as die Android 'Split screen' -funksie gebruik word (soos getoon in prentjie 2). Die onderste navigasiekieslys het 3 knoppies:

1. Links onder: die '?' Die knoppie gaan links en wys weer die aanvanklike begin-skerm oor (#0).
2. Onder-middel: met die reset-knoppie (wat soos 'n '@' met 'n pyl lyk), kan u 'n nuwe speletjie of 'n nuwe wedstryd op 'enige tyd' in die spel begin, net deur op die middelste 'Reset' -knoppie te druk. Dit is ook 'n kennisgewingvenster wat u sal vra om 'n nuwe speletjie of 'n nuwe wedstryd te begin.
3. Regs onder: Die '->' knoppie sal regs verskyn en 'n oorsig van die skerms van alle wedstryde (#2) wys.

Sentreer die lys wedstryde op die skerm:

Ek wou die lys wedstryde wat op die skerm gesentreer is, wys met die '-' verdeler as die middel. Omdat die aantal wedstryde wat 'n span gewen het, 1 of meer syfers kan wees en die werklike naam van elke span van grootte kan verskil, kan ons dit nie net in 1 lys plaas nie. Dit sal alles so lyk:

Span 1 0 - 1 Span 2

Foo 1 - 42 FooBar

Die etiket vir die '-' verdeler moet dus gesentreer wees. Met die 'Span 1-naam' en 'Span 1-telling' regs in die linkerkant van die '-' verdeler. En die 'Span 2-telling' en 'Span 2-naam' is linksbelyn regs van die '-' verdeler. Ons eindig dus so:

"Span 1 0" "-" "1 Span 2" "Foo 1" "-" "42 FooBar"

En aangesien ek nie weet hoe lank ons lys van wedstryde sal wees nie, plaas ek al die 'span 1 -naam' en 'span 1 -telling' in dieselfde HTMLFormat -etiket en plaas ek na elke wedstryd 'n en sit die volgende een op 'n NewLine.

Maak dinge gereed vir sorteer:

Soos genoem in die The Data (basis) ontwerpstap, kan ek slegs 'n enkele waarde stoor. So het ek die waardes van 'Span 1-naam', 'Span 1-telling', 'Span 2-telling' en 'Span 2-naam' gestoor, geskei deur 'n nie-visuele beheerkarakter '\ t'. Nou moet ek dit eers uit die databasis haal (soos getoon in prentjie #3).

Die kodefragment toon dat ons eers kyk of die Debug-vlag ingestel is (dit word op elke skerm van hierdie toepassing gedoen. Vervolgens word 'n lys met sleutel (e/waardepare) gemaak wat ons moet ignoreer wanneer ons deur die databasis gaan. Ons is slegs geïnteresseerd in die 'Match' -data, niks anders nie. Ons blaai dan deur die databasis en ignoreer alle sleutels op die Ignorelist en skep 'n nuwe lys met 2 waardes:

1. Die primêre sleutel (onthou dat dit 'n nommer is wat die pasmaatnommer aandui, begin met pasmaat 1)
2. 'N Tou wat die waardes bevat vir' Span 1 -naam ',' Span 1 -telling ',' Span 2 -telling 'en' Span 2 -naam '

Ons gaan dan deur die lys en skep 'n nuwe lys lyste waar die individuele velde in individuele items verdeel word (soos in prentjie 4):

DataToSort -> Lysindeks 1 -> Lysindeks 1 (PK -nommer)

-> Lysindeks 2 (Spannaam 1) -> Lysindeks 3 (Span telling 1) -> Lysindeks 4 (Span telling 2) -> Lysindeks 5 (Spannaam 2) -> Lysindeks 2 -> Lysindeks 1 (PK -nommer) -> Lysindeks 2 (spannaam 1) -> … -> …

Daarna wys ons 'n paar ontfoutingsinligting as die Debug -vlag waar is. En nou kan ons uiteindelik ons lys (van lyste) sorteer.

BubbleSort* 'n Lys van lyste:

Foto #5 toon die volledige lys van BubbleSort* ons lys lyste. Hierdie algoritme kan natuurlik vir enige lys van lyste gebruik word, ongeag hoeveel indeks daar is.

* Meer inligting oor hoe eenvoudig die BubbleSort -algoritme op YouTube is.

Stap 5: Skerm 3 (instellings)

Hierdie skerm lyk baie besig en het baie visuele ontwerpelemente. Maar uiteindelik is daar net 5 skakelaars:

1. 'Fred -telling': as dit aangeskakel is, verander dit die tellinggedrag en besluit die wenner op grond van 'n 2 -puntverskil op 13 en nie net die eerste een wat 13 bereik nie.
2. 'Bluetooth -koppeling': (indien geaktiveer) as dit aangeskakel is, kan dit gekoppel word met die van hierdie toepassing met die eksterne Petanque -skerm.
3. 'Herstel wedstryde': as dit aangeskakel is, sal dit alle wedstryde herstel/uitvee en met wedstryd 1 begin.
4. 'Herstel DB': as dit aangeskakel is, word alle wedstryde en alle ander programinstellings verwyder/teruggestel na die oorspronklike instellings, insluitend die huidige telling, wedstryde, spanname, ontfoutingsinstellings, sorteervolgorde, luetooth -instellings (indien geaktiveer) ens.
5. 'Ontfout': as dit aangeskakel is, sal dit ontfoutingsinligting in die hele app tussen vierkantige hakies '' wys. Dinge soos 'Totale aantal rekords, Totale aantal veranderlikes, Huidige wedstrydnommer, Game PK -nommer, ens.

Uiteindelik is die navigasie -menubalk onderaan. Dit is altyd op die absolute onderkant van die skerm, ongeag die grootte van die skerm. Selfs as die Android 'Split screen' -funksie gebruik word of die skerm net langer is as wat die skerm kan vertoon as gevolg van die aantal items op die skerm. As dit die geval is, kan u altyd blaai deur op en af te vee. Hierdie navigasiekieslys onderaan het net 1 knoppie:

Links onder: die '<-' knoppie gaan links en wys die aanvanklike vertoning van die skerm van alle wedstryde (#2)

Stap 6: Skerm 0 (ongeveer)

Die laaste skerm. Net inligting, niks meer nie.

Hierdie skerm word die eerste keer gewys dat hierdie toepassing begin word. Daarna sal dit nooit weer gewys word nie, tensy u dit gekies het deur op die '?' Te druk knoppie op die hoofskerm #1.

Die menubalk onderaan die navigasie het slegs 1 knoppie en dit bring u terug na die hoofskerm #1.

Stap 7: Sagteware en/of bronkode

Ten slotte.

U kan die toepassing vanaf hierdie Google Drive -ligging aflaai.

U kan die kode aflaai van die MIT App Inventor Gallery -inskrywing vir Pentaque (prentjie #1). Hiermee kan u die projek in u eie MIT App Inventor -rekening stoor (u kan dit hernoem na wat u wil). Van daaruit kan u al die kode in die Blocks -redakteur sien, die skerms in die Designer -redakteur en al die media en hulpbronne wat vir hierdie projek gebruik word.

U kan ook die bronkode ('n.aia -lêer, wat eintlik 'n.zip -lêer is) vanaf hierdie Google Drive -plek aflaai.