Web - there are any visual defects - CRASH

[maurobotta]

Hi

i have tested project on Web, don't work well.

Compile but there are more visual fail.

Flutter (Channel beta, 1.19.0-4.1.pre, on Microsoft Windows [Versione 10.0.18363.959], locale it-IT)

//import 'dart:io';
import 'package:universal_io/io.dart';

[maurobotta]

I have compiled again with last version,

change src:
//import 'dart:io';
import 'package:universal_io/io.dart';

compiled for Web, run.... open site well , click on My Diary image ( CRASH )

[√] Flutter (Channel beta, 1.21.0-9.1.pre, on Microsoft Windows [Versione 10.0.18363.1016], locale it-IT)
[√] Android toolchain - develop for Android devices (Android SDK version 29.0.3)
[√] Chrome - develop for the web
[√] Android Studio (version 4.0)
[√] Connected device (3 available)

MY-DIARY CRASH

ERROR LOGS:

When the exception was thrown, this was the stack
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/internal/js_dev_runtime/private/ddc_runtime/errors.dart 212:49 throw
C:/b/s/w/ir/cache/builder/src/out/host_debug/dart-sdk/lib/_internal/js_dev_runtime/private/ddc_runtime/errors.dart 24:3 assertFailed
packages/flutter/src/widgets/shortcuts.dart 329:33 handleKeypress
packages/flutter/src/widgets/shortcuts.dart 472:20 [_handleOnKey]
packages/flutter/src/widgets/focus_manager.dart 1625:43 [_handleRawKeyEvent]

════════ Exception caught by scheduler library ═════════════════════════════════
UnimplementedError
════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by scheduler library ═════════════════════════════════
PersistedOffset: is in an unexpected state.
Expected one of: PersistedSurfaceState.active, PersistedSurfaceState.released
But was: PersistedSurfaceState.pendingRetention
════════════════════════════════════════════════════════════════════════════════

[aniketambore]

You can fix the above error by just replacing the main.dart with the below code :-

import 'dart:io';
import 'package:best_flutter_ui_templates/app_theme.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'navigation_home_screen.dart';
import 'package:flutter/foundation.dart' show kIsWeb;

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  kIsWeb ? runApp(MyApp()) : await SystemChrome.setPreferredOrientations(<DeviceOrientation>[DeviceOrientation.portraitUp, DeviceOrientation.portraitDown])
      .then((_) => runApp(MyApp()));
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    SystemChrome.setSystemUIOverlayStyle(SystemUiOverlayStyle(
      statusBarColor: Colors.transparent,
      statusBarIconBrightness: Brightness.dark,
      statusBarBrightness: kIsWeb ? Brightness.dark : (Platform.isAndroid ? Brightness.dark : Brightness.light),
      systemNavigationBarColor: Colors.white,
      systemNavigationBarDividerColor: Colors.grey,
      systemNavigationBarIconBrightness: Brightness.dark,
    ));
    return MaterialApp(
      title: 'Flutter UI',
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        primarySwatch: Colors.blue,
        textTheme: AppTheme.textTheme,
        platform: TargetPlatform.iOS,
      ),
      home: NavigationHomeScreen(),
    );
  }
}

class HexColor extends Color {
  HexColor(final String hexColor) : super(_getColorFromHex(hexColor));

  static int _getColorFromHex(String hexColor) {
    hexColor = hexColor.toUpperCase().replaceAll('#', '');
    if (hexColor.length == 6) {
      hexColor = 'FF' + hexColor;
    }
    return int.parse(hexColor, radix: 16);
  }
}

---

Run:- flutter run -d web-server --web-port 7357

Open:- localhost:7357

[mitesh77]

this project is not designed for the Web but I will do something next month. so maybe work