device_frame 0.1.2

Flutter Android iOS web

Mockups for common devices.

device_frame #

Device Frame for Flutter

Mockups for common devices.

Quickstart #

CupertinoDeviceFrame(
    orientation: Orientation.portrait,
    device: AndroidDevice.iPhoneXs,
    child: Container(
        child: Text('Hello iOS'),
    ),
),
AndroidDeviceFrame(
    orientation: Orientation.portrait,
    device: AndroidDevice.mediumPhone,
    child: Container(
        child: Text('Hello Android'),
    ),
),

Usage #

Displaying virtual keyboard #

AndroidDeviceFrame(
    isKeyboardVisible: true,
    // ...
),

Change global theme #

DeviceFrameTheme(
    style: DeviceFrameStyle.light(),
    child: /* any frame child will have this style by default */
)

Change local style #

AndroidDeviceFrame(
    style: DeviceFrameStyle.light(),
    // ...
),