flutter_responsive_helper 1.0.1

A flutter package for making responsive application from your UI design easier and faster.

responsive_helper

responsive_helper is a Flutter package which will help you make your application responsive without doing any calculations. Just add the same measurements as given by the designer!

How does it work?

You just have to initialize responsive_helper by giving the size of the screen which is used in the UI. Then just copy paste the sizes of the objects which are given in the UI and paste it in your code by using .h / .w / .t after giving the size. Now responsive_helper will automatically calculate and make that object responsive according to the user's screen and your code will look really very similar to the design given by the designer.

Installation

Install the package in your code

flutter pub add responsive_helper

Usage

class ResponsiveExample extends StatefulWidget {
  const ResponsiveExample({super.key});

  @override
  State<ResponsiveExample> createState() => _ResponsiveExampleState();
}

class _ResponsiveExampleState extends State<ResponsiveExample> {
  @override
  void initState() {
    // TODO: implement initState
    initializeSize(396, 812); // Give the size of the screen which is used in the design
  }

  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
        body: Column(
          children: [
              Container(
                width: 350.w(context), // width of the object which is given in the design file
                height: 80.h(context), // height of the object which is given in the design file
                color: Colors.black,
              ),
            ),
          ],
        ),
      ),
    );
  }
}

Author

Follow @Malay1121

LinkedIn: @Malay Patel