adaptive_container 0.0.3

Flutter Package used to achieve a bootstrap-like behavior in your flutter project (Web, Desktop, Mobile(Android, IOS)).

example/lib/main.dart

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

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Adaptive Demo',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Container(
            height: MediaQuery.of(context).size.height,
            width: MediaQuery.of(context).size.width,
            child: AdaptiveContainer(
              type: AdapType.ADA_5,
              children: [
                AdaptiveItem(
                    height: 200,
                    bgColor: Colors.blue,
                    content: Center(
                      child: Text(
                        "TEST R 1",
                        style: Theme.of(context).textTheme.headline4,
                      ),
                    )),
                AdaptiveItem(
                    height: 200,
                    bgColor: Colors.red,
                    content: Center(
                      child: Padding(
                        padding: const EdgeInsets.all(10.0),
                        child: Text(
                          "TEST R 2",
                          style: Theme.of(context).textTheme.headline4,
                        ),
                      ),
                    )),
                AdaptiveItem(
                    height: 200,
                    bgColor: Colors.yellow,
                    content: Center(
                      child: Text(
                        "TEST R 3",
                        style: Theme.of(context).textTheme.headline4,
                      ),
                    )),
                AdaptiveItem(
                    height: 200,
                    bgColor: Colors.green,
                    content: Center(
                      child: Text(
                        "TEST R 4",
                        style: Theme.of(context).textTheme.headline4,
                      ),
                    )),
                AdaptiveItem(
                    height: 200,
                    bgColor: Colors.purple,
                    content: Center(
                      child: Padding(
                        padding: const EdgeInsets.all(10.0),
                        child: Text(
                          "TEST R 5",
                          style: Theme.of(context).textTheme.headline4,
                        ),
                      ),
                    )),
              ],
            )));
  }
}