BMI Calculator
Designed by: Johny Vino
Original link: BMI Calculator
A project of a BMI Calculator app designed by Johny Vino. For this project we collaborated with Johny using Sketch which resulted in very specific guidelines. Close collaboration also resulted in slightly different approach than initially designed.
Implementation
Designs
👇 See all the posts👇
BMI Calculator in Flutter – Part 7 – Animated transition
Hello there! I’m back with a new post about implementing Johny Vino’s BMI Calculator design. This time we will focus on an animation between the input screen and the result screen. We will change the shape, position and size of a Widget using only one AnimationController. Let’s see how it goes.
BMI Calculator in Flutter – Part 6 – Custom Slider
Hi guys! Welcome to part 6 of BMI Calculator in Flutter where I go through implementation of Johny Vino’s design. Recently we have implemented animation which indicates user how to use Pacman slider. In this post, we are going to code actual sliding behavior using GestureDetector. Let’s get to it!
BMI Calculator in Flutter – Part 5 – Animated Slider Hint
Hi again! It’s about time to add some more code to the BMI Calculator app designed by Johny Vino. In this post, I will start creating bottom pacman slider. I will go through implementing the animated hint which will indicate user on how to use the slider. Let’s make it happen! 🙂
BMI Calculator in Flutter – Part 4 – Static Layouts
After a long delay, I am coming back to you with a new BMI Calculator post. In this one, I will go through some layout changes I needed to make to update old Johny Vino’s design to the new version. Although most of the things here are quite straightforward, I want to invite you to this part as well, so that almost all of the development will be available for you too.
BMI Calculator in Flutter – Part 3 – Height
Hi again! It’s time for another part of BMI Calculator in Flutter, a series in which I implement Johny Vino’s awesome BMI Calculator design (if you didn’t see previous posts, you can find them here). This time I will go through the implementation of height picker using GestureDetector. Let’s see how it goes 🙂
BMI Calculator in Flutter – Part 2 – Weight
Hi again! I’m coming back with another part of the implementation of Jhony Vino’s awesome BMI Calculator design. In this post, I will focus on creating a widget for weight input. Let’s see how it goes!
BMI Calculator in Flutter – part 1 – Gender
This is another UI challenge post from me. This time I teamed up with Johny Vino to fully implement one of his awesome designs: BMI Calculator in Flutter.
Join the newsletter!
Join the newsletter to keep track with latest posts and get my special Widget to animate views' entrances without any hassle for FREE!