The term Continuous Integration has been very popular in the last years, the way we work has been evolving and distributed teams need an effective way of collaborating while ensuring the quality and fast paced delivery required by software development nowadays. This evolution has triggered the development of tools and practices for continuous integration and delivery.
By adopting CI/CD practices and tools we are able to integrate work more frequently, solve problems quickly, gain better quality on our products, help collaboration on our teams runs smoothly, make sure our team’s code is always building and stop the most bugs from getting to the users.
Fortunately, these practices are not something only the big companies and teams has access to, there are great available free tools to integrate CI and CD processes into our projects.
Here’s how to implement Travis CI and Codecov with your existing Flutter project.
1. Get your repo ready
You’ll need a GitHub repo with your Flutter project loaded up and ready.
2. Setup Travis account
Go to travis-ci.com and sign up if you don’t have an account already. After you accept GitHub authorization you’ll be able to activate Travis and select the repo you’d like to integrate
3. Create .travis.yml file
This file tell Travis CI what to do, here’s a template that should work with Flutter projects, you can start here and modify due to your project needs.
Add the file to git, commit your changes and push them to the repo, a new build should be triggered automatically.
4. Add Travis Badge
Now you should be able to check the build status of your project in Travis so why not make this info available through your repo by using travis badge.
To do this you should visit your repo on Travis and add the markup to your README file.
Now it’s codecov turn.
1. Run your tests
Make sure your tests are running and coverage reports are generating correclty. You can do this by running in your flutter project
flutter test --coverage
2. Setup Codecov account
Same as travis account, go to codecov.io and sign up if you don’t have an account already. You should accept GitHub authorization and activate Codecov.
3. Set upload step to run on travis
Edit you .travis.yml file to trigger coverage files to codecov automatically
Trigger a new build on Travis and you should start looking at your coverage data automatically
4. Add Codecov Badge
Visit your project’s page on codecov and go to Settings > Badge to get the markdown and add it to your README file.
Actions define support for user requests and the corresponding fulfillment within Google Assistant. Read more.
I came across a couple of videos from Google Developers which show you how to create your first Action from scratch. Neto and Jessica explain the foundations of the platform and describe how to build, test and publish your action, they also make you laugh.
Guided by this videos I made a complementary action for my app Daily Prayer, a simple app that just does what its name implies, and I thought of an action that bring this functionality through Google Assistant.
My Action relies on a Firebase Function for fulfillment which returns the prayer to be read by the assistant, you can find this function code in my GitHub.
Bonus! After submitting my action for review and after a couple of days of waiting my action was approved and apparently Google is giving away free Google assistant t-shirts and Google Cloud credit.
Who doesn’t love free stuff?
Update: The free stuff arrived!
Android 8.0 (API level 26) introduces Adaptive Icons, these icons have the capacity of displaying variations depending on the OEM specification.
To do this, Adaptive icons consist of two layers, the background, and the foreground, these layers are manipulated in different ways to show your app’s icon.
Adaptive icons must follow the following guidelines:
- Both layers must be sized at 108 x 108 dp.
- The inner 72 x 72 dp of the icon appears within the masked viewport.
- The system reserves the outer 18 dp on each of the 4 sides to create interesting visual effects, such as parallax or pulsing.
Fortunately, Android Studio provides a very simple way to add an adaptive icon to your app, here’s how.
Prepare your assets
To create adaptive icons, first, you need to have your assets ready, as I’ve explained, adaptive icons consist of background and foreground so you have to figure out this 2 layers for your app, typically the background being a pattern or solid color and the foreground an image with transparent background. For this example, I’ll be using a material icon vector and a solid color #26A69A.
Create your adaptive icon using Asset Studio
Open your project with Android Studio and launch Asset Studio going to File > New > Image Asset.
Select Launcher Icons (Adaptive and Legacy) on the Icon Type, this way Android studio will auto-generate the icons for new specification and legacy compatibility. Leave the default name and select your foreground and background layers.
You’ll be able to preview all the different icon versions on the right panel and once you finish, Android Studio will generate the required files and make the needed adjustments on your app to get your icon working.
There you go, now your app has an adaptive icon which will look great in every device and Android version.
You have a great Android app and you need to add some icons to it, so you start reading about supporting multiple screen sizes, different densities, bitmap sizes, vector graphics…
Stop panicking, here’s the right way to Android App Icons: Vector Drawables.
This guide focuses on using vector drawables, Android 5.0 (API level 21) was the first version to officially support vector drawables with VectorDrawable and AnimatedVectorDrawable, but you can support older versions with the Android support library. Read more.
What is a vector drawable?
A vector drawable refers to a vector graphic defined in an XML file and which can be used by the Android system, this file contains a set of points, lines, curves and specification to generate all the shapes and colors that you see on your screen.
Why vector drawables?
Vector drawables are special because they can scale freely without losing any display quality, you can use a single file to show pixel perfect icons on any screen size and resolution reducing your app’s size and increasing maintainability.
Here are the steps to include your icons as vector drawables in your app:
Get your icons
First, you need to have the icons you want to use in your app in a vector format like SVG. Several icon pages and designers work with this type of icons so you should have no problem finding your icons.
You can download official Material Design Icons in SVG vector format.
Add them using Android Studio
Open your project with Android Studio and open Asset Studio by going to File > New > Vector Asset.
Here you’ll be able to browse your SVG files and set the name among other settings.
If you’d like to edit your icon before adding it like changing the color there are pretty cool vector editors out there totally free to use, personally, I like InkScape.
After you click next you’ll be asked to confirm the icon path and then you’re finished, you’ll have a new single XML file under your drawable folder which you’ll be able to use like any other drawable throughout your application and it will look pixel perfect across all devices and resolutions.