I will explain you in details how we can (and cannot) use Curves in Flutter, through a little application I made. But before dive into Curves, let refresh our mind with the main components involved in animations.

Very short reminder

In Flutter, we create our custom animation using 3 kind of objects: Animatables, Animation and AnimationController. For each kind, here is a short description, focusing only on details related to curves behavior.

• Animatable : an animatable is an object that produce a value, given an input generally from 0.0 to 1.0. It will be done thanks to the method transform. …

Recently, I read an article talking about the Neumorphism, a “minimal way to design with a soft, extruded plastic look”. Some of UI Designers comment this design as good aesthetic, but doomed to disappear since there is not enough contrast to identify quickly components, especially for impaired people.

On contrary, the material design uses shadows a lot, in order to highlight even more components.

We will see how to do this in Flutter for any shapes:

• Text
• Rectangles and oval widgets
• Complex shapes

I also tried neumorphism design. …

Designing an application may be a real struggle when you have to made it to smartphones, tablets and web. Commonly, you may define general layout by retrieving the device screen size through the MediaQueryData instance.

@override
Widget build(BuildContext context) {
  final screenWidth = MediaQuery.of(context).size.width;
  if (screenWidth < 600.0) {
    return _buildPhoneLayout();
  }
  else if (screenWidth < 1000.0) {
    return _buildTabletLayout();
  }
  else {
    return _buildDesktopLayout();
  }
}

This example above a simple but pragmatic way to lay out your application page. The only thing I don’t like so much is that you have to define limits for device detection (devices…

On November 2020 was released two gaming consoles, starting a war between Xbox fans and Playstation one. On both side, they compared technical points about their favorite gaming console.

In Flutter SDK, there is no widget that mimics the iOS UITableView component (yet ?), with a floating section, as shown below.

A long time ago (a couple of weeks ago in fact), in a galaxy far far away (well, not from us, because we talked about our Milky Way)… a developer wanted to reproduce a design found on dribbble.com… In Flutter of course :D

Well, in that article I will show you that you have all needed stuff from the Flutter framework to design yourself a complex layout widget.

When I first saw the AnimationSwitcher widget, i thought in my mind that I will be able to flip a widget, revealing its rear side.

In a previous article, I spoke about developing your own custom layout, taking example on some design i found in dribbble.com website. It ended into the development of a new flutter package named flutter_wall_layout.

Previous article

https://david-gonzalez-1987.medium.com/flutter-custom-layout-512795afbba6

Library

Today, I will give you some example about how this layout can be used.