Hi there. It has been quite a while since my last post.
In the meantime, a bunch of things happened. Corona is over 🥳😉, Apple released a monitor for the masses (webcam cough) and some crazy guy from the east decided to question the European borders 🥴.
But that shall not be the topic of this blog post. Today’s topic is: Is Flutter a good candidate for embedded UIs?
The answer: Yes!
See you next time …
but wait. Let’s explain a bit.
Read more...Today I want to share my opinion about 2(3) new pieces of hardware that I got for myself as an early expensive Christmas present.
Initially I hesitated to jump on the M1 Pro/Max train. My 13” Intel MacBook Pro worked, I don’t have any projects that have compile-times where I have to wait minutes for them to complete so no real need to upgrade.
I started configuring a MacBook 14” the day the preorders started. I use the 2nd tier M1 Pro, 512 GB Storage and 32 GB RAM and ended up with ~€2700.
My first reaction: Phew, that is really expensive. I have no real need, let’s wait.
Then the internet filled with reviews, articles and other videos that all had one thing in common: What a beast of a machine.
Additionally, the order date for the MacBook 14” started moving towards December (I think currently they are somewhere in January) so I felt a bit under stress 😨
The M1 topic stuck with me as I already plan how Flutter could potentially be used at work and in that scenario having an ARM based docker environment that is performant would be a real advantage.
So I did some research to find out if the M1 already has similar performance (or even better performance) than the Intel I have and as it turned out even those are faster. So I almost ordered an M1 MacBook Air.
In the end I convinced myself that it would be much better to have the even more performant hardware platform and the crazy fast SSD storage. I found a store that was able to immediately ship the 14” MacBook Pro, so I ordered it. I ordered the super basic entry model (8 cores, 16 GB RAM, 512 GB SSD) because I still think the upgrade price is just crazy. This machine did cost ~€2200 which is still very expensive (at least in my terms) and as the current machine was sufficient upgrading it would even be more crazy than ordering it has been in the first place 😉
I switched from Android to iOS roughly a year ago. The main reasons for this were:
The lowest end iPhones went into a range that “normal” people also can afford. Of course, they are a bit more expensive than the cheapest Android phones you can find but taken Apples update strategy into account (and combining this with the fact that the phone cycle slows down) this has become a real alternative for anyone.
This fact removes the “if you can afford it you can have privacy” label (at least a bit) from Apple that I really disliked.
You can argue if Apple does this because they really think it is the best for their users or - like some people think - because they had no other choice (no way to beat Google, Microsoft or Amazon in the Cloud and data game) but they put privacy on top of almost every marketing material.
So the assumption is that they will try their very best to make sure to deliver on that end because they would really, really harm themselves by violating that rule.
This is a quick follow-up to the last two posts.
As I got asked quite often to show off the project the kids implemented I thought it might be quite interesting for the readers here as well.
So I just built the Flutter app for web. I translated the German strings to English for your reading pleasure 🥸
The only problem I had was that on this statically generated blog the project is not the root of the domain, so I had to remove the href=”/“ tag in the index.html for the app to run from a subfolder.
Without further ado, here you can find the tic-tac-toe app:
tic-tac-toe
Depending on your device and browser the experience might have some problems - but you will get the idea
As promised I now want to share how well the teaching experiment went.
I used our kitchen table and moved it closer to the TV to mirror the MacBook’s screen to it.
I used AirPlay for that which turned out to be quite laggy (moving the mouse was very hard) so the next time I would rather run an HDMI cable to the TV
We gathered 6 kids (2 of my kids and 4 friends) and started off discussing what the TicTacToe game has to look and behave like.
I used the version I already created beforehand to show what our goal will be.
After doing that we started Android Studio and created a new project. I explained briefly what the main parts of a Flutter app are and where we will spend our effort at (Position wise). Of course, I didn’t explain all the details of what’s written there. No information about State(less)Widgets, classes or anything on that end.
We started by simply placing 9 texts and layouted them using Columns and Rows. Before we started to fine tune the cells I mentioned that we might want to extract the Text part to a method so that we don’t have to make every modification 9 times.
The concept of a Function was already clear to my children (they used Swift Playgrounds a bit) so they were eager to explain the concept to the other kids.
So we created a method that creates the cell content, moved the Text there and made the content a parameter.
Afterwards we replaced all Texts with a call to that method.
The cells up to that point simply contain the “cell ID” (1-9) to see how the text will look like.
I have 3 kids at the age of 12, 10 and 2.
Without trying to be one of the parents that really insists on the kids having to do what the parents enjoy doing I still want to provide enough opportunities for them to get hooked by software development.
The tries I had to this point didn’t really work out:
I used board games that encourage “programmer thinking” (Robot Turtles). While it was quite funny to play it never stuck, so now it is waiting in the drawer for the 2y old to pick it up one day.
I thought “maybe this is too theoretical and there is no connection to the real world” so I bought some hardware that is meant to be controlled by high level visual programming languages (Makeblock).
This also was fun only for a short period of time and then the kids lost interest.
As the older kids are quite tied to their smartphones and given the battle that we as parents have almost every day regarding the smartphone usage (the kids have a very strict screen time with their smartphones) I thought “maybe it would be a good idea if they would be able to create a useful app for their smartphone”.
Read more...For the Flutter based Terminal application I wanted to deactivate the MacOS behaviour that shows an accent selection popup when a key gets pressed long (instead of repeating the pressed character).
This is actually a feature in MacOS and can be disabled by tweaking some MacOS settings via terminal commands.
I wanted to do that programatically as this behaviour doesn’t make much sense for Terminal applications.
Finding information about this topic is really challanging even if the solution isn’t that complicated so I decided to leave that piece of information here so that someone else might stumble upon it.
The key to the desired behaviour is to override the ApplePressAndHoldEnabled setting for our application. This can be done by tweaking the integration layer of the Flutter app (the MacOs project).
Just extend the AppDelegate located in AppDelegate.swift by adding the following method:
override func applicationDidFinishLaunching(_ notification: Notification) {
UserDefaults.standard.set(false, forKey: "ApplePressAndHoldEnabled");
}That’s all. Now your application doesn’t trigger the accent popup any more.
Read more...Note! Time has moved on and in the meantime Dart has capabilities that make this post obsolete. You can read about the new features here
Dart is a relatively simple programming language.
In general this is a good thing as the number of possibilities and patterns you have to know in order to develop something with it or when reading code is lower.
On the other hand you will miss certain features that other programming languages have that can lead to quite elegant solutions for certain problems.
Enums int Dart are such a case.
Enums are very simple in Dart. In general, they are classes / objects like everything else, but you can’t do neat tricks with them like for example with C#.
Let’s assume we have a byte value and want to read some bits of it. Those bits should have names (mapped to an enum) for better understandability.
In C# there is a language feature for exactly that. You can use any enum to represent bits in a bit field.
[Flags]
public enum FlagValues : byte
{
None = 0x00,
Flag1 = 0x01 << 0,
Flag2 = 0x01 << 1,
Flag3 = 0x01 << 2,
Flag4 = 0x01 << 3,
Option4 = 0x01 << 4,
All = 0xFF
};
// later in the code
byte val = 0x05; //00000101
var flags = (FlagValues) val;
flags.HasFlag(FlagValues.Flag1); // true
flags.HasFlag(FlagValues.Flag2); // false
flags.HasFlag(FlagValues.Flag3); // true
flags.HasFlag(FlagValues.Flag4); // false
You can even do bitwise operations directly with the enum like
Read more...I’m currently experimenting with Dart and Flutter to take another shot at the terminal emulation application. This time not using C# but something completely new.
For this I decided to take a look at Flutter and Dart and try to implement the terminal application using that technology.
Gladly there is already a person in the internet that is working on implementing the xterm protocol for Dart and also has a working Flutter UI that renders the terminal.
https://github.com/TerminalStudio/xterm.dart
This implementation is not yet finished and has a couple of problems but is a really good starting point to dig into a Dart and Flutter based development of a terminal application.
One “problem” of the solution is that the whole terminal logic happens in the UI thread. So I wanted to move that logic into a separate thread and only copy the UI state to the UI thread for the UI to show it.
I did this for the C# based approaches and it speeded up the performance (especially reflow) a lot.
I know, I know. I planned to do this much more frequently as it then happened. I will do my best to keep you updated with anything of interest here.
There has not been so much going on in terms of development or side projects mostly because the Terminal application project got stale and there no all-focus new side project yet.
I started reviewing my small Smart Home setup I have here and see where I can improve things. When this gets more concrete it might also be worth on or two blog posts.
The Terminal application got a bit stale due to several reasons.
Starting point of all that was me starting to think about the UI for the additional features. Things like managing different profiles as a starting point.
I played around with a couple of ideas and did some prototypes and I didn’t like anyone of them. Not so much because of the UX they used but the design.
I basically faced the standard problem of cross platform UI development. Qt can have styles - yes - but you will never reach a state where the application feels “natural” on any platform. I think this is especially visible on MacOS as a MacOS user is not very used to seeing all different kind of visual approaches between different applications.
This topic blocked me from continuing because I can not see how I will end up with a Qt/Qml based solution that looks like a nice MacOS application. Even small things like using some blur effect that modern MacOs apps have would be a pain if at all possible.