A Dart package that given an array of sized objects can return a card layout between three variations horizontal, vertical and fan (rotated horizontal).

Example includes solution to be used via Flutter and via CustomPainter. The package is only responsible for delivering a List of coordinates and angle for each card, the presentation is up to the developer using the package.

Getting started

The result of the layouts can be used with either Flutter widgets or via customPainter. The /example includes both ways.

Usage

The package can layout cards in a fan, horizontal and vertical way.

List<Map<String, dynamic>> _cards = fanCards(flowCards, {
    "flow": "horizontal", // The layout direction (horizontal or vertical)
    "fanDirection": "N",
    "imagesUrl": "cards/",
    "spacing": 0.6,
    "radius": 200.0,
    "width": 80.0,
});

List<Map<String, dynamic>> _handCards = handCards(blockCards, {
    "flow": "horizontal",
    "spacing": -0.2,
    "width": 80.0,
});

List<Map<String, dynamic>> _columnCards = handCards(columnCards, {
    "flow": "vertical",
    "spacing": -0.2,
    "width": 80.0,
    "height": 120.0,
});

Additional information

This package is a direct port of https://github.com/richardschneider/cardsJS