https://unsplash.com/photos/VieM9BdZKFo

Daria’s Flutter diaries #1

whoami

Hey! You’re probably reading this because you followed the link via my Twitter, so you probably know at least something about me :D But if not, here’s a quick intro. My name is Daria, I’m a software developer at a mobile studio @ChiliLabs, and my main specialty is *surprise* mobile development. I have a background in native Android, but for the last 2 years, I’ve been working as a full-time Flutter developer on various client products. I also have a couple of personal pet projects, but more on them later.

What is this about?

I love Flutter, I love reading about Flutter, I love talking about Flutter. And one of my goals for 2022 is to share more in this domain. I have one problem though, whenever I start writing a tutorial, I tend to describe every little detail, or get frustrated because I don’t know how to do it and end up with a million half-done posts in my backlog 😂 So I decided to make a habit of writing, and once I have that under my belt, it will be easier to tackle those unfinished tutorials. I’ll try to post weekly recaps of the challenges, interesting tasks, pains, and just thoughts that I encountered during the workweek at my job and in the community. We’ll see how it goes, this is new for me too 😅 Ok, too many words, let’s go!

#1 Technical

1. Android 12 & SplashScreen API

Pre-story: on the app I’m currently working on, we have a splash screen with a gradient background and an image in the center. Our QA was hunting down a bug that was supposedly reproducible on an Android 12 and that’s how she found another bug-o-feature. On Android 12 devices our gradient splash screen turned into a solid color background and the app icon in the center. So a bug (that later turned out to be a feature 😄) was registered and transferred to me.

And that’s how the migration of our app to Android 12 started. There wasn’t anything breaking for us and everything went smoothly, but that SplashScreen API took some figuring out & documenting.

Full docs & the migration guide can be found here: https://developer.android.com/guide/topics/ui/splash-screen

So now, starting with Android 12, the system splash screen has more strict rules on the structure.

And if you don’t migrate your app to this new API, by default your launcher icon background (if it’s a solid single color) is taken with your launcher icon foreground in the center. But if your icon background is not a solid color, then something like this happens:

Basically, the Android docs explain the migration steps, but there is one more thing to keep in mind for Flutter developers. If you still have this in your AndroidManifest file, you will see a duplicate splash screen: the one provided by Android 12 & the launch_background . So if you haven't yet, then when migrating to Flutter 2.5+, you need to remove those deprecated API's

<meta-data     android:name="io.flutter.embedding.android.SplashScreenDrawable"     android:resource="@drawable/launch_background"/>

Adding a splash screen to your mobile app

P.S. — We use flutter_native_splash to generate SplashScreens, but for Android 12 we needed to perform some manual edits.

2. Flutter 2.8 migration

Now, if you haven’t heard about Flutter’s new release, then where have you been? 😂

Here’s a nice recap of what has been changed: https://medium.com/flutter/whats-new-in-flutter-2-8-d085b763d181

Just on Monday, I had to tell the client that for the bug they’ve reported, we will, unfortunately, need to wait for a new Flutter stable release. The bug was (again) on Android 12: on screens with TextFields (e.g. a login screen, as in our case), if something was previously copied to clipboard on the phone, then when returning to the app a toast with “apptitle pasted from your clipboard” showed up, which was frustrating. I found this thread and according to it, the fix was already in the master channel, which I checked and it worked. So we were waiting for it!

I haven’t yet finished the migration, because it has been moved by other priorities. But as I’ve predicted the day before, our CI builds facing the stable branch are gonna fail, and so they did, because of the lint warnings (in our case mostly related to now unnecessary imports). I managed to fix all lint warnings, but then the build didn't compile because of some dependencies depending on deprecated API's *sigh*, so that's a task for my next week 😁

And to finish up the migration theme, the pain of the week award goes to… projects still on 1.22.6 🥲 Due to business requirements, we cannot yet migrate one (actually, a couple) of our projects to Flutter 2+, but we still need to support them and even add a couple of new features. I don't work on that project right now, but I consult / review pr's / help with problems of the more junior devs working on it.

And just yesterday one of them came up to me with “I’ve done this task with those dependencies, but now it doesn’t compile on Android due to an unrelated issue”. And we spent like 3 hours fixing it (trying to understand, how it was related, still didn’t really though 😂), ended up forking one of the repo’s, upgrading its Gradle versions, as well as the projects itself, and a couple of more Gradle issues, and it finally worked. But it could’ve been fixed by just bumping up some of the dependencies if the project wasn’t on 1.22.6.

So I always advocate for ASAP stable migrations when possible, because with time it becomes harder to support, harder to add new features, and also harder to eventually migrate.

3. Locale-specific currencies formatting

Now, if you think I’ve been only doing 101 migrations this week, I understand why 😂 But of course I had other tasks to do, and the most interesting of them was locale-specific currencies formatting. I’m not an expert in internalization, so it was a bit challenging for me. Not only do we support 24 languages, but some of the formats specified by the translators were different from the ones provided by the intl package. And I didn't find a straightforward way to specify group/decimal separators.

class CurrencyFormat {
  final String groupSeparator;
  final String decimalSeparator;
  final String pattern;
}

So I came up with such a solution:

1. Format the value in a specific, default locale, for which we know the decimal & group separator via NumberFormat.currency, specifying the required locale pattern.
2. Then replace the default locale group/decimal separators with the ones from the required locale.
3. Info is taken from a custom map consisting of CurrencyFormat.

I’ve also taken into account the next task — the user will be allowed to select preferred separators from his profile settings, so it will be a locale + custom combination.

But most of the time was dedicated to the unit tests for 24 locales 😂

#2 Community

December is really hot in the matter of Flutter events, packed with local meet-ups and big conferences!

1. DartUP conference

DartUp is a big (and free!) conference with 2 tracks — Russian and English https://dartup.ru/EN/2/

I think it’s one of the most intense conferences in the matter of topics presented there, so I really recommend watching the talks given there. I’ve watched a couple of talks live and have a list of which I will watch later. Luckily, I speak both Russian and English and can watch everything 😂

2. Flutter Global Summit Vol. 2

This is another big conference, also with 2 tracks — Junior & Senior https://geekle.us/flutter

You can re-watch the junior track online for free & buy the recordings of the senior track.

It is also full of very interesting topics, covering many things related to Flutter, starting with solutions to some specific problems and ending with more architectural approaches.

I’ve also watched some of the talks live and will be re-watching the ones I missed during December 🤩

3. Flutter Vikings

This is an upcoming offline (!) conference, which I’m really excited for https://fluttervikings.com/

The day has come, and all of the speakers, who sent their applications to this amazing conference, have gotten their acceptance or rejection letters. I’m in the latter group, but that was expected, considering the huge competition and my baby speaker skills 😁 But I feel totally fine about that and I’m looking forward to participating in an offline event (fingers crossed, you know the situation in the world) 🙈

4. GetX thread on Twitter

If you’re a Flutter dev and have Twitter, then the chance that you’ve seen this thread by Scott Stoll is very high. Now, I’m not a fan of heated debates and holy wars, so hopefully, this won’t backfire on me 😂

My opinion on GetX: I’ve never used it. I’ve stumbled upon it several times when searching for solutions to my problems, but every time I opened the page and read all of the things that the library does… I felt overwhelmed. It feels more like a micro-framework than just a library, and integrating it into a project is a big commitment. Since I work on client production apps, not just pet projects, which I can refactor 10 times or start from scratch, I did not want to find myself in a position, when something is incompatible and I have to explain to the client, why we need a month to refactor the whole app to a different framework. Or why we can’t do something, because the micro-framework that we use doesn’t allow it.

And that was also the point of the tweet (as I see it) — not to bash the library or the creator (I personally didn’t see any bashing, I think that the original thread is quite neutral), but to emphasize, that if you’re looking for a job as a flutter developer, you should learn the flutter framework and not rely only on the abstractions. Sure, if your sole goal is to release some app / MVP / POC asap — use any shortcuts you want, but understand the limitations. If your goal is to become a developer, then, well, I think you already got it.

I also remembered a related situation from my own hiring experience:

https://twitter.com/dariadroid/status/1468847655761727491?t=IVjgKUsEFHifBa03Abq10Q&s=19

#3 Personal

Ok, wow, if you’re still here, you’re a hero. I did not expect this post to be so long, I guess I need to learn to be more concise, haha. But since the goal of this post/series is to make a habit of writing, then I’ll stick with the “better done than perfect”.

One last thing that I wanted to mention in this recap, related to my work is that I was experimenting with my schedule this week — start working from 7.30 in the morning. I used to start at 9.30 because of my daily stand-up at that time but started recently experiencing a lack of productivity, concentration, and motivation. I felt like I didn’t have enough time for my life and energy for my pet projects. And it started snowballing.

Tbh, I didn’t think that 2 hours can impact SO MUCH. I realized that those 2 hours in the morning are my most productive ones, I get so much stuff done (due to fewer distractions) and by the time I finish my work-day, it’s still early and I still have time (and energy!) to do my own stuff. I’ve worked on my new pet project for 1–2h for 4 out of 5 days during this work week and got a lot of things done. And by today I feel happier, energized, and motivated. I mean, I even wrote this whole post 😂

Currently, I can’t tell more than “my new pet project” * so mysterious *, but I promise once I can, I will 😁

Meanwhile, you can check out my other pet project, it’s a cruelty-free brand searching app called Bunny Search. I’ve also got big plans for it tech-wise, so stay tuned 🤩

Apple: https://apps.apple.com/us/app/bunny-search/id1592571643

Google: https://play.google.com/store/apps/details?id=lv.chi.bunny_search

And if you’re still here, then wow & thank you, and let’s connect in the comments or via Twitter @dariadroid ;)