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.

Starship — SpaceX’s upcoming interplanetary vehicle

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.

Examples of the clean design featured in the whole app

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.

Scoped Model

One of the main features this update brings is an overhaul of the state management, using the scoped_model package. Here is a link where you can find a nice tutorial about how this package works.

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.

Launchpad model using ScopedModel

SliverAppBar

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.

Slivers & Swipers example

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.

Example of a flutter_i18n implementation

Other features

In this last section, I’m going to mention some other smaller features that may be interesting to check out.

BottomNavigationBar & search FAB

• 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.

An example of the cached_network_image package

• 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.

Example of search implementation

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.

The app is available right now on the Play Store, and I’m planning an App Store release of the app coming soon! Also, all the source code can be found on GitHub.

If you have ideas about the app to share, or found some nasty bugs, please contact me via email or Reddit: all feedback will be welcome :)

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.

Flutter Community (@FlutterComm) | Twitter