scaled_app 0.2.1 icon indicating copy to clipboard operation
scaled_app: ^0.2.1 copied to clipboard

Scale the entire UI design proportionally, useful when the UI design is fixed-width.

Scale the entire UI design proportionally.

Button, image, font, everything is scaled automatically.

Before:

  • 250x250 square is the same size across devices

Screenshots of the same design before scaling

After:

  • 250x250 square is two thirds the screen width across devices

Screenshots of the same design after scaling

  • if we resize the screenshots above to be the same width
  • then everything appears the same size as below

Resized screenshots of the same design after scaling

Features #

Use this package in your Flutter app when:

  • the UI design is fixed-width
  • you want to scale the entire UI, not just part of it

Getting Started #

In the pubspec.yaml of your flutter project, add the following dependency:

dependencies:
  ...
  scaled_app: ^0.2.1

For projects using Flutter 2.x.x, add the following dependency:

dependencies:
  ...
  scaled_app:
    git:
      url: https://github.com/LastMonopoly/scaled_app.git
      ref: flutter_2.x.x

Import it:

import 'package:scaled_app/scaled_app.dart';

Usage #

Replace runApp with runAppScaled

void main() {
  // 1st way to use this package
  // baseWidth is the screen width used for your UI design
  runAppScaled(const MyApp(), baseWidth: 375);
}

Or, replace WidgetsFlutterBinding with ScaledWidgetsFlutterBinding

void main() {
  // 2nd way to use this package
  // Scaling will be applied when [applyScaling] returns true
  ScaledWidgetsFlutterBinding.ensureInitialized(
    baseWidth: 375,
    applyScaling: (deviceWidth) => deviceWidth > 300 && deviceWidth < 400,
  );
  runAppScaled(const MyApp());
}

Known Issues #

This package currently won't work in Android release mode.

7
likes
130
pub points
67%
popularity

Publisher

verified publisher iconflutter.hanshi.tech

Scale the entire UI design proportionally, useful when the UI design is fixed-width.

Repository (GitHub)
View/report issues

Documentation

API reference

License

Icon for licenses.BSD-3-Clause (LICENSE)

Dependencies

flutter

More

Packages that depend on scaled_app