How I developed SpaceX GO! using Flutter
SpaceX GO! is an unofficial open-source SpaceX launch tracker, built for mobile platforms with Flutter. It allows to check both past & upcoming launches, the vehicle portfolio, and a roundup of the company itself, including its achievements.
It has been built from the ground up with simplicity and ease of use in mind. All of this, following the guidelines established by ‘Material Design’, which gives a clean, light and elegant design to the app.
An example of this philosophy can be located in the launch details page. Its most important details are presented in a clean way, avoiding showing random data like many other apps.
Today, I’m announcing the launch of the v2.0 update, which includes MANY new features & enhancements, which I’m going to list now. In the complementary article found here, I talk deeply about the new design & features included in this update.
I’ve implemented a generic model, called QuerryModel, which helps with parsing the retrieved data, and then notifying the listeners to update. Here is an example of this idea, applied to the launchpad’s endpoint of the r/SpaceX API.
A sliver is a portion of a scrollable area at the top of the screen. In the app, it represents the ‘viewing’ area. This area is generally used to display some cool SpaceX photos. It allows the user to reach easily to the top of the screen, helping with one-handed operation.
I’m also using the flutter_swiper package, which allows to fill the sliver portion with a carousel of photos. Here is cool article I’ve found talking about slivers that may interest you. This is an example of the rocket’s page, where both slivers & swipers are implemented.
Internationalizing the app
And the last main feature of the v2.0 update are Spanish translations. A whole new translation system have been implemented, using the flutter_i18n package. It allows a very easy implementation of multiple languages, avoiding weird stuff, which I think is unnecessary having this awesome package.
At this moment, only English and Spanish are supported, but I’m hope to add new language in the near future. Here is an example, showcasing the easiness offered by the package.
In this last section, I’m going to mention some other smaller features that may be interesting to check out.
- BottomNavigationBar. I’m using this widget in the Home view to allow better one-handed navigation through tabs. You can find more info about this widget in this article.
- Caching images. Using this package, I’m able to download images via URLs, and cache them automatically for future usage, without downloading them once again. Here is an sample implementation of this feature.
- Search functionality. Right from the very first moment I think about a SpaceX app, I knew that a robust search functionality would be necessary. There are a lot of search packages available, but I picked this one because, in my opinion, it was the easiest to implement. At this moment, only name filtering is supported, but in the future, I’d like to add more kind of filters. Here is the method I’ve implemented for launches search support.
I’m continuously thinking about new features & data pieces to add to the app: cores & capsules list, theme support, new translations… I hope to update the app every month or so, adding cool new features :)
This app is the result of countless hours of work & commits, so I’d appreciate if you take a look at the app & share your experience. This project wouldn’t be possible without the awesome communities of SpaceX and Flutter, which have contribute immensely to this project.
I’m using the awesome open-source r/SpaceX REST API, available on GitHub.
This app is not affiliated in any way with SpaceX, which is a private trademark.