poupee 0.0.8

Layout package

example/lib/main.dart

import 'package:flutter/material.dart';
import 'package:poupee/poupee.dart';

void main() {
  runApp(const MyGridView());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Vertical(
          margin: const EdgeInsets.only(top: 5),
          parameters: const AutoFlexParameters(
            //mainAxisSize: MainAxisSize.min,
            space: 20,
            width: Length.between(100, 800),
            boxAlignment: Alignment.center,
            //fractionWidth: 0.8,
            //fractionHeight: 2 / 3,
          ),
          elementsParameters: ElementParameters(
            decoration:
                BoxDecoration(color: Colors.blueAccent, border: Border.all()),
            decorationByKey: (p0) {
              if (p0.toString().contains("Even")) {
                return const BoxDecoration(color: Colors.amber);
              }
              return null;
            },
            margin: const EdgeInsets.only(left: 10),
            marginByKey: (p0) {
              if (p0.toString().contains("Even")) {
                return const EdgeInsets.only(left: 0);
              }
              return null;
            },
            paddingByKey: (p0) {
              if (p0.toString().contains("Even")) {
                return const EdgeInsets.only(top: 20);
              }
              return null;
            },
            alignment: Alignment.topLeft,
            alignmentByKey: (p0) {
              if (p0.toString().contains("Even")) {
                return Alignment.topRight;
              }
              return null;
            },
            flexByKey: (p0) {
              if (p0.toString().contains("Even")) {
                return 2;
              }
              return null;
            },
            //width: const Length.fixedLength(800),
          ),
          children: [
            for (int i in List.generate(10, (i) => i))
              Container(
                key: (i % 2 == 1) ? Key("Even $i") : null,
              )
          ],
        ),
      ),
    );
  }
}

class MyCapsule extends StatelessWidget {
  const MyCapsule({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Capsule(
          modifier: [
            const CapsuleDecoration(
              decoration: BoxDecoration(
                color: Colors.amberAccent,
              ),
            ),
            const CapsulePadding(padding: EdgeInsets.all(40)),
            CapsuleDecoration(
                decoration: BoxDecoration(
              color: Colors.red,
              border: Border.all(color: Colors.red),
              borderRadius: BorderRadius.circular(20.0),
            )),
            const CapsulePadding(
                padding: EdgeInsets.only(left: 20, top: 10, bottom: 15)),
            const CapsuleAlign(align: Alignment.bottomLeft),
            const CapsuleSize(constraints: BoxConstraints.expand(width: 300)),
            CapsuleTransform(transform: Matrix4.rotationZ(0.1)),
            CapsuleDecoration(
              decoration: BoxDecoration(
                color: Colors.blueAccent,
                border: Border.all(color: Colors.blueAccent),
                borderRadius: BorderRadius.circular(20.0),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

class MyListView extends StatelessWidget {
  const MyListView({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Frame(
          capsuleModifier: [
            const CapsuleDecoration(
              decoration: BoxDecoration(
                color: Colors.amberAccent,
              ),
            ),
            const CapsulePadding(padding: EdgeInsets.all(40)),
            const CapsulePadding(
                padding: EdgeInsets.only(left: 20, top: 10, bottom: 15)),
            const CapsuleAlign(align: Alignment.bottomLeft),
            const CapsuleSize(constraints: BoxConstraints.expand(width: 300)),
            CapsuleDecoration(
              decoration: BoxDecoration(
                color: Colors.blueAccent,
                border: Border.all(color: Colors.blueAccent),
                borderRadius: BorderRadius.circular(20.0),
              ),
            ),
            const CapsulePadding(
                padding: EdgeInsets.only(left: 20, top: 10, bottom: 10)),
          ],
          frameModifier: const FrameFlex(
              direction: Axis.vertical,
              mainAxisAlignment: MainAxisAlignment.spaceEvenly,
              crossAxisAlignment: CrossAxisAlignment.start),
          children: List.generate(30, (i) => Text(i.toString())),
        ),
      ),
    );
  }
}

class MyGridView extends StatelessWidget {
  const MyGridView({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Frame(
          capsuleModifier: [
            const CapsuleDecoration(
              decoration: BoxDecoration(
                color: Colors.amberAccent,
              ),
            ),
            const CapsulePadding(padding: EdgeInsets.all(40)),
            const CapsulePadding(
                padding: EdgeInsets.only(left: 20, top: 10, bottom: 15)),
            const CapsuleAlign(align: Alignment.bottomLeft),
            const CapsuleSize(constraints: BoxConstraints.expand(width: 300)),
            CapsuleDecoration(
              decoration: BoxDecoration(
                color: Colors.blueAccent,
                border: Border.all(color: Colors.blueAccent),
                borderRadius: BorderRadius.circular(20.0),
              ),
            ),
            const CapsulePadding(
                padding: EdgeInsets.only(left: 20, top: 10, bottom: 10)),
          ],
          frameModifier: FrameGridView(
              gridDelegate:
                  SliverGridDelegateWithFixedCrossAxisCount(crossAxisCount: 5)),
          children: List.generate(30, (i) => Text(i.toString())),
        ),
      ),
    );
  }
}