device_simulator 0.9.5

  • Readme
  • Changelog
  • Example
  • Installing
  • 91

DeviceSimulator #

DeviceSimulator allows you to easily test your Flutter app for different screen resolutions and platforms. If you use this package, please consider downloading the Newsvoice app and giving us a five star review. Thanks!

Device Simulator demo

With DeviceSimulator you will be able to get a quick look at what your app would look like on all iOS / iPadOS devices and a selection of common Android devices. In addition, there is a screenshot mode that makes it really easy to take screens in different resolutions for App Store and Google Play.

Getting Started #

This project was born out of the frustration of testing apps on multiple devices to make sure that the layout looked good in all resolutions. DeviceSimulator will let you quickly emulate different device types. It works best if you run it on an iPad Pro, but it also works well on the iOS Simulator and smaller tablets.

To learn more about designing for multiple resolutions, check out the Medium article that I wrote on the topic.

Add DeviceSimulator to your widget tree #

It's really easy to add DeviceSimulator to your app. Simply add it to the root of your widget tree, right under your App widget. Build the rest of the widget tree as you would normally do. This is a minimal example:

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

const bool debugEnableDeviceSimulator = true;

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'DeviceSimulator demo',
      home: DeviceSimulator(
        brightness: Brightness.dark,
        enable: debugEnableDeviceSimulator,
        child: Scaffold(
          appBar: AppBar(
            title: Text('DeviceSimulator Demo'),
          body: Center(
            child: Text('Hello multiple resolutions!'),

Pushing Routes #

Unfortunately, the current implementation does not automatically support pushing routes on top of your main screen. To make this work, you will need to include a DeviceSimulator in each route you push. This is an example:

Navigator.push(context, new MaterialPageRoute<Null>(
  builder: (BuildContext context) {
    return DeviceSimulator(
      enable: debugEnableDeviceSimulator,
      child: MyScaffold(...),

Caveats #

I built DeviceSimulator for my own needs and it's working great for me, but it's not heavily tested and provided as is. Feedback and pull requests are most welcome.

Enjoy! / Vik

[0.9.1] - 2019-10-27 - Initial release.

  • Initial working version of DeviceSimulator

[0.9.5] - 2019-10-27 - Docs.

  • Improved documentation


DeviceSimulator example #

This contains a minimal example of how to use the DeviceSimulator widget.

Getting Started #

Run this example using:

flutter run

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:

  device_simulator: ^0.9.5

2. Install it

You can install packages from the command line:

with Flutter:

$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:

import 'package:device_simulator/device_simulator.dart';
Describes how popular the package is relative to other packages. [more]
Code health derived from static analysis. [more]
Reflects how tidy and up-to-date the package is. [more]
Weighted score of the above. [more]
Learn more about scoring.

We analyzed this package on Dec 4, 2019, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.6.1
  • pana: 0.12.21
  • Flutter: 1.9.1+hotfix.6


Detected platforms: Flutter

References Flutter, and has no conflicting libraries.


Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.3.0 <3.0.0
flutter 0.0.0
Transitive dependencies
collection 1.14.11 1.14.12
meta 1.1.7 1.1.8
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8
Dev dependencies