Alle berichten van Mark Van_Heck

Apps programmeren in Flutter-3

Dit is deel 3 van de tutorial het maken van van een eenvoudige app met een menubalk. Op de menubalk bevinden zich drie knoppen waarmee u naar drie verschillende pagina’s navigeert. De pagina’s hebben elk een andere kleur, maar zijn verder nog leeg. Bij een echte app zou u hierop informatie of interactieve onderdelen plaatsen. Deze mini-app geeft een beeld van de wijze waarop u in Flutter een gebruikersinterface maakt. In het eerste deel gingen we aan het werk in Dartpad en maakten we een widget ‘scherm1’. In het tweede deel maakten we meer widgets en creëerden we een basisscherm. In dit derde deel maken we een menubalk en voegen we pagina’s toe.

Stap 7: Een menubalk maken

We voegen een menubalk toe aan Scaffold. Breid de Scaffold widget in de klasse MijnEersteApp uit met de code hieronder. Bespaar u daarbij wat typewerk door gebruik te maken van de keuzelijst die u oproept met ctrl-spatie. Bijvoorbeeld: als de cursor binnen de haakjes van Scaffold staat, kunt u de eerste twee of drie letters van bottomNavigationBar typen. Als u daarna op ctrl-spatie drukt, krijgt u een lijstje met mogelijkheden waarin u de juiste optie kunt selecteren. De lijst bevat alleen opties die in deze widget bruikbaar zijn.
Lees verder Apps programmeren in Flutter-3

Apps programmeren in Flutter-2

Dit is deel 2 van de tutorial het maken van van een eenvoudige app met een menubalk. Op de menubalk bevinden zich drie knoppen waarmee u naar drie verschillende pagina’s navigeert. De pagina’s hebben elk een andere kleur, maar zijn verder nog leeg. Bij een echte app zou u hierop informatie of interactieve onderdelen plaatsen. Deze mini-app geeft een beeld van de wijze waarop u in Flutter een gebruikersinterface maakt. In het eerste deel gingen we aan het werk in Dartpad en maakten we een widget ‘scherm1’. In dit vervolg maken we meer widgets en creëren we een basisscherm.

Stap 4: Meer widgets maken

Ons doel is om een app te maken waarmee de gebruiker tussen drie schermen kan schakelen. Daarom voegen we eerst twee schermen toe. Dat gaat heel eenvoudig.

  • Kopieer de klasse Scherm1: dat is alle code uit stap 3.
  • Plak deze twee keer onder de andere code, na de laatste accolade. U krijgt nu een foutmelding bij de namen van de nieuwe klassen (omdat u vaker dezelfde naam gebruikt).
  • Verander de namen van de laatste twee klassen in Scherm2 en Scherm 3.
  • Verander de kleuren: color: Colors.red wordt color: Colors.blue bij Scherm2 en color:Colors.green bij Scherm3.

Lees verder Apps programmeren in Flutter-2

Apps programmeren in Flutter in de online-omgeving van Dartpad

Probeer het zonder installatie van software

Het programmeren van professionele apps is natuurlijk geen sinecure. Maar eenvoudige apps maakt u gemakkelijker dan u wellicht denkt. De eerste stappen zijn soms wat intimiderend: voor u één regel code schrijft, moet u een programmeer- en testomgeving downloaden, installeren en leren gebruiken. In deze tutorial slaan we deze stappen helemaal over. In de online-omgeving Dartpad kunt u gratis, snel en gemakkelijk experimenteren met het app-ontwikkelsysteem Flutter en de programmeertaal Dart. Probeer het zelf met behulp van deze drie-delige tutorial. Dit is deel 1.

Als u wilt beginnen met het maken van apps, dan is dit het ideale moment. Niet eerder was het zo gemakkelijk om native apps te maken en te testen voor zowel Android als Apple. Dat is mogelijk dankzij Flutter, het relatief nieuwe ontwikkelplatform van Google. Flutter is laagdrempeliger dan andere systemen, maar biedt toch eindeloze mogelijkheden om professionele apps te bouwen: grote bedrijven vertrouwen erop voor hun essentiële apps.

In het boek ‘Apps ontwikkelen met Flutter‘ leest u hoe u met Flutter begint. Zoals in de meeste programmeerboeken, gaat het eerste deel over de installatie van de onderdelen die u nodig heeft. Deze onderdelen zijn gratis, maar de installatie is wel een drempel voor mensen die eerst eens willen uitproberen wat Flutter nu eigenlijk is en of zij er mee aan de slag willen. Voor deze mensen is er de online-applicatie Dartpad. Daar kunt u met Flutter beginnen zonder iets te installeren. Er zijn beperkingen: als u een echte app van de code wilt maken of als u aanvullende Flutter-modules wilt gebruiken, dan heeft u echt ontwikkelsoftware nodig. Maar Dartpad is ideaal als u gewoon eens wilt proberen wat Flutter is en hoe u hierin onderdelen bouwt met Dart (de programmeertaal van Flutter). Dat gaan we doen in deze tutorial. Lees verder Apps programmeren in Flutter in de online-omgeving van Dartpad

Apps ontwikkelen met Flutter

Apps ontwikkelen met Flutter

Flutter: een mijlpaal in app-ontwikkeling

Ze hebben bij Google vast goed nagedacht over een naam die associaties oproept met snelheid, lichtvoetigheid, schoonheid en elegantie. Als de vleugelslag van een vlinder. Het werd het Engelse woord voor fladderen: ‘flutter’. Een naam die begint met ‘flut’ is in het Nederlands een slecht begin. Ik krijg dan ook meewarige blikken als ik zeg dat Flutter met afstand het beste systeem is dat ik ooit zag om apps te maken. Toch denk ik dat Flutter op dit moment het beste systeem is om apps te ontwikkelen voor zowel iOS als Android.

Boek

Apps ontwikkelen met FlutterJe vermoedde het al, dus ik noem het gelijk maar even: ik schrijf dit stuk naar aanleiding van Apps ontwikkelen met Flutter, een boek dat ik over Flutter schreef. Maar voor je nu denkt dat verkoopdrang de drijvende kracht is achter mijn enthousiasme: zo zit het niet. Het is andersom. Met een decennialange ervaring in programmeren en ontwikkelen voor het web, maakte ik begin 2019 kennis met Flutter. Het systeem fascineerde me zo dat ik mijn bestaande apps hierin heb omgebouwd en het nu gebruik voor alles wat met appontwikkeling te maken heeft. Terwijl ik het systeem leerde kennen, verbaasde ik me over de eenvoud, de elegantie en de snelheid ervan. Dat was voor mij aanleiding om met dit onderwerp naar een uitgever te stappen. Lees verder Apps ontwikkelen met Flutter