Ik geef training in frontend tools en stacks als HTML, JavaScript, TypeScript, React, Angular en Vue. Ik schrijf boeken en artikelen over tal van (ICT-) onderwerpen. Ik was lead developer en directeur bij Yindo - Jouw digitale bibliotheek. Je kunt mij volgen op Twitter(@PeterKassenaar).

In dit blog vind je persoonlijke artikelen, die niet noodzakelijk tech-gerelateerd zijn.

Views and expressions are my own.

Terug naar de algemene site.

06maart

Veranderingen…

[English text follows below]

Zoals je wellicht weet heb ik na mijn studies altijd via een eigen onderneming gewerkt als freelancer. Ik ben nooit in loondienst geweest bij een bedrijf. Het is inmiddels een heel leven aan ervaringen wat ik achter me heb liggen. Ik heb aan vertalingen gewerkt, boeken geschreven, trainingen en sprekersessies op congressen verzorgd en als programmeur meegewerkt in diverse projecten.

Het freelancebestaan beviel me zeer goed, maar ik merkte de afgelopen tijd toch dat ik aan iets nieuws toe was. Het reizen, de intakegespreken, de facturering en in het algemeen “het hele gedoe er omheen” zorgden voor versnippering van mijn focus. Dat ging me steeds meer tegenstaan.

Ik wéét dat het erbij hoort, en de afgelopen 25+ jaar sloeg de balans steeds door in het voordeel van het ZZP-schap, Maar dat is veranderd.

De afgelopen weken heb ik gesprekken gevoerd met verschillende partijen. Vandaag kan ik mededelen dat ik per 15 maart 2023 als sr. Frontend Developer in dienst zal treden bij Conclusion Confidential (https://www.conclusion.nl/confidential). Dit is een bedrijf in Apeldoorn dat software maakt ‘om de B.V. Nederland veilig te houden.’ Het gaat om ondersteuning van onder meer politie, Koninklijke marechaussee, handhavings- en opsporingsdiensten en diverse gemeenten. Er wordt voornamelijk gewerkt met Angular in het frontend en .NET als backend. Beiden technieken die mij welbekend zijn.

Ik stop derhalve met het geven van trainingen, het ontwikkelen van cursusmaterialen en het werken op projectbasis bij relaties. Ik stop niet (direct) met het schrijven van boeken en artikelen, maar zal hier wel veel minder tijd voor hebben. Het bijhouden van bestaande titels staat beslist op mijn verlanglijstje. Voor nieuwe titels zal echter weinig tot geen tijd meer overblijven, zo verwacht ik.

Ik ben benieuwd wat deze nieuwe stap brengen zal.

conclusion

Changes…

As you may know, after my studies, I have always worked as a freelancer through my own company. I have never been employed by a company. I have worked on translations, written books, provided training and speaker sessions at conferences and worked as a programmer in various projects.

I really enjoyed being a freelancer, but recently I felt I was ready for something new. The travelling, the intake meetings, the invoicing and in general "the whole thing around it" were fragmenting my focus. That started to bother me more and more.

I know it's part of the job, and for the past 25+ years the balance always tipped in favour of being self-employed, but that has changed.

Over the past few weeks, I have held talks with various parties. Today, I can announce that I will be joining Conclusion Confidential (https://www.conclusion.nl/confidential) as a Sr Frontend Developer from 15 March 2023. This is an Apeldoorn-based company that makes software "to keep the Netherlands safe". This involves supporting police, Koninklijke marechaussee, enforcement and investigation services and various municipalities, among others. I will work mainly with Angular in the frontend and .NET in the backend. Both techniques that are well known to me.

I will therefore stop giving training courses, developing course materials and working on a project basis with clients. I will not (immediately) stop writing books and articles, but I will have much less time for this. Keeping up with existing titles is definitely on my wish list. However, little to no time will be left for new titles, I expect.

I am excited to see what this new step will bring.

Peter Kassenaar

- - 6 maart 2023

24maart

Beheers Windows 11

Beheers Windows. Laat Windows jou niet beheersen

PC users are furious about the new Windows 11 design | Creative Bloq

Het valt niet te ontkennen dat er enige Windows-moeheid is opgetreden de afgelopen jaren. Vaak is de reactie “Waarom nu weer wat anders? Het werkt toch goed zoals het werkt?” Enthousiaste aankondigingen van marketingafdelingen dat de veiligheid en stabiliteit nóg verder is verbeterd kunnen maar mondjesmaat op waardering rekenen. Immers, voor de gemiddelde gebruiker is Windows al jarenlang stabiel en veilig genoeg. En, eerlijk is eerlijk. Windows 11 is ook geen revolutie ten opzichte van zijn voorganger. Eerder een evolutie. Het revolutionaire pad, volledig breken met eerdere versies, heeft Microsoft al eens bewandeld met Windows 8. Dat is geen succes gebleken. Vervolgens keerden in Windows 10 schielijk allerlei bekende onderdelen weer terug. Windows 10 kreeg dan ook lovende kritieken.

Veranderde wereld, veranderde eisen

Beheers Windows 11

Maar dat was 2015. Inmiddels al weer zeven jaar geleden. En de online wereld van toen, is niet meer de online wereld van nu. De visuele eisen van destijds zijn niet meer dezelfde als die van nu. En dus werd Windows 11 gelanceerd. Met een iets veranderd startmenu (in het midden, in plaats van aan de linkerkant). Met ronde hoekjes. Met iets andere knoppen en schaduwen. Bekend, maar toch anders. Een evolutie. Kleine dingetjes hier een daar.
Maar als Windows eigenlijk weinig veranderd is, waarom zie ik dan toch nog zo vaak dat het besturingssysteem eigenlijk nog steeds niet wordt begrepen en zéker niet optimaal wordt gebruikt? Ja, een achtergrondje aanpassen naar een eigen vakantiefoto van partner en kinderen lukt nog wel.

Beheers Windows 11

Maar handig werken met het toetsenbord, zodat je de muis wat vaker links kunt laten liggen? Vensters rangschikken op virtuele bureaubladen waar je met één toetsencombinatie naartoe kun schakelen, zodat niet tientallen vensters over elkaar vallen? Bij elkaar horende websites groeperen in Verzamelingen zodat alles netjes bij elkaar staat? Om eerlijk te zijn: het is een chaos bij de meeste computeraars. Niet uit onwillendheid, maar uit onwetendheid.

Omdat Windows – in al zijn evolutionaire ontwikkeling – langzamerhand voorzien is van allerlei handigheidjes waar de gemiddelde gebruiker geen weet van heeft. Omdat er eenvoudigweg geen aandacht aan is besteed. Waardoor er wekelijks vele minuten en jaarlijks vele uren worden weggegooid aan overbodige handelingen. Zou het niet leuk zijn als je die tientallen browsertabs wat efficiënter zou kunnen indelen? Hoe handig zou het zijn als je wist dat Windows standaard allerlei zaken al biedt, zodat je niet apart naar apps of websites hoeft te zoeken? Of andersom: Microsoft heeft bedacht dat het makkelijk zou zijn voor jou als er standaard een chatknop voor Teams in de taakbalk staat. Maar wat nu als jij die helemaal niet nodig hebt? Weg ermee.

Handboek Windows 11

In het Handboek Windows 11 worden juist dit soort dingen onder de aandacht gebracht. Vaak horen we van lezers dat ze dachten dat ze alles al wel zo ongeveer kenden. En op internet staan immers honderden sites met tips en trucs? En tóch is het handig om al die zaken op een rijtje te hebben staan. Dat er is nagedacht over de inhoud en de volgorde van onderdelen. Dat je denkt dat je alles al weet wat in een hoofdstuk staat beschreven en aan het einde ondertussen toch veel nieuws hebt bijgeleerd. Daarin blinkt het Handboek Windows 11 uit. Onverwacht blijkt jouw duurbetaalde laptop ineens veel meer te kunnen dan je altijd al deed. En dat kun jij nu ook. Zo beheers jij Windows 11, in plaats van dat Windows 11 jou beheerst.

Bestellen

Peter Kassenaar
-- 24 maart 2022

24juni

YouTube playlist - Windows 10 tips en trucs

windows_logoVaak zie ik tijdens mijn trainingen dat de basisvaardigheden van Windows wel bekend zijn (Programma's starten en sluiten, bestanden openen), maar dat enorm veel mogelijkheden ongebruikt blijven. Mogelijkheden waarmee je eenvoudig minuten kunt besparen. Elke dag opnieuw!

Ik heb daarom besloten een aantal korte video's op te nemen en te publiceren op YouTube. Elke video duurt niet langer dan 3-5 minuten, dus het kost niet te veel van je tijd. Als je een optie al kende heb je niet veel tijd verspild. Maar als een bepaalde mogelijkheid of instelling nieuw voor je is, kan het je in de toekomst een veelvoud van die tijd schelen.

In de video's komt onder meer aan de orde:

  • Het Startmenu optimaal gebruiken
  • Windows Verkenner
  • Sneltoetsen
  • Het uiterlijk van Windows instellen
  • Thema's gebruiken
  • Meegeleverde Tools
  • Browsers en internet gebruiken
  • Allerlei Windows-instellingen aanpassen
  • ... en nog veel meer

image

https://www.youtube.com/watch?v=Lr1TPUuQqOE&list=PLhOYRbbfrvpGEJdiYsRCHsfRczjNyX9vy

Daarnaast heb ik een bijpassende website gemaakt, www.windowstips.nl.

Als je er op- of aanmerkingen over hebt, hoor ik het graag.

Peter Kassenaar
-- 24 juni 2021

29oktober

Kennismaken met Flutter

flutter-logoNu in coronatijden mijn ZZP-agenda maar heel mager is gevuld, heb ik besloten om van de nood een deugd te maken. Ik ga twee nieuwe frameworks onderzoeken waarvoor het mij tot op dit moment aan de tijd ontbrak om me er meer in te verdiepen. Dat zijn:

In dit artikel kijk ik naar Flutter. Afgelopen week heb ik kennisgemaakt met Flutter, de documentatie gelezen, online tutorial(s) gevolgd en verder rondgesnuffeld naar Flutter-informatie op de voor de hand liggende plekken als Stack Overflow, YouTube en Dev.to.

Disclaimer - ik ben frontend developer. Ik ken frameworks als Angular, Vue en React op mijn duimpje. Ik heb ook gewerkt met PhoneGap/Cordova, Ionic en React Native. Hiermee heb ik applicaties gemaakt. Mijn beleving en beschrijving van Flutter - waarmee je ook mobiele apps maakt - komt dan ook vanuit dit perspectief. Ik maak regelmatig de vergelijking me zaken die ik ken. Dat hoeft voor jou natuurlijk niet zo te zijn! Toch probeer ik het zo eenvoudig mogelijk te houden en een voor iedereen duidelijke beginners/intro te schrijven over Flutter.

Download dit artikel als PDF (3,6 MB, 26 pagina’s)

In dit artikel beantwoord ik de volgende vragen:

  1. Wat is Flutter?
  2. Waar wordt het voor gebruikt?
  3. Hoe gaat lokale Installatie en Ontwikkeling?
  4. Hoe maak ik een eerste applicatie?
  5. Hoe maak ik een niet-triviale proof-of-concept applicatie: een app die op basis van een zoekvraag van een gebruiker communiceert met een backend en de resultaten in de UI toont.

Ik ben geen beginner in app-development, maar uiteraard wel in Flutter. Daarom heb ik ongetwijfeld zaken gemist of heb ik dingen omslachtig gedaan (omdat ik die nu eenmaal ken uit andere frameworks) die in Flutter veel eenvoudiger kunnen. Aarzel in dat geval niet om het mij te laten weten!

Video – Kennismaken met Flutter en je eerste app (YouTube)

1. Wat is Flutter?

Flutter is een Mobile UI Framework van Google, dat wordt gebruikt voor het maken van apps voor iOS en Android. Je maakt met Flutter native apps. Het zijn dus geen apps die draaien in een webview van het betreffende platform (zoals Ionic en PhoneGap). De homepage van Flutter is te vinden op flutter.dev.

Het kenmerk van Flutter is dat er een single code base is. Apps schrijf je in de eveneens door Google ontwikkelde programmeertaal Dart (dart.dev). Jouw Dart-code wordt gebruikt om apps te compileren voor meerdere platforms.

Met Flutter kun je ook apps maken voor embedded systems zoals Google Assistant-devices of Nest-thermostaten. Flutter heeft hiermee dezelfde doelstellingen als bijvoorbeeld Xamarin (voor C#-programmeurs) en React Native (voor React-programmeurs).

Met Flutter ontwikkelde apps kun je publiceren in de Apple App Store of op Google Play. Natuurlijk kun je ze ook intern binnen je bedrijf uitrollen.

00-flutter-ecosystem

Dart

Je schrijft je Flutter-apps in Dart. Dit betekent dat je behalve het Flutter UI-systeem ook een nieuwe programmeertaal moet leren. Je leert dus eigenlijk twee dingen tegelijk. Dart heeft onder meer de volgende kenmerken:

  • Dart-code compileert naar native Android-code (Java of Kotlin) en native iOS-code (Objective C of Swift). Er is ook een experimentele module die compileert naar JavaScript-code, zodat je je app ook op het web kunt gebruiken. Deze moet je in Flutter apart inschakelen.
  • Dart lijkt op andere programmeertalen zoals Java, JavaScript of TypeScript. Je kunt daarom als programmeur snel overweg met Dart. Er zijn concepten als classes, componenten/widgets, loops, variabelen, functies enzovoort. Dart leent zowel concepten uit de OO-talen als uit de Functional Programming-wereld.
  • Dart is een staticly typed language, anders dan JavaScript. Het betekent dat je variabelen altijd als een bepaald type moet declareren. Voor de JavaScript-programmeur zijn er een aantal nieuwe keywords. Ze hebben echter wel overeenkomsten met JavaScript.
  • Ik was compleet nieuw in Dart. Mijn ervaring is dat je het snel oppikt als je al programmeerervaring hebt, maar dat er subtiele verschillen zijn waar je regelmatig over struikelt.

UI-system en widgets

De kern van Flutter zijn de werkelijk talloze (honderden!) verschillende user interface componenten. In Flutter-taal heten dit widgets. Zoals je in moderne webframeworks (Angular, Vue, React, Svelte) denkt in componenten, denk je in Flutter in widgets. Elke applicatie is een boomstructuur van widgets. Denk aan containers, knoppen, dialoogvensters, icons en verder alles wat je op het scherm ziet.

Dit wordt erg ver doorgevoerd. Ook als je witruimte binnen- of rondom een element wilt instellen, doe je dit via een Padding-widget of een Margin-widget. Daarnaast heeft elke widget – net als in HTML – talloze eigenschappen (attributes) waarmee je de inhoud verder instelt.

00-flutter-widgets

Mobile web

Flutter heeft zich erg laten inspireren door het mobiele web. Er is geleerd van de lessen van CSS-lay-out zoals CSS-flexbox en Grid en de flexibele flow van elementen op een pagina. Als je dit in CSS beheerst, zul je relatief snel de Flutter-manier van lay-out begrijpen.

Als je dit nog niet kent, zul je wel een aantal keren je hoofd breken over de vraag "waarom is het zo moeilijk een knop onderin de pagina te krijgen?!" of om anderszins een element op de goede plek te positioneren. Je moet een fluïde geest hebben voor het realiseren van fluïde lay-outs.

Flutter gebruikt Material Design (eveneens ontwikkeld door Google) als uitgangspunt.

Documentatie

De kwaliteit van een framework valt of staat vaak met de kwaliteit van de documentatie. Een framework kan nog zo goed zijn, als je niet weet hoe alle mogelijkheden benut worden, heb je er niks aan. Wat dat betreft heeft team Flutter zijn werk goed gedaan en gezorgd voor prima documentatie. Zie ook de voorgaande afbeelding. Daar kan de rest van Google eigenlijk nog een voorbeeld aan nemen.

Bij elke widget zijn codevoorbeelden opgenomen, vaak in een interactieve app, zodat je er zelf mee kunt oefenen. De talloze properties en methods worden beschreven; er zijn vaak video's aanwezig ('widget of the week') waarin het gebruik van een widget wordt uitgelegd en er zijn voldoende verwijzingen naar andere bronnen aanwezig.

Het lastige is vooral de hoeveelheid documentatie. Als je niet wéét dat een bepaalde taak door een aanvullende widget wordt uitgevoerd, kun je lang zoeken. Het is eerder te veel dan te weinig. Maar als je zelf een beetje kunt filteren, pik je de elementaire onderdelen er gelukkig snel uit.

Mijn oordeel over de documentatie: ++

2. Waar wordt Flutter voor gebruikt?

Flutter wordt vooral gebruikt voor crossplatform mobiele applicaties. Inmiddels gebruiken honderden grote en kleine bedrijven Flutter als tool. Dit zijn onder meer Google zelf, Alibaba, Tencent, eBay, BMW en de New York Times. Geen kleine jongens. Ja, er zijn ook implementaties voor embedded devices, maar deze zijn vooralsnog vooral van Google zelf. Ik heb geen voorbeelden van andere fabrikanten gezien. Wellicht dat we op termijn ook appjes kunnen maken voor Raspberry Pi of Arduino-boards.

Een showcase-pagina van Flutter-apps is te vinden op flutter.dev/showcase.

00-flutter-showcase

Flutter in Nederland en België

Persoonlijk ken ik nog geen bedrijven in Nederland of België die hun app(s) met Flutter hebben ontwikkeld, al hoor ik van (outsourcing- en detacherings-) relaties dat er wel degelijk vraag is naar Flutter-kennis. Het is een interessante techniek die zich inmiddels afdoende bewezen heeft.

Om te zien of er interesse is, kun je bijvoorbeeld kijken naar Google Trends. Een eenvoudige vergelijking tussen Flutter, React Native en Xamarin laat zien dat de interesse voor Flutter groter is dan voor de andere twee. De trend wordt ook door Google als rising aangeduid (al durf ik er mijn hand niet voor in het vuur te steken dat dit niet komt omdat het een technologie van Google zelf is).

00-flutter-google-trends

Bekijk zelf de huidige trend op trends.google.com/trends/explore?geo=NL&q=flutter,React%20native,xamarin.

Brede blik

Voor een wat bredere blik op de vraag naar Flutter-kennis en -applicaties kun je bijvoorbeeld kijken naar de jaarlijkse Stack Overflow Developer Survey. Die van 2020 is te vinden op insights.stackoverflow.com/survey/2020.

Je ziet dan dat Flutter in de categorie Other frameworks, Libraries en Tools nog juist in de top-10 staat. Achter React Native, maar ver voor andere frameworks als Xamarin en Cordova.

In de categorie Most Loved staat Flutter op plek 3, terwijl React Native op de tiende plaats is beland. Xamarin en Cordova bungelen in dit rijtje onderaan (maar scoren zoals verwacht dan juist weer heel hoog in de categorie Most Dreaded). Dat geeft mijns inziens wel aan dat Flutter, hoewel het nog niet een supergrote technologie is, wel een techniek is die redelijk populair is onder developers en waarmee bovendien graag gewerkt wordt.

00-stack-overflow

3. Hoe gaat lokale ontwikkeling en installatie?

Veel webframeworks kun je uitproberen zonder het downloaden van een tool of lokale installatie. Op stackblitz.com of codesandbox.io kun je direct online aan de slag met React, Angular, Vue, Nuxt, TypeScript en wat al niet. Dat is niet het geval bij Flutter.

Je moet hiervoor lokaal de juiste SDK's downloaden voor het platform van jouw keuze. Dus: de Android SDK voor Android-apps of Xcode plus talloze aanvullende bibliotheken voor MacOS-applicaties. Of beiden. Daarnaast moet je een editor installeren met de nodige Flutter- en Dart-plug-ins. Dat kost je vele gigabytes. En veel tijd.

Het is allemaal niet superlastig en is gelukkig een eenmalig klusje, maar reken in het gunstigste geval wel op anderhalf uur of langer voordat je aan de slag kunt met een simpele Hello World-applicatie.

Je wilt je app natuurlijk ook testen op een echte telefoon. Android-telefoons kun je meestal gewoon koppelen aan je computer. Voor iPhones is de werkwijze een stuk omslachtiger. En als je de pech hebt dat je telefoon niet herkend wordt door je pc, ben je zomaar weer uren verder met het zoeken naar een oplossing en installeren van de juiste drivers.

Wat heb je nodig?

Om te kunnen beginnen met Flutter moet je een aantal stappen doorlopen. Op de Flutter-website wordt dit onder Getting Started uitvoerig beschreven. Ik heb deze procedure gevolgd voor Windows en het liep relatief goed (op een connectieprobleem met mijn Samsung S8 na. Maar daar kon Flutter niks aan doen).

01-flutter-clone

Je moet hebben:

  • Git als versiebeheertool. Zelfs als je zelf Git niet gebruikt (je hebt bijvoorbeeld SVN of TFS), heeft Flutter het nodig.
  • De Flutter SDK. Dit is een repo die je kloont, of een zip-bestand dat je kunt downloaden en uitpakken. Als standaardlocatie wordt C:\src\flutter aanbevolen. Deze heb ik aangehouden.
  • Je Path instellen zodat flutter bekend is in de Terminal-omgeving of in Powershell. Hiervoor moet je in Windows de omgevingsvariabelen aanpassen (zie afbeelding).

02-flutter-path

  • Android Studio en de Android SDK's. Dit kost veel schijfruimte. De procedure is nu gelukkig geautomatiseerd (een paar jaar geleden, toen ik hetzelfde deed voor PhoneGap, moest dit allemaal nog met de hand), maar het kost veel tijd. Android Studio is gratis en is te vinden op https://developer.android.com/studio.
  • Na installatie van Android Studio (dit installeert de Android SDK, de SDK command-line tools, de SDK Build-tools en de IDE zelf) moet je nog de juiste Flutter- en Dart-plug-ins installeren.
  • Je kunt ook Visual Studio Code gebruiken. Hiervoor zijn Flutter- en Dart-extensions beschikbaar. Ook dan heb je echter Android Studio nodig, of op zijn minst de hiervoor genoemde SDK's. Die kun je eventueel met de opdracht flutter doctor installeren. Dit pad heb ik niet gevolgd.

03-flutter-android-studio

  • Als alle software is geïnstalleerd wil je een android device kunnen gebruiken. Hiervoor moeten de Developer options (Ontwikkelaarstools) en USB debugging op je apparaat zijn ingeschakeld. Hoe dit werkt, verschilt per merk (Samsung, Huawei, Sony enzovoort).
  • Voor Windows moet je vanuit Android Studio in dat geval nog de Google USB-driver installeren als generieke driver. Voor Mac is dat niet nodig.
  • Mocht je niet op een fysiek apparaat willen of kunnen testen, dan kun je altijd een Android Emulator aanmaken via de AVD, de Android Virtual Device Manager.

03-google-usb-driver

Android Emulator

De Android Emulator is gelukkig een stuk sneller dan vroeger. Het is zowaar een valide oplossing geworden om je apps te testen, zo heb ik gemerkt.

Een paar jaar geleden was het snéller om naar de winkel te lopen en een nieuwe Android-telefoon te kopen om op te testen dan om de emulator op te starten en de app hierin te draaien. Dat is nu een stuk verbeterd.

Alle moderne pc's ondersteunen VM acceleration en grafische kaarten kennen hardware acceleration, waardoor de apps ook in de emulator redelijk responsief aanvoelen.

04-android-emulator

Flutter voor het web

Je kunt Flutter ook gebruiken voor het maken van webapplicaties. Hiervoor moet je eerst alle voorgaande stappen doorlopen.

Daarna kun je flutter upgraden naar het beta channel en met de flag --enable-web het maken van webprojecten inschakelen. Zoals gezegd, dit is allemaal nogal experimenteel op dit moment. Het is omgeven met waarschuwingen en in de betafase. Ik heb het niet geprobeerd.

In de toekomst verwacht ik dat dit soepeler is opgelost en geïntegreerd in de totale Flutter-workflow. Je leest er voor nu eventueel meer over op https://flutter.dev/docs/get-started/web.

05-flutter-web

Flutter doctor

De command line tool voor het werken met Flutter heet – niet verrassend – flutter. De totale installatie kun je checken met de opdracht flutter doctor. Met de flag -v (verbose) toon je complete uitvoer.

06-flutter-doctor

De tool lijkt evenwel niet altijd goed te werken. Ik heb bijvoorbeeld wel degelijk de Flutter plug-in en Dart plug-in voor Android Studio geïnstalleerd. Maar flutter doctor herkent ze niet, zoals in bovenstaande afbeelding is te zien. In ieder geval is het een handige aanvullende analysetool om mogelijke problemen op te lossen.

4. Hoe maak ik een eerste applicatie?

Als de installatieperikelen achter de rug zijn kun je een eerste applicatie maken. Hier beschrijf ik het pad voor de 'officiële' editor, Android Studio. Maar ook in Visual Studio Code met de nodige extensions heb ik succesvol Flutter-apps geschreven.

Android Studio biedt wat mij betreft echter net wat meer handige panels om inzicht te krijgen in de structuur van je applicatie zodra deze wat complexer wordt. Ook het beheren van AVD's en plug-ins is wat soepeler. Maar dat is een kwestie van persoonlijke voorkeur. Visual Studio Code is een stuk kleiner en start sneller op. Als je dit al gewend bent voor webontwikkeling, dan zou ik je zeker aanbevelen hiermee ook Flutter-apps te maken.

07-new-project

In Android Studio kies je na het installeren van de plug-ins voor het maken van een New Flutter Project. Als je de standaardinstellingen overneemt, krijg je een applicatie met een homepage met daarop een aantal Widgets. Dit zijn onder meer een AppBar, een counter-variabele, tekst, en een knop (FloatingActionButton) om de teller op te hogen.

08-flutter-demo-app

In de voorbeeldcode is ruim voldoende commentaar opgenomen (lees dit!) om te zien hoe de applicatie werkt en wat je kunt aanpassen om deze demo-app een ander uiterlijk te geven.

Structuur van de applicatie

Omdat de applicatie naar meerdere platformen kan worden gepubliceerd, staan er ook meerdere mappen in de boomstructuur. Je ziet ze in de afbeelding.

09-flutter-structure

  • Op root niveau staan directories als /android, /ios en /.dart-tool. Dit zijn folders voor de diverse platforms en met aanvullende tools. Meestal zul je hier nooit handmatig in aan het werk zijn. Hooguit als je voor publicatie een aantal permissies wilt instellen, een icon wilt plaatsen of meer.
  • De meeste tijd zul je doorbrengen in de folder /lib. Hierin staan je werkbestanden. Het startbestand is main.dart. Vanuit de folder /lib worden bij een build de bestanden gecompileerd en gedistribueerd naar de verschillende platform-directories.
  • In /lib kun je subfolders maken om je bestanden te groeperen en organiseren, al heten dat hier om een of andere duistere reden packages. Kies dus New, Package als je een submap wilt maken.
  • Op het rootnivau staan configuratiebestanden als .pubspec.yaml, .gitignore en meer.

Voor webdevelopers: .pubspec.yaml is te vergelijken met package.json.

Helaas is er echter niet een handige tool zoals NPM om aanvullende packages te installeren, dat zul je zelf met de hand moeten doen. Hierbij moet je ook het aantal spaties inspringing respecteren, anders is de structuur van het bestand niet correct. Beetje ouderwets en omslachtig, maar het werkt.

Een overzicht van beschikbare packages voor Flutter en Dart is te vinden op pub.dev. Deze site kun je volgens mij het beste vergelijken met www.npmjs.com. waar je NPM-packages kunt vinden. Maar het is een compleet nieuw, afzonderlijk package- en module ecosysteem, naast NPM of NuGet (als je uit de .NET-wereld komt).

Widgets in Flutter

De complete applicatie is in Flutter gebouwd rond het concept van Widgets. Een widget kun je vergelijken met een component in Angular, Vue of React. Op de achtergrond is een widget een class en daarmee gewoon een functie. Je kunt daarmee een widget aanroepen of invoken.

Flutter kent twee verschillende typen widgets:

  • StatelessWidget – Dit is een widget waarvan de state (oftewel: data, variabelen) in de levensduur van de widget niet veranderen. Je kunt wel data hebben in een StatelessWidget, maar deze blijft dus steeds hetzelfde. De documentatie beschrijft een StatelessWidget als volgt: "A stateless widget is a widget that describes part of the user interface by building a constellation of other widgets that describe the user interface more concretely." De voornaamste taak van een StatelessWidget is dan ook het aanroepen van andere (meer dynamische) widgets.
  • StatefulWidget - hiervan kan de data gedurende de levensduur veranderen. Een StatefulWidget bestaat bovendien uit twee delen:
    • Een class waarmee de stateful widget wordt beschreven en waarin de functie createState() wordt aangeroepen om de data voor deze klasse te initialiseren.
    • Een state-class waarmee de data/variabelen van de widget worden beschreven. Deze wordt altijd voorafgegaan door een underscore. In Dart geeft een underscore voor een klasse- of variabelenaam aan dat het betreffende object private is (zoals in _userName).
  • Een Statefulwidget heeft dus bijvoorbeeld de hoofdklasse AboutUs(). Deze bevat een aanroep naar createState() waarin de bijbehorende state-klasse _AboutUs() wordt aangeroepen. Vanuit Android studio kun je met de shortcut stful <Tab> snel deze twee klassen maken.

Een StatelessWidget of StatefulWidget worden niet rechtstreeks aangeroepen. Je maakt altijd een klasse die extend ten opzichte van het gewenste type widget.

De functie build()

Elke widget moet de functie build() implementeren. Hierin wordt de widget tree opgebouwd.

In De inhoud van build() is weer een andere widget! Dit is vaak een widget Container() of Scaffold(), waarin weer andere widgets zijn genest die stukjes UI voor hun rekening nemen.

Wanneer in een StatefulWidget de state wordt gewijzigd, wordt de functie build() opnieuw uitgevoerd om de wijzigingen in de UI door te voeren. State wordt altijd gewijzigd via een functie setState(). De manier waarop Flutter met state omgaat deed me erg denken aan React.

In de voorbeeldapplicatie zie je bijvoorbeeld dat de widget tree bestaat uit een App met een Homepage waarin een Scaffold widget is geplaatst. Deze roept op zijn beurt weer de widget Center() aan waarin een AppBar() is opgenomen, een widget Text() en een FloatingActionButton().

12-widget-tree

De afbeelding komt uit Android Studio, het paneel Flutter Inspector. In code ziet de widget tree er op deze manier uit:

Gewoon een stukje tekst op de pagina typen of een afbeelding plaatsen kun je wel vergeten. Deze moet je minimaal wrappen in een widget Text() widget of een widget Image(). Bij afbeeldingen kun je daarnaast weer kiezen uit verschillende typen afbeeldingen (online, lokaal, avatars).

Tekst kan daarbij eigenschappen hebben zoals het lettertype, de uitlijning, de lettergrootte enzovoort. Dit kun je niet zomaar instellen (zoals in CSS), maar moet je regelen via de widget TextStyle(). Daarbij is 'rood' niet gewoon een kleur, maar een enum die is vastgelegd via het object Colors.red. Zoals gezegd, er zijn superveel widgets en properties die je moet leren kennen.

Compositie

Je maakt in Flutter dus widgets, die bestaan uit andere widgets. Deze widgets kunnen zelf weer widgets genereren en invoegen in de tree. Dat is erg krachtig en zorgt er voor dat je relatief eenvoudig generieke (bedrijfs-) widgets kan maken die je kunt hergebruiken in andere applicaties.

Als je het goed indeelt en beheert, is de reusability van widgets groot.

Je maakt dan als het ware een 'compositie' voor nieuwe applicaties op basis van bestaande widgets. Flutter implementeert hiermee een beetje het idee dat ook achter React Hooks en in de Composition API van Vue.js zit. Beslist een moderne architectuur en een denkwijze die nog jaren meekan. In ieder geval hoogstwaarschijnlijk langer dan de levensduur van de apps die je met Flutter maakt.

De widget tree

Mijn ervaring na een weekje Flutter is dat de widget tree enorm snel, enorm groot kan worden. Het gevaar loert dat het een onoverzichtelijk zooitje wordt.

Android Studio probeert je wel te helpen met visuele commentaren (die niet in de code worden geplaatst). Die geven aan waar een bepaalde widget eindigt en waar een nieuwe begint, maar het blijft een enorme diepe piramide aan geneste widgets die je aan het maken bent.

Je kunt dit enigszins oplossen door custom widgets te maken die [een deel van] de widget tree samenstellen en retourneren, maar het blijft erg lastig om de structuur te doorzien en te analyseren waar je een nieuwe rij of knop moet plaatsen als je bestaande code wilt aanpassen.

De afbeelding toont een supereenvoudige pagina met een aantal rijen en kolommen met daarin wat tekst. Je ziet nu al de enorme mate van nesting. Dit wordt er bij grotere applicaties alleen maar erger op.

15-widget-tree-nesting

Mijn advies: leer zo snel mogelijk het lay-out-systeem van Flutter met de widgets Scaffold(), Container(), Column() en Row() en de uitlijningsmogelijkheden. Pas dan kun je code begrijpen en eenvoudige pagina's maken.

Bestaande pagina’s kun je dan sneller ontleden. Deze pagina helpt bij het begrijpen van het lay-outsysteem van Flutter: flutter.dev/docs/development/ui/layout/tutorial.

Dart

De programmeertaal Dart was relatief eenvoudig te leren. Ik heb zelf natuurlijk een JavaScript-achtergrond (en een.NET, maar geen Java), maar kon er snel mee overweg. Enkele items die mij opvielen:

  • Alle variabelen zijn statisch getypeerd. Dit is verplicht.
  • Elk statement wordt afgesloten met een puntkomma. Dit is verplicht.
  • Keywords die mij opvielen:
    • dynamic - vergelijkbaar met het TypeScript-type any. Een variabele kan verschillende typen inhoud krijgen
    • final - variabelen kunnen niet meer gewijzigd worden (vergelijkbaar met sealed in andere talen)
    • Future - een asynchrone waarde. Vergelijkbaar met een Promise() in JavaScript.
    • Map - vergelijkbaar met een object literal in JavaScript, een variabele met key/valuepairs tussen {…}.
    • Maar waarom worden typen als int, double en bool met een kleine letter geschreven, maar String met een hoofdletter?
  • Een functie heeft altijd een returntype. Dit is verplicht het wordt aangegeven voorafgaand aan de naam van een functie, zoals in void main() => …
  • Het is niet straightforward om met JSON te werken. In JavaScript kun je JSON rechtstreeks benaderen als object, maar Dart beschouwd JSON gewoon als één lange string. Je moet het zelf parsen en omzetten als je binnen de applicatie met objecten verder wilt werken. Daar zijn wel functies voor aanwezig (jsonDecode() en jsonEncode() in de package dart:convert), maar je moet het toch maar weer doen.

Zoals gezegd, er zijn erg veel overeenkomsten met andere programmeertalen. Het leren van Dart is niet de grootste uitdaging als je met Flutter aan het werk wilt.

Je kunt met Dart oefenen in de online omgeving DartPad, op dartpad.dartlang.org. Hier zijn ook een aantal (niet Flutter-specifieke) voorbeelden aanwezig. Ze helpen je om de taal te leren kennen.

16-dartpad

Tutorial

Wil je iets verder dan alleen de Hello World-applicatie, dan kun je de online tutorial volgen op codelabs.developers.google.com/codelabs/first-flutter-app-pt1/#0. Hierin maak je een oneindige scrolling list, waarbij je kennismaakt met allerlei widgets en externe packages importeert. Het is een goed begin. Ik heb er veel van geleerd en was er in twee uurtjes doorheen.

5. Hoe maak ik een Proof-of-concept applicatie?

Anders dan bij Svelte kon ik niet in een paar uurtjes de applicatie namaken die ik voor andere frameworks heb gemaakt. Het programmeren in Dart was niet het probleem.

Het kost daarentegen veel tijd om te leren werken met het lay-outsysteem van Flutter. Het uitzoeken wánneer je wélke widget gebruikt om de lay-out te realiseren die je in je hoofd hebt kost de meeste tijd. Zelfs als je zo'n eenvoudige applicatie wilt maken als ik hieronder heb gemaakt.

De requirements zijn tamelijk eenvoudig, maar laten toch het complete stappenplan van een real-life app, inclusief communicatie met een backend zien.

  • Toon een eenvoudige user interface waar de bezoeker kan zoeken op (deel van) de naam van een land.

  • Communiceer met een backend - ik gebruik hiervoor de REST Countries API, beschikbaar op https://restcountries.eu/ - om een serie landen op te halen die voldoen aan het trefwoord van de bezoeker.

  • Toon een lijstje met landen die aan het trefwoord voldoen in de user interface.

  • Bij klikken op een land worden details van het betreffende land getoond in een pagina.

17-country-demo

Je kunt deze applicatie zelf bekijken op github, op https://github.com/PeterKassenaar/flutter-demo-countries. Voel je vrij om de applicatie te downloaden, hem te openen in Android Studio en te draaien op je device of in de emulator. Kijk hoe de data flow door de applicatie en de componenten is. Vervolgens kun je hem verder zelf uitbreiden. Mocht je aanpassingen of verbeteringen hebben, dan houd ik me natuurlijk aanbevolen voor PR's!

Dit is een tamelijk eenvoudige applicatie, nog zonder error handling, testing, animaties of state management. Wel is routing toegevoegd. De code kan nog (veel) verder verbeterd worden. Op de TODO-lijst staat bijvoorbeeld:

  • API-calls centraliseren in een service die vanuit diverse widgets wordt aangeroepen. Nu heb ik dat per widget geregeld.
  • Een CountryModel / -class maken, zodat de opgehaalde landen kunnen worden aangeduid als instanties van die class. Nu zijn het gewoon <dynamic> elementen.
  • De widget tree vereenvoudigen door compositie te gebruiken en terugkerende taken uit te besteden aan functies. Nu is elke widget gewoon van boven naar beneden opgebouwd. Het werkt, het ziet er goed uit, maar de code kan compacter en meer DRY.

Conclusie

Flutter is een framework dat zich qua functionaliteit en mogelijkheden absoluut kan meten met langer bestaande alternatieven als Xamarin, NativeScript en React Native. Het is qua performance sowieso beter dan frameworks die hun applicatie wrappen in een webview, zoals Ionic, Capacitor en Cordova.

Met Flutter maak je absoluut mobiele applicaties met een native look-and-feel, zonder dat je hiervoor aanvullende moeite hoeft te doen. De taal Dart is voor programmeurs eenvoudig te leren.

De uitdaging zit hem in het doorzien van de wijze waarop de widget tree wordt opgebouwd en hoe widgets andere widgets kunnen samenstellen en retourneren. Een Flutter-app kan naar mijn idee snel uitgroeien tot een nachtmerrie voor beheerders. Ook degenen die blanco inrollen in een project met een bestaande codebase kunnen het zwaar krijgen. Android Studio probeert je daarbij te helpen met structuurdiagrammen en commentaren, maar ik denk dat het inwerken in een bestaand project serieus tijd gaat kosten.

Op de vraag "moet ik Flutter gaan leren?", is zoals gebruikelijk geen eenvoudig antwoord te geven. Het enige juiste antwoord is meestal "dat hangt er van af". Om je te helpen de beslissing te nemen, zou je de volgende vragen kunnen beantwoorden.

  • Ben je een beginner in mobiele apps? - Dan is Flutter een uitstekende keuze. Je moet wel veel nieuws leren, maar je apps zijn direct beschikbaar voor Android en iOS. Op termijn kun je het web toevoegen als platform. Je hoeft je niet te verdiepen in C#/Xamarin of Java/Kotlin of eerst React te leren. Met Flutter ben je - ook als bedrijf - relatief snel up-and-running en voorbereid op de toekomst. In ieder geval voor de komen 5-7 jaar is mijn inschatting.
  • Ben je JavaScript-developer en maak je websites met HTML, CSS en JavaScript? Dan helpt het een beetje als je moderne CSS-lay-outopties kent, maar verder zul je veel nieuws moeten leren. Ga uit van een stevig leertraject.
  • Ben je developer in Angular of Vue? Dan zul je Dart als nieuwe programmeertaal moeten leren. De overstap vanuit JavaScript is echter relatief eenvoudig, ik heb het zelf gedaan de afgelopen week. Als je al gewend bent met TypeScript te werken wordt het nog makkelijker. Het is een kwestie van syntaxis-wijzigingen. Maar toch - je moet er weer iets bij leren en je moet je kennis voor twee verschillende technologieën onderhouden. Dat kost wel tijd - en dus geld. Extra kennis is altijd waardevol, maar komt met een prijs.
  • Ben je React-programmeur? Ga dan verder met React Native. Ook dit platform is volwassen, er is veel vraag naar, een grote community voor beschikbaar en je hoeft niet veel nieuwe technieken te leren. Flutter is in dat geval overkill. De meerwaarde ervan ten opzichte van React Native is mijns inziens gering.
  • Ben je fullstack JavaScript-programmeur en schrijf je Node.js-API's en -applicaties en websites in een van de populaire webframeworks? Dan ligt het wellicht meer voor de hand om een JavaScript-mobiele toepassing te gebruiken als Cordova of, nieuwer, Ionic/Capacitor. Tenzij ruwe performance of pure native look-and-feel een topprioriteit is. Daarin is Flutter weer beter, omdat het niet de overhead van een webframework en -view heeft en niet met een CSS-implementatie de native UI-onderdelen hoeft na te bootsen.
  • Ben je Java- of C#-developer? Dan sta je voor een lastige keuze.
    • Als Java-programmeur staat native Android-development (met Java of Kotlin) waarschijnlijk dichter bij je en ben daar sneller productief in. Je maakt dan echter geen crossplatform apps. Het kan de moeite lonen Dart te leren en het UI-systeem van Flutter onder de knie te krijgen. Omdat je al gewend bent te werken met Material Design, Futures en asynchrone code zal dat evenwel ook niet al te lastig zijn.
    • Als C#-developer ligt de keuze voor Xamarin meer voor de hand. Hiermee maak je wel crossplatform apps, maar het is niet (meer) het meest voor de hand liggende framework voor app-ontwikkeling. Voordeel is echter wel dat Xamarin uitstekend is geïntegreerd in Visual Studio (waar je nu waarschijnlijk toch al mee werkt). Het past uitstekend binnen de stack van andere .NET-applicaties en technieken (Internet Information Server, SQL Server, AD enzovoort). Als je 'gewone' applicaties in .NET maakt, en mobiele apps in Flutter gaat schrijven, moet je een compleet nieuwe stack en -toolset leren. Je kunt je afvragen of dat de moeite waard is.

Maak op basis van bovenstaande vragen een keuze. Je kunt altijd eens kijken op https://flutter.dev/ om te zien of het wat voor je is. En uiteraard help ik je ook graag verder als jij of je bedrijf een Flutter-vraag heeft.

Peter Kassenaar
--29 oktober 2020.

01mei

Windows 10 tip : afbeelding over meerdere monitors

Een leuke feature van mobiele telefoons is dat het tegenwoordig zo eenvoudig is om makkelijk panoramafoto’s te maken. Tegelijkertijd hebben veel computergebruikers (in ieder geval programmeurs, waar ik dagelijks mee werk) vaak twee of zelfs drie monitoren.

De standaardinstelling van Windows is dat een gekozen achtergrondafbeelding voor het bureaublad wordt herhaald op elke monitor. In mijn geval ziet dat er dan op deze manier uit:

wallpaper-fit

Dat is niet slecht, maar het kan beter. Ik heb immers niet voor niks een panoramafoto gemaakt.

Dit is wat we willen:

wallpaper-span

Het is niet lastig om dit in te stellen, maar je moet even weten waar het zit:

  1. Klik met de rechtermuisknop een leeg deel van het bureaublad en kies Personaliseren (Personalize).
  2. In het venster Achtergrond (Background) kun je een afbeelding kiezen en de manier waarop deze over de monitors verdeeld wordt.
  3. Kies de optie Verdelen (Span) in het venster dat is verschenen. Met de overige opties kun je direct testen hoe je achtergrond er bij de andere instellingen uitziet. Je hoeft het venster hiervoor niet te sluiten, of op Opslaan te klikken.

background

Meer informatie

Wil je meer lezen over Windows 10 en alle instellingsmogelijkheden? Kies dan bijvoorbeeld een van onderstaande boeken.

Peter Kassenaar
-- 1 mei 2020

23april

Outlook tip: afspraak maken van e-mail

Ik gebruik Outlook als belangrijkste communicatietool. Regelmatig krijg ik een mailtje met daarin details en een datum voor een afspraak, zoals bijvoorbeeld onderstaande.

image

Maar dan moet je er nog zelf aan denken om de Agenda te openen, de juiste datum op te zoeken en hier handmatig een nieuwe afspraak te plannen.

Snelle stappen

Gelukkig kan dat in moderne versies van Outlook automatiseren, door een Snelle stap (Quick Step) aan te maken. Dan kun je in het vervolg met één muisklik (nou ja, misschien twee of drie, maar in ieder geval een stuk sneller) een e-mailbericht naar de agenda sturen. Bijkomend voordeel is dat je in de betreffende afspraak dan ook direct de tekst en eventuele links uit het mailbericht bij de hand hebt.

Het maken van een Snelle stap gaat als volgt:

  1. Open het e-mailbericht waarvan je een afspraak wilt maken.
  2. Klik op Nieuwe maken (Create New) het kader Snelle stappen.
  3. Typ een naam voor de actie. Ik koos E-mail naar afspraak.
  4. Kies een actie uit de lijst. Scroll naar beneden om Een afspraak met de tekst van het bericht maken te kiezen. Zoals je ziet kun je nog tal van andere handelingen automatiseren.

image

  1. Klik op de knop Actie Toevoegen (Add Action).
  2. Eventueel kun je nog aanvullende acties toevoegen op dezelfde manier, een sneltoets kiezen, of een eigen tooltip schrijven. Maar voor mijn doeleinden is deze stap voldoende.
  3. Klik op Voltooien (Finish).

De snelle stap is nu verschenen in het kader Snelle stappen. Je kunt hem direct gebruiken.

Snelle stap activeren

  1. Open een mailtje waarvoor je een afspraak wilt maken (of, realistischer, je leest een mail en ziet dat hiervoor een afspraak in de agenda gepland moet worden).
  2. Klik in het kader Snelle stappen op de stap E-mail naar afspraak.
  3. Er wordt direct een nieuw Afsprakenvenster geopend, waarin je de titel van de afspraak, de tijd en de locatie op de gebruikelijke manier kunt aanpassen.
  4. Stel de afspraak in en kies Opslaan en sluiten (Save & Close).

image

De afspraak staat direct in je agenda. Hier kun je hem verder aanpassen zoals gebruikelijk. Er is geen koppeling aanwezig tussen het oorspronkelijke mailtje en de afspraak. De mail kun je dus verplaatsen, verwijderen, enzovoort. Dit heeft geen invloed op de afspraak.

Stappen beheren

Je kunt probleemloos wat experimenteren met deze tool. Via de optie en het venster Snelle stappen beheren (Manage Quick Steps) kun je stappen bewerken, dupliceren of weer verwijderen.

Eventueel kun je ook vanuit dit venster een nieuwe Snelle stap maken – maar ik vind het makkelijker om dit rechtstreeks vanuit Outlook te doen, omdat je dan ziet waar je mee bezig bent.

snelle-stap-1

Handigheidje in Outlook. Doe er je voordeel mee!

Handboek Outlook 2019

P.S. Wil je meer weten over Outlook, lees dan ook mijn Handboek Outlook 2019. Hierin staan meer tips over het gebruik van E-mail, Afspraken en Contactpersonen.

Peter Kassenaar
-- 23 april 2020

22januari

Windows 10 en Microsoft HoloLens – de toekomst

Op de langverwachte persbijeenkomst die Microsoft op 21 januari 2015 organiseerde was het grote nieuws niet Windows 10 zelf met al zijn nieuwe snufjes en verbeteringen, maar het konijn dat Microsoft aan het einde uit de grote hoed toverde: Microsoft HoloLens. De kaken van de aanwezigen in de zaal vielen collectief omlaag.
- “Holograms?” 
- “Yes. Holograms”.

HoloLens projecteert hologrammen in de wereld waarin je je op dat moment bevindt

Als je mijn Twitter feed die avond toevallig hebt gevolgd, dan heb je gezien dat ik er behoorlijk enthousiast over ben. Voor als je het nog niet hebt gezien: HoloLens projecteert real time hologrammen in de wereld waarin je op dat moment aanwezig bent. Je kunt met diverse apps interacteren met die projecties en zo games spelen, met anderen converseren, afstandsonderwijs volgen en meer. Bekijk hier de introductievideo. Nog korter:

“Hololens is voor mij de meest opwindende introductie sinds de aankondiging van de iPhone in 2007.”

Ja, lach maar. Ik wacht wel even. Misschien moet ik zelf over vijf jaar ook smakelijk lachen om deze uitspraak, maar op dit moment durf ik de stelling wel aan dat Microsoft hiermee een winnaar in handen heeft. Dit is de toekomst van gaming, design, voorraadbeheer, medische handelingen, praktijkonderwijs, apparaatonderhoud en wie weet wat nog meer als de API’s voor het hologramprogrammeren eenmaal in handen van de community komen.

Ik ga hier niet alle kenmerken herhalen die ook al in de artikelen op de diverse nieuwssites worden genoemd. Lees zelf bijvoorbeeld:

  • Tweakers – inleidend artikel met commentaren
  • The Verge – Hands on ervaringen met HoloLens
  • Engadget – Artikel met speculaties over de technische specificaties.

Waarom HoloLens een succes kan worden

Belangrijke redenen die volgens mij doorslaggevend kunnen zijn waarom Hololens wel een succes wordt, terwijl bijvoorbeeld Google Glass dat niet zijn geworden en Oculus Rift nog lang niet de verspreidingsgraad heeft die de makers voor ogen hadden:

  • Hololens heeft geen front-side camera, zoals bijvoorbeeld Google Glass wel had. Met alle privacy-issues van dien. Met Hololens kun je je weliswaar samen in een virtuele wereld begeven, maar er is geen gevaar dat nietsvermoedende omstanders ongemerkt worden gefilmd en buiten hun medeweten op Facebook belanden, of erger. Goede keuze van Microsoft. [zie ook update, hieronder].
  • Hololens kent een view-throughmechanisme. Dat betekent dat je niet afgesloten wordt van de buitenwereld, maar dat hologrammen aan jouw bestaande wereld worden toegevoegd. Je kunt door de donkere lens gewoon anderen blijven zien, met anderen spreken en interacteren. Je bent niet asociaal in je eigen VR-wereld opgesloten, maar communicatie blijft mogelijk. Essentieel.
  • Door dat view-throughmechanisme hoeft Hololens niet de wereld opnieuw te berekenen en te creëren.  Het hoeft ‘alleen maar’ hologrammen op de al bestaande wereld te projecteren. Dat is nog voldoende uitdaging voor de rekenkracht van de processor (in HoloLens HPU, Hologram Processing Unit genoemd), maar maakt het een stuk eenvoudiger dan bij Oculus Rift, die de complete wereld moet berekenen, inclusief jouw interactie ermee. Dit voorkomt dat je projecten op grofkorrelige tafeltjes in een pixelige omgeving moet manipuleren. Alle rekenkracht kan worden aangewend voor de hologrammen. Heel slim.
  • Je hoeft HoloLens niet continu te dragen. Waar bij Google Glass werd verwacht dat je het geeky object de hele dag op je neus droeg, zal dat bij HoloLens niet het geval zijn. Net zoals je nu op de bank gaat zitten met je tablet of in je stoel neerploft om tv te kijken, zo zul je straks op de bank gaan zitten en zet je dan HoloLens op om informatie op te zoeken of er mee te interacteren. Of ga je voor je Xbox staan - als dat nog nodig is - om een HoloGame te starten (dat laatste woord heb ik zelf verzonnen ;-). Oftewel: HoloLens is een specifiek apparaat, waar Google Glass een generiek doel had. En mede daarom is mislukt.

MineCraft live in je eigen huiskamer. Opslaan en de volgende dag doorspelen!

Nogmaals, de geschiedenis zal uitwijzen of HoloLens het succes wordt waar Microsoft op hoopt, maar ik geef ze een goede, heel goede kans.

Update – 23 januari 2015. Ik werd er via Twitter door @GerjanOnline op gewezen dat de HoloLens wel degelijk frontside camera’s heeft. Dit is uiteraard juist. Zonder frontside camera’s zou het apparaat immers totaal geen beeld van de omgeving kunnen opnemen om de hologrammen te kunnen projecteren. Het artikel op Engadget spreekt van “at least four cameras or sensors on the front”. Ik blijf er wel bij dat het doel van HoloLens in dit opzicht anders is dan bij Google Glass. De camera’s worden niet gebruikt voor opnamen of filmbeelden, maar alleen om te berekenen waar de lens zich bevind en hoe de hologramwereld moet worden opgebouwd. Het zijn rekendevices. Geen registratiedevices. Ik verwacht ook dat Microsoft niet zal toestaan dat apps de camera’s hiervoor gaan gebruiken. Maar de toekomst zal dit moeten uitwijzen.

Houd de website http://www.microsoft.com/microsoft-hololens/en-us in de gaten voor het laatste nieuws, en volg https://twitter.com/hololens voor Twitter-updates. Het is de toekomst.

 

Peter Kassenaar
-- 22 januari 2015

21augustus

Autocorrectie uitschakelen op Android tablet

nexus7

Ik heb nu ongeveer een half jaar een Google Nexus 7; mijn eerste Android device ooit. In het algemeen ben ik er erg tevreden over. Snel, veel en goede applicaties en hij ligt door zijn 7”-formaat een stuk lekkerder in de hand dan mijn iPad en mijn Surface RT.

Eén ding bevalt me echter maar matig: in tegenstelling tot de Apple- en Microsoft-tablets is de standaardinstelling voor het automatisch corrigeren van teksten erg strak ingesteld naar mijn idee. En omdat ik regelmatig zowel Engelse als Nederlandse mailtjes, artikelen en tweets schrijf, moet ik de Engelse varianten altijd supergoed controleren om te zien of Android de inhoud niet heeft verhaspeld.

Autocorrectie uitschakelen

Het uitschakelen van Autocorrectie-optie is niet makkelijk te vinden in de menu’s. Op deze manier doe je het. Ik vermoed dat het voor andere Android-varianten op ongeveer dezelfde manier gaat:

1. Open de app Instellingen. Dit vind je via het algemene appmenu, of door het notificatiecentrum van bovenaf naar beneden in beeld te schuiven. Kies hierin de optie Taal en invoer.

Android: Instellingen, Taal en Invoer

2. Klik achter de geselecteerde toetsenbordoptie – vaak zal dat Google-toetsenbord, Nederlands zijn – precies op het instellingenpictogram. Als je gewoon op de naam tikt, gebeurt er niets.

Android: Instellingen, Toetsenbord

3. Kies de optie Autocorrectie (nu staat er geen instellingenpictogram achter de naam).

Android: Instellingen, Autocorrectie

4. Kies in het pop-upmenu de optie Uitgeschakeld.

Android: Instellingen, Autocorrectie, Geen

Gebruik de knop Terug om terug te keren naar de vorige menu’s, of keer met de startknop direct terug naar de uitgangspositie. Autocorrectie zit je nu niet meer in de weg als je in verschillende talen schrijft.

Succes er mee,

Peter Kassenaar
-- 21 augustus 2013