ID.nl logo
Bouw je eigen Android-app: AI maakt het moeiteloos mogelijk
© Stanisic Vladimir
Huis

Bouw je eigen Android-app: AI maakt het moeiteloos mogelijk

Je hebt geen programmeerervaring, maar je wilt toch een eigen mobiele app maken? Onmogelijk? Niet met een gratis en krachtig duo als Android Studio en Cursor. Programmeerkennis is niet vereist, al helpt het als je precies weet wat je wilt en dat ook goed kunt verwoorden.

In dit artikel laten we zien hoe je eenvoudig een Android-app kunt ontwikkelen:

  • Installeer en configureer Android Studio en Cursor
  • Gebruik AI-prompts om functies toe te voegen en te optimaliseren
  • Test en debug je app met behulp van ingebouwde tools
  • Genereer een apk-bestand en installeer je app op een Android-toestel
  • Personaliseer je app met een eigen pictogram en interface

Nog meer personaliseren? Lekker persoonlijk: zo maak je je Android-smartphone écht van jou

We richten ons op het maken van Android-apps met behulp van het gratis Android Studio. Dit is de officiële geïntegreerde ontwikkelomgeving (IDE) van Google. Die biedt een uitgebreide set tools voor het ontwerpen, ontwikkelen, testen en debuggen (foutopsporing) van Android-applicaties, en ondersteunt programmeertalen als java, C++ en Kotlin. Deze laatste wordt officieel door Google ondersteund en is erg geschikt voor het ontwikkelen van Android-apps. Deze taal wordt daarom ook standaard gekozen voor nieuwe projecten in Android Studio.

Leuk om te weten, maar eigenlijk hoef je je daar helemaal niet om te bekommeren, aangezien we zelf niet, of althans niet handmatig, aan de achterliggende code gaan sleutelen. Immers, we laten deze gewoon genereren met een andere gratis tool: Cursor. Dit is een codegenerator en -editor die op Visual Studio Code is gebaseerd en door AI wordt gestuurd. Beide tools kunnen netjes naast elkaar draaien en met prompts in een natuurlijke taal, zoals Nederlands, genereer, wijzig en optimaliseer je de nodige code automatisch.

Installatie en setup Android Studio

Je hebt inmiddels begrepen dat je twee tools nodig hebt: Android Studio en Cursor. We beginnen met de eerste. Ga hiervoor naar https://developer.android.com/studio en klik op Download Android Studio (in ons geval is dit de versie Ladybug Feature Drop). Accepteer de voorwaarden en bevestig de download (circa 1,14 GB).

Open het installatiebestand, druk driemaal op Next en klik op Install. Start Android Studio na de installatie. De set-upwizard verschijnt. Klik op Next, laat Standard geselecteerd en klik opnieuw op Next.

Er worden verschillende onderdelen geïnstalleerd, waaronder een emulator, een SDK voor Android en aanvullende modules. Klik op Finish om deze te downloaden. Bevestig met Ja en klik nogmaals op Finish. Het welkomstvenster verschijnt.

Android Studio is een IDE met verschillende handige componenten.

Begin nieuw project

Klik in het welkomstvenster op New Project. Kies bij Templates voor Phone and Tablet en selecteer Empty Activity. Druk op Next. Voer een naam in voor je app, afhankelijk van het type app dat je wilt maken. In ons voorbeeld maken we een app om de weersverwachting te bekijken en op basis van temperatuur, windkracht en regenkans te bepalen of een dag geschikt is voor een fietstocht, inclusief de mogelijkheid om een locatie in te voeren. We noemen deze app Fiets of Niets.

Bij Package Name kun je bijvoorbeeld invullen nl.<jenaam>.fietsofniets, een omgekeerde domeinnaam gevolgd door de appnaam. Pas eventueel Save Location aan en noteer deze. Laat de overige instellingen, zoals API 24 en Kotlin DSL, ongewijzigd.

Klik op Finish om de benodigde bestanden te laden. Er wordt een basisstructuur gegenereerd, waaronder MainActivity.kt, een Kotlin-bestand dat de code voor de hoofdactiviteit bevat. Dit kan intimiderend ogen, maar zoals gezegd: je hoeft hier zelf zo goed als niets aan te wijzigen.

Als Android Studio detecteert dat Microsoft Defender actief is en hierover een melding geeft, klik dan op Automatically en bevestig met Ja om te voorkomen dat deze beveiliging storend werkt. Je kunt het venster Assistent verbergen via het knopje rechtsboven. Laat het Android Studio-venster wel geopend. Dit bevat nu twee deelvensters: rechts de eigenlijke code, links de bestandsstructuur voor deze code.

De Studio-omgeving met de Kotlin-code oogt intimiderend, maar watervrees is nergens voor nodig.

Installatie en setup Cursor

Hoog tijd om AI-tovenaar Cursor erbij te halen. Open je browser en ga naar www.cursor.com. Klik op Download en voer het gedownloade exe-bestand uit.

Kies de gewenste taal, bijvoorbeeld English, ga akkoord met de licentieovereenkomst, selecteer de installatielocatie en laat de overige opties ongewijzigd. Klik op Next en vervolgens op Install. Laat Launch Cursor geselecteerd en druk op Finish.

Bij de eerste opstart kun je de meeste instellingen ongemoeid laten. Wil je AI-prompts in het Nederlands gebruiken? Vul dan Nederlands in bij Language for AI en bevestig met Continue. In het volgende venster kun je eventueel Private Mode inschakelen, zodat prompts en invoer niet worden opgeslagen. Klik op Continue en daarna op Sign Up om de AI-functionaliteit te activeren. Meld je nu in het geopende browservenster aan met je e-mailadres of via een Google- of GitHub-account. Volg de instructies en bevestig indien nodig met Yes, Log in.

De installatie en setup van Cursor heb je zo voor elkaar.

Nieuw project

Wanneer je terugkeert naar het Cursor-venster, ben je automatisch aangemeld. Aangezien zowel Cursor als Android Studio een donker thema gebruiken, kan dit in het begin wat verwarrend zijn. Je kunt het thema van Cursor daarom misschien het beste aanpassen. Ga hiervoor naar File / Preferences / Theme / Color Theme en kies bijvoorbeeld Red.

Klik in het startvenster op Open project en navigeer naar de map waarin Android Studio het project heeft opgeslagen. Standaard is dit C:\Users\AndroidStudioProjects\<app_naam>. Cursor importeert automatisch de code van je Android Studio-project. Je kunt nu AI-prompts gebruiken om je app helemaal vorm te geven.

Het project is geladen en het thema hebben we wat opvallender gemaakt.

Cursor Composer

Druk op Ctrl+I om het deelvenster Cursor Composer te openen. Rechts verschijnt nu een invoerveld waarin je je eerste AI-prompt kunt typen, oftewel je vraag of instructie.

Linksonder dit venster zie je dat standaard het AI-model Claude-3.5-sonnet wordt gebruikt. Wil je een ander model, zoals gpt-4o, klik dan op het pijlknopje en selecteer je voorkeur.

Wil je extra modellen inschakelen, klik dan op het tandwielpictogram rechtsboven, open de rubriek Models en vink de gewenste modellen aan. Let op: sommige modellen vereisen een betaalde API-sleutel, die je hier bij de juiste provider kunt invullen. In dit artikel werken we verder met het gratis Claude-3.5-sonnet.

Je kunt met verschillende AI-modellen aan de slag.

AI-prompts

Het komt erop neer dat je met prompts instructies geeft aan Cursor (Composer) om je app vorm te geven. Doe dit stapsgewijs en gestructureerd. Waarschijnlijk gebruikt je projectstructuur meerdere bestanden, zoals kt en xml. Om Cursor te dwingen hiermee rekening te houden, begin je prompts bij voorkeur met @codebase (bevestig met Enter). Dit is niet altijd nodig bij eenvoudige of algemene instructies, maar kwaad kan het eigenlijk nooit.

Hieronder een voorbeeld van een eerste prompt voor onze app Fiets of Niets:

@codebase, druk op Enter. Gebruik de gratis dienst Open-Meteo om een weersvoorspelling van de eerstvolgende 7 dagen te geven, telkens in één regel, druk op Enter.

Cursor genereert direct de nodige code (bestanden). Verschijnt de melding Accept file of Accept all, klik hierop om de aanpassingen door te voeren. Wij hebben Open-Meteo gekozen omdat deze geen API-sleutel vereist. Zo vermijd je dat Cursor een dienst gebruikt die dit wel nodig heeft. Moet er toch een sleutel worden ingevoerd, geef deze dan via een prompt aan Cursor door en vraag om deze op de juiste plek in de code te verwerken.

Alle begin is moeilijk: de eerste prompts voor de ontwikkeling van een app.

App testen

Test je app geregeld. Open het venster van Android Studio – de door Cursor gegenereerde code is hier ook opgenomen – en klik bovenaan op de groene knop Run App (Shift+F10). De app start dan in de Android-emulator, al kan dit vooral de eerste keer even duren.

Het is niet uitgesloten dat er foutmeldingen verschijnen in het deelvenster Build Output (onderaan) van Android Studio. Druk hiervoor indien nodig eerst op de knop Build in de knoppenbalk linksonder. Duiken er inderdaad foutmeldingen op (zoals ‘unresolved references’), geef deze dan via prompts door aan Cursor en vraag om ze op te lossen. Bevestig de voorgestelde wijzigingen telkens met Accept all en test opnieuw.

Cursor kan ook voorstellen om foutmeldingen uit de Logcat van Android door te geven. Open Logcat in Android Studio via de gelijknamige knop in de knoppenbalk linksonder, kopieer de meldingen met Ctrl+C en plak ze in het Cursor-promptvenster met Ctrl+V. Zijn de fouten verholpen, dan kun je de app verder vormgeven, telkens met gerichte prompts aan Cursor.

Desnoods open je de Logcat en geef je foutmeldingen als prompts aan Cursor door.

App gebruiken

Werkt je app goed en ziet deze er goed uit in de emulator, dan kun je deze overzetten naar een fysiek Android-apparaat. Je kunt hiervoor een apk-bestand laten genereren (Android Package Kit) dat alle code in één pakket verzamelt. Klik op het menuknopje linksboven in Android Studio, open bovenaan het tabblad Build en kies Build App Bundle(s)/APK(s) / Build APK(s).

Je kunt je app in een apk-bestand inpakken.

Even later verschijnt een melding en kun je hier op Locate klikken om de map in Verkenner te openen. Wil je de app installeren, stel dan het apk-bestand beschikbaar op je telefoon, bijvoorbeeld via cloudopslag, en dubbelklik erop. Zorg wel eerst dat in de Android-instellingen de installatie van onbekende apps is toegestaan (via een optie als Apps / Speciale app-toegang / Onbekende apps installeren). Je kunt het kant-en-klare apk-bestand van onze eigen Fiets of Niets-app hier downloaden.

Je kunt ook je fysieke Android-apparaat direct gebruiken via de knop Device Manager in de rechterzijbalk van Android Studio. Selecteer hier je eigen apparaat in plaats van het virtuele apparaat van de emulator, mits dit via usb is aangesloten en je de nodige machtigingen hebt ingesteld. Voor verdere details hebben we hier helaas niet de ruimte.

Of je verbindt rechtstreeks je fysieke Android-apparaat.

App-pictogram

Je kunt je app op je telefoon een eigen pictogram geven. Download of ontwerp een afbeelding, bijvoorbeeld met een AI-beeldgenerator, bij voorkeur 512 x 512 pixels, en bewaar deze (bijvoorbeeld) als png-bestand.

Open je project in Android Studio en navigeer in het linkerdeelvenster, met de projectstructuur, naar app > res. Klik met rechts op res en kies New / Image Asset. Vul bij Path het pad in naar je afbeeldingsbestand, bijvoorbeeld C:\Users<naam>\desktop\fietsofniets.png. Bevestig met Next en met Finish.

Wel zo leuk: een eigen pictogram voor je eigen app.

Watch on YouTube
▼ Volgende artikel
Review OnePlus Nord CE 5 – Een heel gemiddelde smartphone
© Rens Blom
Huis

Review OnePlus Nord CE 5 – Een heel gemiddelde smartphone

Voor de OnePlus Nord CE 5 draaien weinig mensen hun hoofd om. De smartphone oogt heel doorsnee, heeft gemiddelde specificaties en ook de adviesprijs van 349 euro doet de wenkbrauwen niet fronsen. De vraag is: kan een saaie telefoon ook een goede koop zijn? Je leest het in deze OnePlus Nord CE 5-review.

Goed
Conclusie

De OnePlus Nord CE 5 is een smartphone die op geen enkel punt door de mand valt maar ook nergens in weet uit te blinken. Hoogstens kun je zeggen dat de accuduur erg goed is. Verder is de smartphone prima maar saai. In dit prijssegment vinden we de Samsung Galaxy A56, OnePlus Nord 4 (niet de CE 4) en Motorola Edge 60 Fusion boeiender.

Plus- en minpunten
  • Goed scherm
  • Lange accuduur
  • Lang updatebeleid
  • Minder krachtige hardware
  • Snelladen alleen met speciale adapter
  • Minder goede camera's

Goed om te weten is dat de Nord CE 5 een goedkopere en minder complete versie is van de Nord 5. Die kost 499 euro en biedt een aantrekkelijk totaalpakket, luidt het oordeel van onze review. De Nord CE 5 is de opvolger van de Nord CE 4, die we vorig jaar moeilijk konden aanraden door het ontbreken van allerlei bekende functies.

De meest neutrale behuizing

Ontwerp je een smartphone die niet mag opvallen, dan kom je aardig in de buurt van de OnePlus Nord CE 5. Het toestel heeft een (degelijke) kunststof behuizing waarop vingerafdrukken niet of nauwelijks zichtbaar zijn, een onopvallend camera-eiland met twee lenzen en is vrij van franje. Zeker in de zwarte kleur die wij konden testen, is het lastig te zeggen van welk merk je een telefoon in je handen hebt.

©Rens Blom

De knoppen zitten op de rechterzijkant; onderop vind je naast de usb-c-poort een simkaartslot. De vingerafdrukscanner is achter het scherm verwerkt en presteert goed. Met een gewicht van 199 gram is de smartphone van gemiddeld gewicht, zeker als je weet dat hij een groot 6,77inch-scherm en een (eveneens grote) 5200mAh-accu heeft. De behuizing kan tegen stof en een regenbui.

©Rens Blom

Goed scherm

Dat scherm is een oleddisplay, met een gangbare verversingssnelheid van 120 Hz en een prima resolutie van 2392 x 1080 pixels (Full-HD). Kleuren ogen erg fraai en het scherm kan lekker fel. Handig in de zomer.

©Rens Blom

Prima specificaties, maar onopvallend

Niet alleen de behuizing is prima zonder op te vallen, de specificaties zijn dat ook. De MediaTek Dimensity 8350 Apex-processor is snel genoeg om alle apps en games te draaien, maar schakelt bij zware games flink terug. Alsof je in je snelle auto op de snelweg alleen op de rechterbaan kunt rijden. Met 8 GB werkgeheugen en 128 GB opslagcapaciteit weet de Nord CE 5 ook geen onderscheid te maken in zijn prijssegment. Heel wat concurrenten hebben 12 GB werkgeheugen en/of 256 GB opslagcapaciteit, voor soepele prestaties, vooral op de langere termijn. OnePlus verkoopt ook een duurdere CE 5-uitvoering met 256 GB. Je kunt echter ook een microSD-kaartje in de telefoon stoppen.

©Rens Blom

OnePlus maakt een betere indruk met de accuduur. De Nord CE 5 gaat zonder problemen een lange dag mee bij gemengd gebruik. Als gezegd is de accucapaciteit 5200 mAh. Interessant: in India heeft de Nord CE 5 een mega-accu van 7100 mAh, maar die versie kan of mag OnePlus niet in andere regio's verkopen. Opladen doet de smartphone in ieder geval met maximaal 80 watt. Om die snelheid te halen, moet je wel zelf een OnePlus SuperVooc-adapter regelen. In de doos zit namelijk alleen een usb-c-kabel. Gebruik je een andere adapter dan een van OnePlus, dan laadt de smartphone een stuk langzamer op. Een aandachtspunt dus.

©Rens Blom

De OnePlus Nord CE 5 kan alleen snelladen met een aparte OnePlus-adapter.

Gemiddelde camera's

Op de achterkant van de Nord CE 5 vind je twee camera's: een hoofdcamera en een groothoeklens. Allebei zijn ze prima om plaatjes te schieten voor sociale media als WhatsApp, maar kwalitatief worden we er niet heel warm van. In deze prijsklasse zijn er sterkere concurrenten verkrijgbaar.

Hieronder zie je twee foto's, eerst gemaakt met de normale camera en rechts zie je de groothoekcamera.

©Rens Blom

©Rens Blom

Lang updatebeleid

Oké, het lukt de OnePlus Nord CE 5 ook met zijn updatebeleid niet om zich positief te onderscheiden van de concurrentie. Dat geeft echter niets, want het updatebeleid is hartstikke goed. De smartphone krijgt vier jaar Android-upgrades en zes jaar beveiligingsupdates. Je kunt de Nord CE 5 dus veilig gebruiken tot medio 2031.

De OnePlus-softwareschil over Android lijkt sprekend op de schil van Oppo. Dat komt omdat de merken zusterbedrijven zijn. De schil voegt aardig wat (overbodige) apps en games toe, maar bevat ook handige functies. Sommige functies kunnen nog beter. Denk aan de rustgevende zenmodus, die je – voor zover wij zien – telkens handmatig moet activeren. Het was logischer geweest als je kon aangeven dat de modus elke avond om 18:00 uur ingaat, bijvoorbeeld.

©Rens Blom

Conclusie: OnePlus Nord CE 5 kopen?

De OnePlus Nord CE 5 is een smartphone die op geen enkel punt door de mand valt maar ook nergens in weet uit te blinken. Hoogstens kun je zeggen dat de accuduur erg goed is. Verder is de smartphone prima maar saai. In dit prijssegment vinden we de Samsung Galaxy A56, OnePlus Nord 4 (niet de CE 4) en Motorola Edge 60 Fusion boeiender.

▼ Volgende artikel
Red je vakantiekiekjes met Apples functie Ruim op
© Kicking Studio
Huis

Red je vakantiekiekjes met Apples functie Ruim op

Terwijl je door je vakantiefoto’s bladert, merk je dat een bijna-leuke foto wordt bedorven door een of meerdere storende elementen. Er zijn uiteraard allerlei tools om die ongewenste objecten te laten verdwijnen. In de nieuwste versie van Apples fotobeheerprogramma zit die verwijderfunctie op basis van AI gewoon ingebouwd.

In dit artikel laten we zien hoe je storende objecten uit je foto’s verwijdert met Apple Foto’s:

  • Zorg dat je beschikt over iOS 18.1 en een geschikt toestel
  • Selecteer storende objecten handmatig of bevestig de AI-voorstellen om ze te verwijderen
  • Bevestig of herstel de bewerking

Voorkom dat je veel moet bewerken: 📸De beste tips voor foto's waar je je ogen niet vanaf kunt houden

Stap 1: Voorwaarden

Wie een iPhone 16 heeft en in de app Foto’s zijn kiekjes optimaliseert, is wellicht verrast door de nieuwe knop met de naam Ruim op. Er zijn nogal wat voorwaarden om deze nieuwe functie te kunnen toepassen. Je hebt allereerst een actieve internetverbinding nodig. Deze fotofunctie maakt deel uit van iOS 18.1 en om hem te gebruiken, moet je beschikken over een iPhone 15 Pro (Max) of een iPhone 16. Het werkt ook op een iPad met een M1-chip of nieuwer die draait op iPadOS 18.1 en op een Mac met een M1-processor met het besturingssysteem macOS Sequoia 15.1. Open de app Foto’s en selecteer de foto met de storende elementen. Daarna tik je op het pictogram om de afbeelding te bewerken. Dat is de knop met de drie schuifjes.

De knop Ruim op heeft het pictogram van een gummetje.

Stap 2: Selectie

Vervolgens zie je onderaan vier knoppen. We hebben het over de rechterknop Ruim op. Als je daarop tikt, doet de app al een suggestie van wat ongewenste elementen zijn. Als je het daarmee eens bent, dan tik je ze aan. Wil je het liever zelf bepalen, dan ga je met je vinger over het bedoelde object of je omcirkelt deze zone. Het geselecteerde object licht even op en verdwijnt daarna.

Wanneer je deze functie op de Mac gebruikt, kun je een bepaalde penseeldikte kiezen. Op de iPhone en iPad kun je het best even inzoomen: dat maakt het makkelijker om het object te selecteren.

Het geselecteerde object licht even op.

Stap 3: Label

Ben je tevreden, dan bevestig je met de knop Gereed. Valt het resultaat tegen, dan gebruik je de knop Herstel. Deze functie werkt wel met Live Foto’s, maar niet met video’s. Iedere foto die je op deze manier hebt aangepast, krijgt het label Gewijzigd met ‘Ruim op’. Dit label vind je bij de informatie over de tijd en de locatie waar de foto is genomen.

Ben je tevreden, dan tik je op Gereed.

Watch on YouTube