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