EasyContainer For Flutter
An easy to use container for flutter with built in gesture detectors and a lot of customization.
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.
- GitHub: @rithik-dev
- LinkedIn: @rithik-bhandari
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent