Naar content
Trending apps
  • Inbox by Gmail

  • Maps: Navigatie en OV

  • WhatsApp Messenger

  • Messenger

  • Facebook

Trending games
  • Minecraft Earth

  • Dr. Mario World

  • Harry Potter: Wizards Unite

  • Breaking Bad: Criminal Elements

  • The Elder Scrolls: Blades

Trending smartphones
  • Moto G8 Plus

  • Microsoft Surface Duo

  • OnePlus 7T Pro

  • Nokia 7.2

  • Xiaomi Mi 9T Pro

Nieuwste tablets
  • Samsung Galaxy Tab S6

  • Samsung Galaxy Tab A 10.5

  • Samsung Galaxy Tab S4

  • Samsung Galaxy Tab S3 9.7

  • Asus Zenpad 3S 10

DevTutorial 6 - Je eigen class maken en deze vullen met JSON-gegevens

· 05 oktober 2011

Deze zesde DevTutorial bouwt voort op DevTutorial vijf en gaat over het verwerken van de ruwe gegevens die je gedownload hebt van Twitter.com. Deze DevTutorial is net zoals de vorige vijf een uitgebreide programmeerhandleiding waar er de tijd wordt genomen om gerelateerde concepten uit te leggen.

Hierdoor heb je na deze zesde DevTutorial een aardige basis wat Androidkennis betreft. Concepten die je daarna gaat leren kan je nu makkelijker begrijpen. Dit doordat je ze kan verbinden met de andere concepten die je daarvoor geleerd hebt. Om deze reden zijn DevTutorials nummer zeven tot en met tien kleinere DevTutorials.

Wat gaan we doen

In de vorige tutorial hebben we de gebruikersgegevens van een Twitter-gebruiker weergegeven in een TextView. Het probleem was echter dat er allemaal coderingstekens doorheen stonden en waarden die je eigenlijk helemaal niet wil laten zien aan de gebruiker. In deze DevTutorial gaan we de ruwe JSON-gegevens inlezen zodat ze gescheiden getoond kunnen worden in je app: . Ook wordt de gedownloade gebruikersnaam gebruikt om een tweede Activity te starten die we gaan gebruiken in de volgende DevTutorial: . Terwijl je deze dingen maakt ga je de volgende onderwerpen bij langs:

  • De layout uit de vorige DevTutorial uitbreiden.
  • Een eigen class maken met de naam TwitterUser, deze kan de gedownloade gegevens opslaan.
  • Methods in deze class maken zodat je er gegevens in kan opslaan en erop kan uitlezen.
  • JSON-gegevens laden in het JSONObject en deze vervolgens per element uitlezen.
  • Views verbergen en zichtbaar maken.
  • Een tweede Activity class (TweetsActivity) maken en deze opnemen in je app via AndroidManifest.xml.
  • De tweede Activity starten.
  • Bij het opstarten van de tweede Activity extra gegevens meesturen en deze gebruiken in de class van je tweede Activity.

Het downloaden en het tonen van de tweets van de Twitter-gebruiker doen we in DevTutorial zeven. De hoofdgedachte van deze DevTutorial is dat je een nieuwe class maakt voor het opslaan van gegevens die je downloadt vanaf een specifieke internetpagina. Als je ergens niet uitkomt kan je hier op het forum een vraag stellen. Veel succes ermee!

De app verder ontwerpen

De layout uit de vorige DevTutorial heeft een TextView, waar alle JSON-sourcecode in gegooid werd. Straks hebben we een app waarin we apart de gebruikersnaam en de website van de Twitter-gebruiker kunnen opvragen, dus het is netter om twee aparte TextViews hiervoor aan te maken. Ook gaan we twee extra TextViews aanmaken, die als titeltekst dienen voor de gebruikersnaam en de website (bijvoorbeeld 'Username:' en 'Website:'). Voor het aanpassen van de layout wordt uitgegaan van de layout uit het bestand nicelayout.xml, die je als extra oefening in de vorige DevTutorial hebt gemaakt. Hiervoor moeten de volgende bestanden in jouw Androidproject gelijk zijn aan de mijne:

Wil je toch de de layout uit het bestand main.xml gebruiken, dan kan dat ook, alleen moet je dan de Style properties van de TextViews leeg laten (in plaats van daar @style/text_pin te vullen). Verwijder de volgende views:

  • scrollView1
  • txtvUserInfo
  • (en als je nog een LinearLayout met de naam linearLayout1 in scrollView1 had zitten, moet je die ook verwijderen)

Sleep de volgende views via het Outline Window in relativeLayout1

  • TextView, en zet de Id property op @+id/txtvUserNameTitle
  • TextView, en zet de Id property op @+id/txtvUserName
  • TextView, en zet de Id property op @+id/txtvUrlTitle
  • TextView, en zet de Id property op @+id/txtvUrl
  • Button, en zet de Id property op @+id/btnTweets

Je layout ziet er nu als volgt uit (inclusief de ids die je in het Outline Window kan zien): .

  • Pas van de Views die je in de layout hebt gesleept de volgende properties aan:
ElementPropertyWaarde
txtvUserNameTitleLayout below@+id/btnDownload
txtvUserNameTitleLayout margin top10dip
txtvUserNameTitleTextUsername
txtvUserNameTitleStyle@style/text_p
txtvUserNameLayout align baseline@+id/txtvUserNameTitle
txtvUserNameLayout align parent righttrue
txtvUserNameStyle@style/text_p
txtvUrlTitleLayout below@+id/txtvUserNameTitle
txtvUrlTitleLayout margin top10dip
txtvUrlTitleTextWebsite
txtvUrlTitleStyle@style/text_p
txtvUrlLayout align baseline@+id/txtvUrlTitle
txtvUrlLayout align parent righttrue
txtvUrlStyle@style/text_p
btnTweetsLayout below@+id/txtvUrlTitle
btnTweetsLayout align left@+id/btnDownload
btnTweetsLayout align right@+id/btnDownload
btnTweetsLayout margin top10dip
btnTweetsClickabletrue
btnTweetsOn clickshowTweets

Je layout moet er nu als volgt uitzien: . Nu moet je class MainActivity aangepast worden:

  • Verwijder de drie regels die verwijzen naar mTxtvUserInfo (de variabele zelf, bij het gebruik van de method findViewById en in de method onPostExecute de regel met setText)
  • Definiëer in het block van je class de volgende variabelen: mTxtvUserNameTitle, mtxtUserName, mTxtvUrlTitle, mTxtvUrl en mBtnTweets.
  • Zorg ervoor dat in de method onCreate de layout nicelayout wordt geladen, in plaats van de layout main.
  • Koppel in de method onCreate de variabelen aan de views in je layout door gebruik te maken van de method findViewById.
  • In het block van je class voeg je een method toe met de naam showTweets, die als parameter (= een extra bericht tussen de haakjes van de method) een View heeft met de naam view. Doe in je method ook een if else block die controleert of de ingedrukte view wel de juiste is. Voor inspiratie kan je kijken naar de al bestaande method downloadUserInfo.
  • In de method onPostExecute van je inner class DownloadUserInfoTask, haal je de regel weg die de gedownloade tekst laadt in de TextView mTxtvUserInfo (we gaan hier straks iets anders voor in de plaats zetten).

Je class moet er nu als volgt uitzien:

De app verder programmeren

Het doel van deze DevTutorial is om in plaats van de gedownloade rommelige tekst, alleen de gebruikersnaam en de url van de Twitter-gebruiker te laten zien op een nette manier. Om dat te kunnen doen heb je net al vier TextViews toegevoegd, waarvan er nu twee gevuld moeten worden met de juiste gegevens. Om dit op een nette manier te vullen, heb je twee methods nodig die je de gebruikersnaam en de website van de gedownloade Twitter-gebruiker geven. Zoals je weet, bestaan deze methods niet standaard in Android en zul je deze zelf moeten maken. Het netste is om hiervoor een nieuwe class aan te maken, met bijvoorbeeld de naam TwitterUser. Nadat je deze class hebt gemaakt, moet je ervoor zorgen dat je hem kan vullen met  de gedownloade gegevens én dat je de gegevens via methods gescheiden kan uitlezen. Het maken van een nieuwe class gaan we doen door een nieuw .java-bestand te maken, waar we een class block inzetten met de naam TwitterUser. In deze class moeten sowieso twee methods komen die de gebruikersnaam en de website van de gedownloade Twitter-gebruiker kunnen teruggeven. Deze twee gegevens kunnen alleen maar worden teruggeven als ze kunnen worden onthouden door de TwitterUser class: er worden eerst de methods getUserName en getWebsite gemaakt en de Strings mUserName en mWebsite worden aangemaakt in het class block. Daarna maken we in deze class een constructor method, die je gaat gebruiken als je een nieuw Object van dit type (TwitterUser) aanmaakt in je code. Vervolgens zorgen we ervoor dat deze constructor method een extra bericht accepteert, namelijk de gedownloade gegevens van de Twitter-gebruiker. In deze constructor method wordt vervolgens dit extra bericht uitgelezen en gebruikt om de de gebruikersnaam en de website op te slaan. Wanneer je class TwitterUser af is, gaan we hem gebruiken in je class MainActivity.

Eigen class maken: TwitterUser

Wanneer je een nieuwe class wilt maken, moet je hiervoor een nieuw java-bestand maken dat eindigt op .java. In dat bestand beschrijf je eerst in welke package de class zit en daarna typ je het block van de class. Dit kan je laten genereren door met je rechtermuisknop in de linkerbalk van Eclipse op de package me.moop.mytwitter te klikken en dan op New --> Class te klikken: . Dan krijg je dit scherm, waar je bij Name TwitterUser in moet vullen en vervolgens op Finish moet klikken om de class aan te maken: . Als resultaat krijg je het bestand TwitterUser.java, met daarin een lege class TwitterUser:

Methods en return types: getUserName en getWebsite

De class willen we uiteindelijk gaan gebruiken om de gebruikersnaam en de website van de gebruiker op te vragen. Voor het uitwisselen van gegevens tussen Objecten (in dit geval tussen een Object van het type MainActivity en een Object van het type TwitterUser), moet je methods maken en ze een naam geven. Daarna kunnen deze methods van de Objects worden aangesproken door andere Objects. Als je zelf methodnamen moet bedenken die te maken hebben met opvragen van gegevens, is er de ongeschreven regel dat je de naam van de method laat beginnen met het woordje get. Na het woordje get moet je een (erg) korte beschrijving geven van wat je wilt opvragen (met de eerste letter van het woord steeds met een hoofdletter) . Omdat wij de gebruikersnaam en de website van de gebruiker willen opvragen krijg je de methods getUserName en getWebsite. In de beschrijving van het method block (dat is dus de regel die je schrijft voordat je je block daadwerkelijk begint met een '{' ), moet je nog aangeven dat de method als antwoord een String teruggeeft. In het geval van getUserName bevat die String de Twitter-gebruikersnaam en in het geval van getWebsite bevat die String de inhoud van de url van de website van de gebruiker. Dit geef je aan door het type van het object vóór de naam van de method te zetten. Zoals je weet, is een String eigenlijk een object van het type String: dus je schrijft dan String getUserName en String getWebsite. Dáárvoor moet je nog het woordje public zetten: hierdoor zet je deze method 'open', zodat hij gebruikt kan worden door andere objecten (in plaats van dat deze method alleen door zijn eigen class gebruikt mag worden). Wanneer je weet wat voor type object een method teruggeeft (bijvoorbeeld een String) kan je ook zeggen: het return typevan de method is een String.

  • Voeg dus deze twee methods toe aan je class TwitterUser:

Als het 'goed' is zie je bij elke method een fout staan: 'This method must return a result of type String'. Dit betekent dat je in de methods nog opdracht moet geven om een antwoord te geven. Die antwoorden moet je ergens vandaan halen. Je kan het beste in het block van je class twee Strings definiëren met de naam mUserName en mLastTweet. Dat is dus een niveau hoger dan de Strings definiëren in de code van je methods: dit heeft te maken met de scope van de variables, zoals je in DevTutorial 4 kon lezen. De Strings gebruik je vervolgens in de methods, om door middel van het woordje returnze als antwoord terug te geven aan het stukje code dat de methods aanroept.

  • Definiëer twee Strings in het begin van het block van je class, genaamd mUserName en mWebsite .
  • Gebruik in beide methods het woordje return, gevolgd door de naam van de String om de juiste String als antwoord terug te geven.

Je class moet er nu als volgt uit zien:

Constructor: een speciale method om je class aan te maken en als resultaat een object ervan terug te krijgen

Je hebt nu een class TwitterUser die je zou kunnen gebruiken in je code. Er is nog een klein probleempje:  hoe krijg je überhaupt het object (van het type TwitterUser) in je code zodat je ermee kan werken? Tot nu toe is het namelijk alleen nog maar een apart bestandje in je Androidapp-project in Eclipse. Dit kun je doen door een constructor te gebruiken: dat is een speciale method zonder naam. Wanneer je een method maakt met de volgende eigenschappen dan herkent Android die method automatisch als een constructor method:

  • Geen naam opgegeven voor de method.
  • Als return type het type van je class gebruikt.

Die constructor kun je dan aanroepen en dan zorgt Android ervoor dat je als resultaat van die method een nieuw object krijgt van dat type. De constructor kun je aanroepen door het woordje new te gebruiken gevolgd door de naam van de class. Stel wanneer je deze constructor zou maken in je class:en vervolgens gebruik je deze code in je MainActivity class tijdens je app:Dan heb je een object TwitterUser met de naam myTwitterUser in je class waar je dan vervolgens de methods getUserName en getLastTweet op kan gebruiken (net zoals bijvoorbeeld de DefaultHttpClient in de vorige tutorial).

  • Voeg de constructor toe je in class

JSON: een syntax om gegevens compact op te slaan

Als je de gegevens van een Twitter-gebruiker via twitter.com opvraagt krijg je een lap tekst terug waar de gegevens in verwerkt zijn. Deze manier van verwerken van de gegevens in een lap tekst kan op verschillende manieren, en Twitter doet dit via de JSON-notatie (een vrij populaire notatie). Hieronder zie je een voorbeeld van de JSON die je terug kunt krijgen van twitter:Deze gegevens beginnen met een '{' en eindigen met een '}' (scroll anders even helemaal naar rechts). Daar tussenin staan allemaal aparte gegeven en ze zijn van elkaar gescheiden door een komma (deze aparte stukjes noem je de elementen van de JSON). In zo'n element zie je steeds een woord (of meerdere woorden met een _ daartussen) tussen haakjes staan. Dat is de naam van het element van de JSON. Daarachter staat een dubbele punt en dáár weer achter staat de waarde van het element. In bovenstaande voorbeeld heb je dan het element is_translator met de waarde false en iets verderop heb je ook het element name met de waarde woutervegter(zoek het element name even op, dan raak je wat bekender met JSON - en dan onthoud je mijn naam ook beter :). Een JSON is dus een verzameling elementen waarbij elk element een naam heeft en een waarde die je uit kan lezen. Deze kennis gaan we gebruiken in de volgende paragraaf.

JSON: met JSONObject gegevens uitlezen

Het laatste probleem met je TwitterUser object, is dat hij nog niet gevuld kan worden met de juiste gegevens. Als je nu de methods getUsername of getWebsite zou aanroepen krijg je null als resultaat terug. Het vullen ervan kun je het beste doen in de constructor method: je weet namelijk al bij het aanmaken van het object welke gegevens er zijn waarmee het object gevuld moet worden. Die gegevens zitten in de elementen van de JSON. Wat je dan in de constructor moet doen is ervoor zorgen dat hij een String kan ontvangen waarin de JSON data zit.

  • Voeg daarom de parameter String jsonString toe aan je constructor:

Om gegevens uit JSON uit te lezen kan je het beste de JSONObject class gebruiken. Deze class heeft onder andere de method optString waarbij je de stringwaarde van een element uit kan lezen. Nu moet het JSONObject aangemaakt worden. Kijk even naar deze pagina, kijk bij het kopje Public Constructors. Daar zie je alle constructors staan die bij deze class horen. Je ziet onder andere deze constructor staan: JSONObject(String json). Dat betekent dat er een constructor is die als parameter een String accepteert en op basis daarvan dus een JSONObject maakt. Zoals eerder uitgelegd kan je een constructor aanroepen met woordje newgevolgd door de class naam. Als parameter moet je dan de String meegeven die je wilt gebruiken voor het nieuwe JSONObject. Het aanmaken van een JSONObject kan exceptions veroorzaken als de JSON string die je gebruikt niet klopt. Daarom moet je het aanmaken en het gebruik van het JSONObject in een try catch block doen, waar je vervolgens een JSONException opvangt.

  • Maak een JSONObject aan met de String jSONString en geef het JSONObject de naam jSONObject.
  • Plaats het aanmaken in een try catch block waarin je de fout JSONException afvangt.

Nu heb je de volgende code:Het JSONObject dat je jSONObject hebt genoemd kan je nu uitlezen en de waarden van de elementen wegschrijven naar mUserName en mWebsite. Daarvoor moet je de method optString(String name)gebruiken waarbij je als parameter de naam van het element mee geeft waarvan je de waarde wilt hebben.

  • Lees met de method optString de waarde van het element screen_name uit en stop die in de String mUserName
  • Lees met de method optString de waarde van het element url uit en stop die in de String mWebsite

Je class moet er nu als volgt uit zien:Je eigen eerste class TwitterUser is nu klaar voor gebruik om er object van te maken van het type TwitterUser.

Variabele namen en class namen

Toen je de constructor method maakte en de method variabele intypte (JSONObject jSONObject) leek het misschien raar dat je twee keer bijna exact hetzelfde woord in moest typen. De reden om het zo te doen is dat class namen altijd beginnen met een hoofdletter waarbij elk woord in de naam van de class ook een hoofdetter krijgt (zo heb je dus ook TextView, EditText, LinearLayout enzovoorts). Variabele namen (in o.a. je class block, je method block of als method parameter) beginnen altijd met een kleine letter. Als je dan een variabele maakt van een class en het is de enige variabele, dan is het handig om de class naam te gebruiken als variabele naam, waarbij je de eerste letter als kleine letter schrijft. Omdat de naam van de variabele heel erg lijkt op de naam van de class dan weet je van wat voor type de variabele het is. En omdat de naam van de variabele met een kleine letter begint weet je altijd dat het om een variabele gaat. Er is nog een kleine uitbreiding op deze regel: als je een variabele aanmaakt in je class block dan laat je de naam altijd beginnen met de letter m (van het woord module). Hierdoor kan je altijd zien of je te maken hebt met een class variabele of met een lokale variabele (een lokale variabele is een variabele die in een method block of lager is gedefinieerd)

Views verbergen en tonen

Je wil het object van het type TwitterUser straks op meerdere plaatsen kunnen gebruiken:

  • Voor het vullen ervan met de gegevens.
  • Het tonen van de gebruikersnaam en de website.
  • Het opstarten van de tweede Activity die de tweets toont van deze Twitter-gebruiker.

Omdat dit in verschillende methods gaat plaatsvinden, kun je het beste een variabele van het type TwitterUser aanmaken in de scope van je class, dus in je class block.

  • Voeg op de plek waar je de andere Views definieert, ook een TwitterUser toe:

Van de views die we net hebben toegevoegd (vier TextViews en één Button), willen we ze kunnen tonen of verbergen afhankelijk van of er een twitter gebruiker is gedownload (dus of er wel of niet een TwitterUser object aanwezig is). Omdat de views afhankelijk zijn van één variabele (mTwitterUser), kun je het beste een nieuwe method om die variabele heen bouwen en die je scherm laten aanpassen.

  • Voeg een method updateView toe aan je class.

Afhankelijk van de variabele mTwitterUser moeten de Views wel of niet getoond worden. Als mTwitterUser leeg is (dat betekent dat er geen gebruiker is) dan moeten alle Views verborgen worden, en als de parameter gevuld is moeten alle views getoond worden. Wanneer een object leeg is, dan heeft dat in Android een speciale naam: null. In programmeertaal moet je dan de vraag stellen: is de waarde van het object gelijk aan null? Dat kan je doen met een if block.

  • Voeg dit if else block toe aan je code, inclusief het else block:

Nu wordt het if block uitgevoerd als er geen Twitter-gebruiker bekend is, en het else block wordt uitgevoerd als er wel een Twitter-gebruiker bekend is. In het if block en het else block moet je alle views verbergen of juist tonen, dit kun je doen met de method setVisibility van elk View object. Als parameter moet je bij de method setVisibility een getal meegeven. Dit getal hoef je niet zelf te bedenken, maar het is in dit geval geprogrammeerd in de View class. De getallen zijn zo geprogrammeerd dat je niet een object van de class nodig hebt om het getal op te vragen, dit heten statische variabelen. In dit geval betekent het woord static (Engels voor statisch) dat de variable altijd hetzelfde blijft. Net zoals bij R.java kan je het getal opvragen door de naam van de class te gebruiken en daarachter de naam van de statische variabele te typen, gescheiden door een punt. Statische variabelen worden altijd geschreven in hoofdletters (met uitzondering van de namen in R.java), je hebt dit ook al gebruikt in DevTutorial 3 toen je een afspraak planner ging maken en van de Calendar class de statische variabele DAY_OF_MONTH gebruikte. De naam die hoort bij de statische variabele voor het tonen een View heeft de naam VISIBLE. De naam voor het verbergen van een view heet INVISIBLE. Als je dus een view wilt verbergen of juist tonen moet je de method setVisible aanroepen met respectievelijk de parameter View.VISIBLE of View.INVISIBLE .

  • Schrijf in het if block 5 opdrachten die de views op onzichtbaar (INVISIBLE) zetten:

  • Doe hetzelfde in het else block, maar zorg ervoor dat dan de views zichtbaar zijn (VISIBLE):

  • Verder moet je wanneer het mTwitterUser object niet leeg is (dus in het else block) de gebruikersnaam en de website opvragen van het mTwitterUser object en deze gebruiken om de mTxtUserName en mTxtvUrl te vullen. Voeg dit toe in het else block, onder de regels die je net geschreven hebt:

Het resultaat: de methods met elkaar combineren

Nu is de method updateView klaar om gebruikt te worden: hij controleert of mTwitterUser leeg is of niet en afhankelijk daarvan worden de Views verborgen of juist getoond. Als mTwitterUser een gevuld object is, dan worden ook de TextViews gevuld met de gebruikersnaam en de website van de Twitter-gebruiker. Het enige wat nu nog moet gebeuren, is de variabele mTwitterUser aanpassen en de method updateView aanroepen. Dit moet je doen nadat je succesvol een Twitter-gebruiker hebt gedownload, dus in de method onPostExecute van je private class DownloadUserInfoTask. Zoals je misschien nog weet van de vorige DevTutoria, bestaat in de class DownloadUserInfoTask de String mResultString. Hierin zitten de gegevens van de Twitter-gebruiker in JSON formaat, als deze goed gedownload zijn. Deze String kan je gebruiken om de constructor van je TwitterUser object aan te roepen die je net gemaakt hebt. Vervolgens moet je die TwitterUser in je variabele mTwitterUser stoppen en daarna de method updateView aanroepen.

  • Voeg onderstaande twee regels toe in de method onPostExecute, in het if block dat wordt uitgevoerd als mResultCode gelijk is aan 200:

Bij een succesvolle download worden nu de TextViews getoond met daarin de naam en de website van de Twitter-gebruiker. Het laatste probleem is nu nog, dat de Views niet meer worden verborgen als er geen Twitter-gebruiker is gevonden. Dit kan je doen door mTwitterUser op null te zetten en daarna de method updateView aan te roepen:

  • Voeg dit toe aan alle else  en else if blocks van de method onPostExecute.
  • Voeg dit ook toe aan het einde van je method onCreate, dan worden alle Views automatisch verborgen bij het opstarten van de app.

Wanneer je updateView aanroept nadat je mTwitterUser op null hebt gezet, worden alle Views verborgen. Je app is bijna af, voor wat deze tutorial betreft. Start je app en probeer te kijken of hij werkt. Als je een bestaande gebruikersnaam invult, worden de TextViews en de Button getoond: . Wanneer je een ongeldige gebruikersnaam invult, worden de Views verborgen: .

Intents en de method startActivity

De Button met de naam mButtonTweets gaan we gebruiken om een tweede Activity op te starten als je gegevens van een Twitter-gebruiker hebt gedownload. Deze tweede Activity gaan we in de volgende DevTutorial gebruiken om tweets te downloaden van de Twitter-gebruiker. Voor nu gaan we deze Activity alleen maar gebruiken door hem op te starten, zodat we er een gebruikersnaam aan door kunnen geven vanuit onze MainActivity class. Voor het opstarten van een andere Activity, moet je de method startActivity gebruiken: die kan je hier vinden. Wanneer je deze method gebruikt, geef je aan dat je een nieuwe Activity vanuit je app wil opstarten. Voordat je een nieuwe Activity op kan starten moet je drie dingen doen:

  • Je moet de nieuwe Activity zelf maken in een nieuwe class.
  • Je moet de Activity toevoegen in het bestand Androidmanifest.xml.
  • Je moet een object aanmaken van het type Intent (het Intent object heb je nodig als je de method startActivity wil aanroepen, zoals je kan zien in de link die ik je net gaf).

Daarna kan je de method startActivity aanroepen. Wanneer als gevolg daarvan de andere Activity is opgestart, kan je in de 'nieuwe' Activity extra informatie uitlezen die je in het Intent object gestopt hebt vanuit je 'oude' Activity. In ons geval willen we gebruikersnaam doorgeven van de Twitter-gebruiker. Nu gaan we de drie voorbereidingen treffen voor het aanroepen van een Activity en daarna gaan we de gebruikersnaam uitlezen in de nieuwe Activity.

  • In het Package Explore Window, klik je met de rechtermuisknop op de package me.moop.mytwitter en kies New --> Class: .
  • Geef de nieuwe Activity de naam TweetsActivity en zet de superclass op android.app.Activity: .
  • Kopiëer het layout-bestand nicelayout.xml in dezelfde map layout en geef hem de naam tweets.xml .
  • Open de layout tweets.xml in de Graphical Layout Editor Tab, verwijder alle Views die in de View RelativeLayout01 zitten, zodat je deze layout krijgt: .
  • Je ziet nu nog één TextView staan met de naam textView1. Omdat we deze nu wel willen gaan gebruiken in onze nieuw Activity, gaan we hem een nette naam geven: zet de Id property van textView1 op txtvTitle, zodat hij nu txtvTitle heet.
  • De tekst die in de txtvTitle is niet meer van toepassing op deze layout, zorg ervoor dat de Text property leeg wordt. Zoals je ziet staat er dan een andere tekst , en dat heeft te maken met dat deze TextView als style property @style/text_h1 gebruikt die je invalues/design.xml had beschreven.
Zoals je weet is AndroidManifest.xml het instellingenbestand van je app. Dit bestand heb je in de vorige DevTutorial ook gebruikt om de internettoegang-permissie toe te voegen voor je app. Nu moet je ditzelfde bestand gebruiken om het Androidapparaat bij het installeren van de app te laten weten dat je een tweede Activity wil gebruiken in je app:
  • Open het bestand AndroidManifest.xml in de Application Editor Tab
  • Linksonderin zie je een vak staan met de titel Application Nodes, klik rechts daarvan op de Add... knop: (zie het rode rechthoekje).
  • In het scherm dat daarop volgt kies voor Activity en klik op OK.
  • Vul rechts bij Name* als naam TweetsActivity in en en sla het bestand op: .
Je nieuwe Activity met de naam TweetsActivity is klaar om opgestart te worden (de layout fixen we zo nog). We hebben eerst een Intent object nodig om de method startActivity aan te kunnen roepen. Het Intent object dat we gaan maken kan je het beste zien als een boodschap aan het Androidsysteem dat je vanuit je huidige Activity een nieuwe Activity wil opstarten en dat je daarvoor de class TweetsActivity wilt gebruiken (dit zijn dus twee parameters: de huidige Activity en de nieuwe Activity).
  • Voeg deze code in MainActivity, in het if block van de method showTweets:
  • Maak de nodige import: android.content.Intent .
Nu moet je nog een extra bericht meegeven, die de Activity TweetsActivity uit kan lezen als hij wordt opgestart. Dit kan je doen op het Intent object met de method putExtra. Wanneer we die method willen gebruiken, moeten we twee berichtjes sturen: de eerste om een naam te geven aan het bericht dat je naar de andere Activity stuurt en de tweede om de inhoud van het bericht aan te geven. Als naam voor het bericht aan de andere Activity gebruiken we twitter_user_name en als inhoud van het bericht geven we de naam van de gedownloade Twitter-gebruiker mee.
  • Voeg deze code toe onder het aanmaken van het Intent object:
  • Daarna kan je de method startActivity gebruiken in combinatie met het Intent object dat je net hebt gemaakt (voeg deze code ook toe):

Nieuwe Activity invullen en de extras uitlezen

Nu is je TweetsActivity nog een lege Activity, als je hem nu zou opstarten krijg je een wit scherm. Als eerste moeten we TweetsActivity vullen met code die de juiste layout laadt en een TextView koppelt aan de TextView in de layout:

  • Voeg de method onCreate toe (kopieer de method regel én de regel daarboven én de eerste regel van de onCreate method uit je MainActivity class) en sluit hem daaronder af met een '}'
  • Zorg door middel van de method setContentView dat de layout uit het bestand tweets.xml geladen wordt.
  • Definiëer in het class block een TextView mTxtvTitle en koppel deze aan je layout met de method findViewById.
  • Doe de nodige imports.
Je class TweetsActivity moet er nu als volgt uitzien:

Nu is het tijd om het extra bericht op te vragen. Zoals je weet, had je deze Activity gestart met een Intent object, waar je via de method putExtra een extra bericht had meegeven met een bepaalde inhoud. Het Intent object dat een Activity heeft opgestart kan je opvragen met de method getIntent die in de Activity class zit (link)

  • Maak aan het einde van de method onCreate een Intent object aan en vul hem met de Intent die je Activity had opgestart (en maak de nodige imports):

Nu je de Intent hebt die je TweetsActivity had opgestart, kan je de extra berichten uitlezen (je hebt eigenlijk maar één bericht, maar je kan er meerdere meegeven door vaker putExtra te gebruiken). De verzameling van berichten die je een Intent stopt, heten in gewoon Nederlands een bundel en zijn in Android verwerkt in de Bundle class. De verzameling berichten van het type Bundle kan je op het Intent object opvragen door middel van de method getExtras.

  • Vraag de bundle op en stop hem in een eigen variabele (en maak de nodige imports).
  • Daarna kan je het bericht opvragen door gebruik te maken van de method getString op het Bundle object. Dit bericht (de gebruikersnaam) kan je vervolgens als tekst zetten in mTxtvTitle.

Je class TweetsActivity kan er nu als volgt uit zien:Als je nu je app opstart en je vult en gebruikersnaam in en je klikt na het downloaden ervan op de Tweets knop, dan krijg de nieuwe Activity voor je met de gebruikersnaam die je zojuist had ingevuld: . In de volgende DevTutorial gaan de tweets ophalen die bij de gebruiker hoort en tonen in een ListView. De DevTutorials die daarna komen gaan over het downloaden van afbeeldingen, het koppelen van Views aan en OnclickListener en het opslaan van de tweets in je lokale sqlite database. Dan heb je ongeveer wel de belangrijkste dingen van Android gezien).

Extra oefening

De extra oefening van deze DevTutorial is als volgt: Breid je class TwitterUser uit zodat ook de JSON-elementen description en favourites_count worden uitgelezen. Voor het opslaan van favourites_count moet je geen String gebruiken maar een int, daarvoor moet je voor het uitlezen de method optInt gebruiken in plaats van optString. Als je vervolgens deze int in MainActivity uitleest met getFavourites om hem in te stellen op een TextView moet je deze code gebruiken:Doordat je het getal combineert met een lege String (de String is tussen de beide dubbele aanhalingstekens) wordt de int automatisch gecast naar een int. Pas verder de layout en je MainActivity class aan zodat de beide gegevens ook worden weergegeven op het scherm. Ook moeten de Views die je hebt toegevoegd automatisch worden verborgen als er geen Twitter-gebruiker gevonden is. Uiteindelijk kom je uit op ongeveer deze layout: .  Wordt het je iets te lastig dan kan je naar de sourcecode kijken op github voor inspiratie (zie volgend kopje).

Sourcecode & Forum

De sourcecode kan je bekijken op github. Hier is de forum thread voor al je vragen die horen bij deze DevTutorial.

Spelfouten, taalfouten of inhoudelijke fouten ontdekt? Stuur dan een mailtje naar de auteur van dit artikel!

Reacties (22)
Bezig met laden van reacties...