responsive_size_helper 1.0.0 copy "responsive_size_helper: ^1.0.0" to clipboard
responsive_size_helper: ^1.0.0 copied to clipboard

A Flutter package that helps you create responsive layouts by converting Figma design dimensions to device-specific dimensions.

example/lib/main.dart

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

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Builder(
        builder: (context) {
          // Initialize ResponsiveSizeHelper
          ResponsiveSizeHelper.init(
            designWidth: 375, // Figma design width
            designHeight: 812, // Figma design height
            currentWidth: MediaQuery.of(context).size.width,
            currentHeight: MediaQuery.of(context).size.height,
          );

          return const MyHomePage();
        },
      ),
    );
  }
}

class MyHomePage extends StatelessWidget {
  const MyHomePage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('ResponsiveSizeHelper Example'),
      ),
      body: Center(
        child: Container(
          // Using responsive width and height
          width: ResponsiveSizeHelper.getWidth(200),
          height: ResponsiveSizeHelper.getHeight(100),
          color: Colors.blue,
          child: const Center(
            child: Text('Responsive Container'),
          ),
        ),
      ),
    );
  }
}
0
likes
140
points
20
downloads

Publisher

unverified uploader

Weekly Downloads

A Flutter package that helps you create responsive layouts by converting Figma design dimensions to device-specific dimensions.

Topics

#responsive #ui #layout #design

Documentation

API reference

License

MIT (license)

Dependencies

flutter

More

Packages that depend on responsive_size_helper