easy_container 1.0.4+1

An easy to use container for flutter with built in gesture detectors and a lot of customization.

EasyContainer For Flutter

An easy to use container for flutter with built in gesture detectors and a lot of customization.

Screenshots

  

Usage

To use this plugin, add easy_container as a dependency in your pubspec.yaml file.

  dependencies:
    flutter:
      sdk: flutter
    easy_container:

First and foremost, import the widget.

import 'package:easy_container/easy_container.dart';

You can now add an EasyContainer widget to your widget tree and pass the child as the only required parameter to get started. This widget will create a route between the source and the destination LatLng's provided.

EasyContainer(
    child: Text("Hello World"),
),

If an onTap, onLongPress etc. parameters are provided, it can be used as a button.

EasyContainer(
    child: Text("Hello World"),
    onTap: () => debugPrint("Hello World"),
),

Want to add some padding/margin/borderRadius?

Padding from all sides can be added by passing padding as a double. If you want to customize padding, then use customPadding which expects EdgeInsets allowing for customization.

If customPadding is passed, padding is ignored.

Same applies for margin and borderRadius.

EasyContainer(
    child: Text("Hello World"),
    onTap: () => debugPrint("Hello World"),
    
    /// Shorthand for EdgeInsets.all(20)
    padding: 20,

    /// if customPadding passed, padding is ignored.
    /// Hence padding applied to container is 10 from all sides.

    customPadding: EdgeInsets.all(10),
),

The default alignment is center. So the container tries to take as much space as possible. To deny the same, you can set the alignment to null or specify height/width.

EasyContainer(
    child: Text("Hello World"),
    onTap: () => debugPrint("Hello World"),

    /// child not longer takes all the available space
    alignment: null,
),

To enable a border, showBorder must be true. Defaults to false.

If showBorder is true, parameters like borderColor, borderWidth, borderStyle come into play.

EasyContainer(
    child: Text("Hello World"),
    onTap: () => debugPrint("Hello World"),
    showBorder: true,
    borderWidth: 5,
    borderColor: Colors.red,
),

Sample Usage

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

void main() => runApp(_MainApp());

class _MainApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: SafeArea(
        child: Scaffold(
          body: Center(
            child: EasyContainer(
              height: 300,
              width: 300,
              child: const CircularProgressIndicator.adaptive(),
              padding: 20,
              elevation: 10,
              onTap: () => debugPrint("Container Tapped"),
              margin: 20,
              borderRadius: 20,
              color: Colors.red,
            ),
          ),
        ),
      ),
    );
  }
}

And a lot more.... There is a lot of customization available which is self explanatory. You can the read the full documentation here.

See the example directory for a complete sample app.

Created & Maintained By Rithik Bhandari

• GitHub: @rithik-dev
• LinkedIn: @rithik-bhandari