Share
In deze serie laat ik je zien hoe je een eenvoudig galgje voor Android kunt maken. In elke tutorial leer je een aantal basisvaardigheden voor het maken van Android-apps. De applicatie bestaat uit twee schermen, omvat gebruikersinteractie met adapters, bevat dialoogvensters en een actiebalk en maakt gebruik van XML voor gegevensopslag. Laten we beginnen.
Als u een beginnende Android-ontwikkelaar bent met een of twee basistoepassingen onder uw riem, dan zou u deze tutorials zonder al te veel moeite moeten kunnen voltooien.
De game heeft een eenvoudige basisstructuur, zodat je je eigen uitbreidingen kunt toevoegen wanneer je de tutorials hebt voltooid. In deze reeks zal ik u wijzen op optionele stappen die u kunt toevoegen om extra functionaliteit toe te voegen en de ondersteuning voor een groter aantal Android-apparaten te verbeteren. De gebruikersinterface, bijvoorbeeld, zal eenvoudig zijn, maar ik moedig je aan om het meer liefde te geven om het spel aantrekkelijker te maken. De volgende screenshot zou u een idee moeten geven van hoe het eindresultaat eruit zal zien.
Deze tutorial is opgesplitst in drie verschillende delen.
Ons spel zal een traditioneel Galgje-spel zijn. Het zal een willekeurig woord kiezen, waarin plaatshouders voor elke letter worden gepresenteerd, zodat de gebruiker de lengte weet. Het spel zal natuurlijk een galg gebied en knoppen voor elke letter van het alfabet. Telkens wanneer de gebruiker op een letter tikt, controleert de toepassing of het woord de letter bevat. Als dat zo is, wordt de letter onthuld in het woord. Als het woord de geselecteerde letter niet bevat, wordt één deel van het lichaam weergegeven in het galggebied, te beginnen met het hoofd. De gebruiker kan maximaal zes verkeerde gissingen maken en toch het spel winnen. Als ze echter een zevende fout maken, is het spel voorbij. Als de speler minder dan zeven gissingen nodig heeft, wint ze de game. Ben je nog steeds bij me?
Maak een nieuw Android-project in uw IDE (Integrated Development Environment) naar keuze. In deze tutorial gebruik ik Eclipse. Selecteer in Eclipse Nieuw> Project van de het dossier menu. In de Android sectie, selecteer Android-applicatieproject en klik volgende.
Voer een applicatie-, project- en pakketnaam in. Om de dingen eenvoudig te houden, richt de applicatie zich op API 16, maar misschien wilt u oudere versies ondersteunen. Als u besluit dit te doen, moet u enige aanvullende verwerking uitvoeren. Klik volgende doorgaan.
In de Configureer Project venster, is het aan u om te kiezen of u een aangepast pictogram wilt maken. Controleer echter de Maak activiteit en de Maak een project in de werkruimte selectievakjes. Klik volgende.
Stel een opstartpictogram in en klik op volgende. In de Activiteit maken scherm, selecteer Lege activiteit en klik volgende.
U kunt de activiteitsklassen en lay-outnamen desgewenst wijzigen, maar de standaardnamen werken ook prima. Klik Af hebben om je nieuwe project te maken.
Dit is een goed moment om de thema's en stijlen van uw toepassing te configureren. Om de demotoepassing aan te passen, stelt u de AppTheme in uw res / waarden / XML-bestand stijlen naar android: Theme.Holo. De standaardinstellingen werken goed, maar de gebruikersinterface van uw toepassing verschilt van de schermafbeeldingen in deze zelfstudie.
Onze applicatie presenteert een introductiescherm met een afspeelknop voor de gebruiker en een apart scherm voor het spel zelf. Zoals je kunt zien in de vorige screenshot, bevat het scherm voor de game een aantal afbeeldingen voor de galg en lichaamsdelen. Onder de galg bevindt zich het gebied voor het woord dat de gebruiker moet raden en een raster met de letters van het alfabet. We zullen ook een actiebalk gebruiken om door het spel te navigeren en het zal ook een helpknop bevatten.
We hebben behoorlijk wat afbeeldingen nodig voor de galg, de lichaamsdelen (hoofd, lichaam, armen en benen), de hulpknop en een achtergrondafbeelding voor het introscherm. U kunt deze afbeeldingen vinden in de bronbestanden van deze zelfstudie, die u aan de bovenkant van deze zelfstudie kunt vinden. Houd er rekening mee dat u extra afbeeldingen moet maken als u een bredere reeks apparaten met verschillende schermformaten wilt targeten.
Download de afbeeldingen en voeg ze toe aan de beschrijfbare mappen in uw projectdirectory. Zorg ervoor dat u afbeeldingen gebruikt die geschikt zijn voor de verschillende schermdichtheden op Android.
De applicatie gaat ook een aantal bruikbare bronnen gebruiken die we kunnen definiëren als vormen in XML. Deze omvatten de achtergrond voor de letters in het woord dat de gebruiker moet raden en de achtergrond voor de letters van de knoppen (normale en gemarkeerde staat). Deze moeten ook worden aangepast aan de verschillende schermdichtheden die u met uw toepassing wilt ondersteunen. De voorbeeldcode van deze zelfstudie biedt u een goed startpunt.
Laten we beginnen met de achtergrond van de letters. Maak een nieuw bestand in de tekentafel van uw project en noem het letter_bg.xml.
Voer de vorm in die wordt weergegeven in het onderstaande codefragment.
Als u niet bekend bent met het maken van vormen in XML, lijkt dit misschien een beetje verwarrend. Het resultaat is een onderstreping, die wordt weergegeven als de achtergrond van elke letter in het woord dat de gebruiker moet raden.
Als u de afmetingen van een vorm wilt wijzigen om verschillende schermdichtheden te targeten, overweeg dan om dimensiemiddelen te gebruiken. Hiermee kunt u dezelfde vormbare XML-code gebruiken voor alle schermdichtheden, maar met elke verwijzing naar dimensiewaarden die zijn afgestemd op het gebruikte scherm.Maak vervolgens een nieuw bestand in de tekentafel van uw project voor de letterknoppen in hun oorspronkelijke staat en noem deze letter_up.xml. Voeg het volgende fragment toe aan het bestand dat u zojuist hebt gemaakt.
U kunt de bovenstaande fragmenten aanpassen om de elementen van de gebruikersinterface naar wens in te delen. Het is belangrijk om de bronnen van deze tutorial als richtlijn te zien. Maak nog een drawable en geef hem een naam letter_down.xml. We zullen dit tekenbaar gebruiken voor de lettertoetsen in hun gemarkeerde staat, dat wil zeggen wanneer de speler op de knop tikt.
De gebruiker kan slechts één letter kiezen in elke ronde van het spel. Dit betekent dat elke letter of knop is uitgeschakeld vanaf het moment dat de gebruiker de letter heeft gekozen. Dit wordt weerspiegeld door de achtergrond van de knop bij te werken.
We veranderen de achtergrond van elke knop met behulp van Java, afhankelijk van de status van de knop, ingeschakeld of uitgeschakeld. Kijk voor meer geavanceerde knopopties met de knoptoestanden.Laten we het hoofdlay-outbestand voor het introscherm maken. Open het hoofdlay-outbestand van het project en werk de inhoud bij om het onderstaande fragment weer te geven.
Zoals u kunt zien, verwijst de code naar een drawable resource om op de achtergrond weer te geven. U kunt het Figuurweergave element als je wilt. Als u de afbeelding opneemt, zorg er dan voor dat de bestandsnaam overeenkomt met deze code. De lay-out bevat een enkele knop om het spel te spelen, maar u kunt later andere knoppen toevoegen als u dat wilt. U zou bijvoorbeeld niveaus of categorieën aan de toepassing kunnen toevoegen in plaats van simpelweg een willekeurig woord uit een lijst te kiezen, zoals we in deze zelfstudie zullen doen..
Laten we nog een paar bestanden maken die we in de volgende tutorials zullen gebruiken. Voeg eerst een tweede activiteitsklasse aan het project toe voor het spel zelf. Selecteer het pakket in uw project src map en kies Nieuw> Klasse van de het dossier menu. Geef de klas een naam GameActivity En instellen android.app.Activity als zijn superklasse.
We zullen het voltooien GameActivity klas later in deze serie. Laten we nu een lay-outbestand voor de klas maken. Voeg een nieuw bestand toe aan de projecten lay-out map en noem deze activity_game.xml. Vervang de inhoud door het onderstaande fragment hieronder.
We zullen de volgende keer items toevoegen aan de lay-out. Voeg de toe activiteit naar uw project manifest bestand, na het element voor de main activiteit, binnen in de toepassing element:
We hebben de oriëntatie van het scherm ingesteld op portret. Als u besluit om ook een liggende oriëntatie in uw spel te ondersteunen, moet u het oriëntatie-kenmerk verwijderen. We specificeren ook de hoofdactiviteit als ouder, wat betekent dat de actiebalk kan worden gebruikt om door het spel te navigeren. We zullen hier later meer over praten in deze tutorial.
Laten we deze tutorial beëindigen door de gameplay-activiteit te starten wanneer de gebruiker op de afspeelknop tikt. Open het bestand van de Hoofdactiviteit klasse en begin met het toevoegen van de volgende importstatements.
importeer android.content.Intent; import android.view.View; import android.view.View.OnClickListener; importeer android.widget.Button;
Eclipse had het bestand vooraf moeten invullen Hoofdactiviteit les met een Activiteit klassenoverzicht, inclusief een onCreate methode waarin de inhoudsweergave is ingesteld. Na de setContentView regel, haal een verwijzing op naar de afspeelknop die u aan de hoofdlay-out hebt toegevoegd en stel de klas in om naar klikken te luisteren.
Button playBtn = (Button) findViewById (R.id.playBtn); playBtn.setOnClickListener (deze);
We kunnen de knop vinden door de identifier te gebruiken die we in de layout-XML hebben ingesteld. Verleng de openingszin van de klassenverklaring om de klik luisterinterface als volgt te implementeren.
public class MainActivity breidt Activiteit uit OnClickListener
Voeg de toe bij klikken methode na de onCreate methode zoals hieronder getoond.
@Override public void onClick (View view) // handle clicks
Binnen deze methode controleren we of op de afspeelknop is geklikt en als dit het geval was, start dan de gameplay-activiteit.
if (view.getId () == R.id.playBtn) Intent playIntent = new Intent (this, GameActivity.class); this.startActivity (playIntent);
Dit zal op dit moment niet veel effect hebben, aangezien we de gameplay-activiteit nog niet hebben geïmplementeerd. Dat is iets wat we in de volgende tutorial zullen doen.
In deze zelfstudie hebben we de basis voor de Hangman-app gemaakt. In de volgende tutorial zullen we de interface-elementen van de game bouwen en in het laatste deel zullen we ons concentreren op de interactieve aspecten van de applicatie. Onderweg zullen we verkennen adapters en de actie bar. We slaan ook het woord antwoorden op in XML, halen ze op wanneer de app wordt gestart en kiezen er een willekeurig wanneer de gebruiker een game speelt.
Accentsconagua