Opprett et Hangman-spill Brukerinteraksjon

I denne serien lager vi et Hangman-spill for Android-plattformen. Så langt har vi bygget programmets brukergrensesnitt, inkludert bilder, drawables og layouter. I denne tredje og siste avdrag skal vi fokusere på brukerinteraksjon.


Introduksjon

Å legge til brukerinteraksjon i spillet innebærer flere aspekter, blant annet å oppdage om brukeren vinner eller mister et spill, i tillegg til å svare på hver hendelse. Vi legger også til en hjelpeknapp i handlingslinjen og legger til muligheten til å navigere i spillet.

For å oppdatere minnet ditt, er dette det siste spillet vil se ut.



1. Forbered brukergrensesnittet

Trinn 1

Som vi så i forrige veiledning, presenterer spillaktiviteten galgenområdet med de seks kroppsdelene som er trukket på skjermen. Når et nytt spill starter, må kroppsdelene bli skjult, bare vise dem når brukeren gjør feil gjetning. Åpne spillets aktivitetsklasse og start med å legge til følgende importerklæringer til den.

importer android.app.AlertDialog; importer android.content.DialogInterface; importer android.support.v4.app.NavUtils; importer android.view.Menu; importer android.view.MenuItem; importer android.view.View; importer android.widget.ImageView;

Deretter erklæres fem instansvariabler i klassens grensesnitt.

// kroppsdeler bilder Private ImageView [] bodyParts; // antall kroppsdeler privat int numParts = 6; // nåværende del - vil øke når feil svar blir valgt private int currPart; // Antall tegn i gjeldende ord Private Int NumChars; // nummer riktig gjettet privat int numCorr;

Du kan endre antall kroppsdeler hvis du for eksempel vil legge til flere vanskelighetsgrader for spillet. Ved å lagre gjeldende kroppsdel ​​(currPart), kan vi legge til en kroppsdel ​​om gangen hvis spilleren gjør feil gjetning. Vi bruker bokstavstellingen til målordet og antall riktige gjetninger for å holde oversikt over spillerens fremgang i dagens spill. Vi kontrollerer jevnlig om spilleren har vunnet eller mistet spillet.

I onCreate metode for spillets aktivitetsklasse, rett før vi påberoper spill, Vi instantierer bildevisningsarrangementet og henter kroppsdelbildene vi plasserte i oppsettet. Denne kodestykket bestemmer også rekkefølgen som kroppsdelene vises når spilleren gjør feil gjetning. Vi starter med hodet og slutter med beina.

bodyParts = ny ImageView [numParts]; bodyParts [0] = (ImageView) findViewById (R.id.head); bodyParts [1] = (ImageView) findViewById (R.id.body); bodyParts [2] = (ImageView) findViewById (R.id.arm1); bodyParts [3] = (ImageView) findViewById (R.id.arm2); bodyParts [4] = (ImageView) findViewById (R.id.leg1); bodyParts [5] = (ImageView) findViewById (R.id.leg2);

Steg 2

I spill metode, legg til følgende kodestykke. Vi setter currPart til 0, sett NUMCHARS til lengden på målordet og sett numCorr til 0.

currPart = 0; NUMCHARS = currWord.length (); numCorr = 0;

Før vi starter spillet, må kroppsdelene være skjult.

for (int p = 0; s < numParts; p++)  bodyParts[p].setVisibility(View.INVISIBLE); 

Neste skjermbilde viser hvordan spillet skal se ut når et nytt spill skal begynne.



2. Svar på brukerklikk

Trinn 1

Når vi opprettet layoutet for brevknappene, erklærte vi en ved trykk metode. La oss legge til dette i spillets aktivitet.

Offentlig ugyldig brevPressed (View view) // brukeren har trykket på et brev til å gjette

Når spilleren tapper en bokstavsknapp for å gjette, letterPressed mottar en referanse til visningen. Dette gjør at vi kan finne ut hvilket brev spilleren har valgt. For å finne ut hvilket brev spilleren har tappet, bruker vi følgende kodestykke.

String ltr = ((TextView) visning) .getText (). ToString ();

Deretter får vi tegnet fra strengen.

char letterChar = ltr.charAt (0);

Vi deaktiverer også bokstavknappen og oppdaterer bakgrunnen som kan trekkes for å vise spilleren at brevet allerede er spilt.

view.setEnabled (false); view.setBackgroundResource (R.drawable.letter_down);

I neste trinn løper vi gjennom tegnene i målordet for å bekrefte om spillerens gjetning er i den. Hver bokstav i målordet blir sammenlignet med spillerens gjetning. Hvis spillerens gjetning matcher et brev i målordet, øker vi numCorr, sett riktig til ekte for å indikere at spilleren gjorde et godt gjetning, og oppdatere brevets tekstfarge fra hvitt til svart for å gjøre det synlig. De til loop fortsetter til hvert bokstav i målordet er blitt sjekket. Dette er viktig fordi et brev kan forekomme mer enn en gang i målordet.

boolsk korrekt = false; for (int k = 0; k < currWord.length(); k++)  if(currWord.charAt(k)==letterChar) correct = true; numCorr++; charViews[k].setTextColor(Color.BLACK);  

Steg 2

Deretter må vi verifisere om spilleren har vunnet eller mistet spillet etter gjetningen, eller gjort feil gjetning, men kan fortsatt fortsette. Fortsatt inni letterPressed, begynn med å sjekke om spilleren har gjort et godt gjetning.

hvis (riktig) // riktig gjetning

Hvis hun gjorde et godt gjetning, sjekk om hun gjettet alle bokstavene til målordet.

hvis (numCorr == numChars) // brukeren har vunnet

Hvis dette er sant, informerer vi spilleren om at hun har vunnet spillet. Det første vi gjør er å deaktivere bokstavknappene. Vi gjør dette ved å implementere en annen hjelpemetode, disableBtns. Implementer denne metoden etter letterPressed.

Offentlig tomrom disableBtns () int numLetters = letters.getChildCount (); for (int l = 0; l < numLetters; l++)  letters.getChildAt(l).setEnabled(false);  

I disableBtns, Vi løper gjennom visningene via adapteren og deaktiverer hver knapp. Hvis brukeren har vunnet spillet, påberoper vi oss disableBtns og vise en varslingsdialog til brukeren. I varslingsdialogen, spør vi også spilleren om de vil spille et annet spill.

Ta deg tid til å se over dette hvis du ikke er kjent med dialoger på Android. Vi setter egenskapene, inkludert tittel og en melding, inkludert bekreftelse på riktig svar. Vi legger til en knapp for å spille igjen i varseldialogen, som ringer til spill metode. Vi legger også til en knapp for å avslutte, som tar spilleren tilbake til hovedaktiviteten.

hvis (numCorr == numChars) // Deaktiver knapper disableBtns (); // Display Alert Dialog AlertDialog.Builder winBuild = ny AlertDialog.Builder (dette); winBuild.setTitle ( "YAY"); winBuild.setMessage ("Du vinner! \ n \ n Svaret var: \ n \ n" + currWord); winBuild.setPositiveButton ("Play Again", ny DialogInterface.OnClickListener () public void onClick (DialogInterface dialog, int id) GameActivity.this.playGame ();); winBuild.setNegativeButton ("Exit", ny DialogInterface.OnClickListener () public void onClick (DialogInterface dialog, int id) GameActivity.this.finish ();); winBuild.show (); 

Trinn 3

Hvis brukeren ikke har vunnet spillet, må vi bekrefte om hun har svart feil, men har fortsatt noen gjetninger igjen. Inne i eller hvis blokkere, vi viser neste kroppsdel ​​og øker antall feil gjetninger med 1.

hvis (riktig) // riktig gjetning annet hvis (currPart < numParts)  //some guesses left bodyParts[currPart].setVisibility(View.VISIBLE); currPart++; 

Trinn 4

Etter eller hvis, Vi kan trygt anta at spilleren har mistet spillet. Vi starter med å deaktivere knappene som vi gjorde tidligere, og vi viser en varslingsdialog som angir at spilleren har mistet spillet. Vi inkluderer også det riktige svaret og tilbyr muligheten til å spille et annet spill.

ellers // brukeren har mistet disableBtns (); // Display Alert Dialog AlertDialog.Builder loseBuild = ny AlertDialog.Builder (dette); loseBuild.setTitle ( "Uff"); loseBuild.setMessage ("Du mister! \ n \ n Svaret var: \ n \ n" + currWord); loseBuild.setPositiveButton ("Play Again", ny DialogInterface.OnClickListener () public void onClick (DialogInterface dialog, int id) GameActivity.this.playGame ();); loseBuild.setNegativeButton ("Exit", ny DialogInterface.OnClickListener () public void onClick (DialogInterface dialog, int id) GameActivity.this.finish ();); loseBuild.show (); 

Tro det eller ei, vi er ferdige med å implementere brukerens interaksjonsaspekt av spillet. Alt som er igjen for oss å gjøre, er å legge til noen forbedringer i grensesnittet.



3. Fullfør handlingslinjen

Trinn 1

La oss fullføre denne opplæringen ved å legge til en hjelpeknapp i handlingslinjen. Jeg vil ikke gå inn i for mye detalj, men gjerne eksperimentere med dette i dine egne applikasjoner. Avhengig av API-nivåene du målretter, er støtte for navigering ved hjelp av handlingslinjen forsynt med liten eller ingen koding. For å sikre at handlingslinjen lar navigere tilbake til hovedaktiviteten, legg til følgende inne i onCreate metode i spillets aktivitet.

getActionBar () setDisplayHomeAsUpEnabled (sann).;

I manifestet husk at vi angav hovedaktiviteten som forelder for spillets aktivitet. Dette forteller operativsystemet som navigerer tilbake / opp fra spillets aktivitet, bør bringe brukeren tilbake til hovedaktiviteten. Ditt prosjekt bør ha en hovedmeny ressurs. Åpne den og ta en titt på innholdet. Som standard vil det ha en innstillingshandling, som vi ikke trenger for spillet vårt. Sett inn følgende kodebit, for å legge til en hjelpeknapp.

Husk at vi oppførte hjelpikonet i den første opplæringen i denne serien. Du kan legge til flere knapper til handlingslinjen din senere hvis du vil. Hvis du gjør det, må du utvide aktiviteten koden vi dekker nedenfor.

Vi trenger ikke handlingslinjene i hovedaktiviteten, så hvis Eclipse legger til onCreateOptionsMenu metode til hovedaktivitetsklassen din, vær så snill å fjerne den.

Steg 2

Tilbake i spillets aktivitet, sett inn skjermen for å bruke hovedmenyen ved å legge til følgende metode.

@Override public boolean onCreateOptionsMenu (Menymeny) getMenuInflater (). Oppblås (R.meny, meny); returnere sant; 

Legg til en annen metode for å angi hva som skal skje når brukeren prøver å navigere tilbake / opp eller trykke på hjelpeknappen i handlingslinjen.

@Override public boolean onOptionsItemSelected (MenuItem item) switch (item.getItemId ()) tilfelle android.R.id.home: NavUtils.navigateUpFromSameTask (dette); returnere sant; sak R.id.action_help: showHelp (); returnere sant;  returnere super.onOptionsItemSelected (item); 

Navigering opp tar brukeren tilbake til hovedaktiviteten. De android.R.id.home Handlingen svarer til anropet til setDisplayHomeAsUpEnabled vi la til onCreate.

Trinn 3

Legg til en annen instansvariabel øverst i klassen for hjelpinformasjonen.

privat AlertDialog helpAlert;

Vi bruker en annen hjelpemetode for å vise hjelpinformasjonen.

offentlig ugyldig showHelp () AlertDialog.Builder helpBuild = ny AlertDialog.Builder (dette); helpBuild.setTitle ( "Hjelp"); helpBuild.setMessage ("Gjett ordet ved å velge bokstavene. \ n \ n" + "Du har bare 6 feilvalg, så er spillet over!"); helpBuild.setPositiveButton ("OK", ny DialogInterface.OnClickListener () public void onClick (DialogInterface dialog, int id) helpAlert.dismiss ();); helpAlert = helpBuild.create (); helpBuild.show (); 

Handlingslinjestøtten som vi har inkludert, fungerer bare for API-nivåer på 11 og opp, og navigasjonsstøtten fungerer bare for API-nivåer på 16 og oppover. For å støtte eldre versjoner må du bruke støttebiblioteker for handlingslinjen og navigasjonen.

Konklusjon

Vårt Hangman-spill bør nå være komplett. Kjør det og gi det et snurr. Søknaden i sin nåværende form vil bare fungere på nyere versjoner av Android, og brukergrensesnittet er bare egnet for et begrenset utvalg av enheter. Som du ser, er det rom for forbedring. I tillegg til å støtte en bredere ranger av enheter, kan du forbedre spillet ved å legge til vanskelighetsnivåer eller ordkategorier. Du kan til og med lage et leaderboard for å holde oversikt over scoreene.

Hvis du har fullført denne serien, bør du ha lært om flere aspekter av Android-plattformen, inkludert brukerinteraksjon, adaptere, XML-ressurser og bruk av handlingslinjen.