device_preview is not working, a blank page is displayed.

[robinbakkerus]

This very basic implementation only displays a blank page.

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

void main() {
  DevicePreview(
    enabled: true, //kReleaseMode,
    builder: (context) => const MyApp(), // Wrap your app
  );
}

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        locale: DevicePreview.locale(context),
        builder: DevicePreview.appBuilder,
        home: const Material(
          child: Text('demo'),
        ));
}

flutter doctor =>

Doctor summary (to see all details, run flutter doctor -v):
[√] Flutter (Channel stable, 3.10.6, on Microsoft Windows [Version 10.0.19045.3208], locale en-NL)
[√] Windows Version (Installed version of Windows is version 10 or higher)
[√] Android toolchain - develop for Android devices (Android SDK version 32.1.0-rc1)
[√] Chrome - develop for the web
[√] Visual Studio - develop for Windows (Visual Studio Build Tools 2019 16.11.15)
[√] Android Studio (version 2021.2)
[√] Connected device (3 available)
[√] Network resources
• No issues found!

flutter --version =>

Flutter 3.10.6 • channel stable • https://github.com/flutter/flutter.git 
Framework • revision f468f3366c (4 weeks ago) • 2023-07-12 15:19:05 -0700
Engine • revision cdbeda788a
Tools • Dart 3.0.6 • DevTools 2.23.1

And I tested this app with the following commands:

flutter clean
flutter build web
flutter run

[udit6023]

Here,you can try these few adjustments in your code. 1)Ensure that the text widget is wrapped in a Center widget so that the "demo" text is centered on the screen. 2)Use the Key parameter for the MyApp constructor instead of super.key. Like( const MyApp({Key? key}) : super(key: key); // Use Key instead of super.key) 3)Or you can try Importing kReleaseMode from flutter/foundation.dart to properly handle enabling DevicePreview only during development.

[robinbakkerus]

Hi,

No these changes do not help: [image: afbeelding.png]

This is the code: import 'package:device_preview/device_preview.dart'; import 'package:flutter/material.dart';

void main() { DevicePreview( enabled: true, //kReleaseMode, builder: (context) => const MyApp(), // Wrap your app ); }

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

@override Widget build(BuildContext context) { return MaterialApp( locale: DevicePreview.locale(context), builder: DevicePreview.appBuilder, home: const Material( child: Center(child: Text('demo')), )); } }

On Thu, Aug 10, 2023 at 7:32 PM Udit Soni @.***> wrote:

Here,you can try these few adjustements in your code. 1)Ensure that the text widget is wrapped in a Center widget so that the "demo" text is centered on the screen. 2)Use the Key parameter for the MyApp constructor instead of super.key. Like( const MyApp({Key? key}) : super(key: key); // Use Key instead of super.key) 3)Or you can try Importing kReleaseMode from flutter/foundation.dart to properly handle enabling DevicePreview only during development.

— Reply to this email directly, view it on GitHub https://github.com/aloisdeniel/flutter_device_preview/issues/231#issuecomment-1673628958, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAMWA2JE2GWBGJYLRY5YSPLXUULMJANCNFSM6AAAAAA3JXXWJU . You are receiving this because you authored the thread.Message ID: @.***>

-- met vriendelijke groeten Robin Bakkerus @.***

[robinbakkerus]

Hi,

My bad ! Your package is working, once you startup Flutter correctly. This was the issue:

void main() { DevicePreview(

instead of: void main() { runApp(DevicePreview(

(runApp was missing!)

gr Robin

On Mon, Aug 14, 2023 at 12:33 PM Robin Bakkerus @.***> wrote:

Hi,

No these changes do not help: [image: afbeelding.png]

This is the code: import 'package:device_preview/device_preview.dart'; import 'package:flutter/material.dart';

void main() { DevicePreview( enabled: true, //kReleaseMode, builder: (context) => const MyApp(), // Wrap your app ); }

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

@override Widget build(BuildContext context) { return MaterialApp( locale: DevicePreview.locale(context), builder: DevicePreview.appBuilder, home: const Material( child: Center(child: Text('demo')), )); } }

On Thu, Aug 10, 2023 at 7:32 PM Udit Soni @.***> wrote:

Here,you can try these few adjustements in your code. 1)Ensure that the text widget is wrapped in a Center widget so that the "demo" text is centered on the screen. 2)Use the Key parameter for the MyApp constructor instead of super.key. Like( const MyApp({Key? key}) : super(key: key); // Use Key instead of super.key) 3)Or you can try Importing kReleaseMode from flutter/foundation.dart to properly handle enabling DevicePreview only during development.

— Reply to this email directly, view it on GitHub https://github.com/aloisdeniel/flutter_device_preview/issues/231#issuecomment-1673628958, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAMWA2JE2GWBGJYLRY5YSPLXUULMJANCNFSM6AAAAAA3JXXWJU . You are receiving this because you authored the thread.Message ID: @.***>

-- met vriendelijke groeten Robin Bakkerus @.***

-- met vriendelijke groeten Robin Bakkerus @.***

[udit6023]

@robinbakkerus im glad that you able to figure it out, keep growing and enjoy your ride with flutter ;)