responsive_mediaquery 0.1.0

SDKflutter
Platformandroidioswindowslinuxmacosweb

Make your apps responsive by using this package. This package allows you to use mediaQuery in a much better way. In this package the screen is divided 100 units by height and width, which can help us in getting the right dimensions for our required widgets.

Getting started

Make your apps responsive by using this package.

Usage

MediaQuery is great for making our apps responsive but still it was really hectic to use MediaQuery and write it again and again. So I came up with an idea to make a separate class for mediaquery and extract its powers.

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

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

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: const MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({Key? key}) : super(key: key);

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    ResponsiveMediaQuery().init(context);
    return Scaffold(
        body: Container(
      width: ResponsiveMediaQuery.horizontalLength*100,
      height:ResponsiveMediaQuery.verticalLength*40,
      color: Colors.blue,
    ));
  }
}