diff --git a/lib/main.dart b/lib/main.dart index 1ea6cfa..5e832f6 100644 --- a/lib/main.dart +++ b/lib/main.dart @@ -68,15 +68,12 @@ List blocks = [ const BlockWrapper(NativePerformance()), const BlockWrapper(LearnFromDevelopers()), const BlockWrapper(WhoUsesFlutter()), + // Disabled codelab block for performance. + const ResponsiveVisibility( + hiddenConditions: [Condition.smallerThan(name: DESKTOP)], + child: BlockWrapper(FlutterCodelab()), + ), const BlockWrapper(FlutterNewsRow()), const BlockWrapper(InstallFlutter()), const Footer(), ]; - -// Disabled codelab block for performance. -// ResponsiveVisibility( -// hiddenWhen: [Condition.smallerThan(name: DESKTOP)], -// child: ResponsiveConstraints( -// constraintsWhen: blockWidthConstraints, -// child: FlutterCodelab()), -// ), diff --git a/lib/ui/blocks.dart b/lib/ui/blocks.dart index da56a4e..099a935 100644 --- a/lib/ui/blocks.dart +++ b/lib/ui/blocks.dart @@ -1,7 +1,6 @@ import 'dart:ui' as ui; import 'package:flutter/cupertino.dart'; -import 'package:flutter/foundation.dart'; import 'package:flutter/gestures.dart'; import 'package:flutter/material.dart'; import 'package:flutter_website/components/components.dart'; @@ -1043,20 +1042,21 @@ class _LearnFromDevelopersState extends State { padding: const EdgeInsets.symmetric(horizontal: 25), child: AspectRatio( aspectRatio: videoAspectRatio, - child: (kIsWeb) - ? Image.asset( - "assets/images/video_thumbnail_learn_from_developers.png", - fit: BoxFit.contain) - // TODO: Disable multiple embedded iframes to prevent flicker. + child: WebViewWidget( + key: webViewKey, + controller: WebViewController() + ..loadRequest(Uri.parse(videoUrl)), + ) + // TODO: Legacy WebView on Web workarounds. + // (kIsWeb) + // ? Image.asset( + // "assets/images/video_thumbnail_learn_from_developers.png", + // fit: BoxFit.contain) // HtmlElementView( // key: webViewKey, // viewType: webViewKey.toString(), // ) - : WebViewWidget( - key: webViewKey, - controller: WebViewController() - ..loadRequest(Uri.parse(videoUrl)), - ), + , ), ), ), @@ -1246,8 +1246,6 @@ class _FlutterCodelabState extends State final double videoAspectRatio = 1.75; late Map codelabExamples; - // TODO: Breaks mobile builds. Official Flutter WebView plugin is working on Web support. - HtmlElementView? codelabHtmlElementView; UniqueKey webViewKey = UniqueKey(); @override @@ -1295,24 +1293,19 @@ class _FlutterCodelabState extends State padding: const EdgeInsets.fromLTRB(25, 16, 25, 16), child: AspectRatio( aspectRatio: videoAspectRatio, - child: (kIsWeb) - ? Container( - decoration: BoxDecoration( - border: Border.all( - color: const Color(0xFFD3D3D3), width: 1), - borderRadius: - const BorderRadius.all(Radius.circular(0)), - ), - child: HtmlElementView( - key: webViewKey, - viewType: codelabSelected, - ), - ) - : WebViewWidget( - key: webViewKey, - controller: WebViewController() - ..loadRequest(Uri.parse(codelabUrlSelected)), - ), + child: Container( + decoration: BoxDecoration( + border: Border.all( + color: const Color(0xFFD3D3D3), width: 1), + borderRadius: + const BorderRadius.all(Radius.circular(0)), + ), + child: WebViewWidget( + key: webViewKey, + controller: WebViewController() + ..loadRequest(Uri.parse(codelabUrlSelected)), + ), + ), ), ), ), diff --git a/pubspec.lock b/pubspec.lock index 88f3131..14c61ed 100644 --- a/pubspec.lock +++ b/pubspec.lock @@ -532,6 +532,14 @@ packages: url: "https://pub.dev" source: hosted version: "2.10.0" + webview_flutter_web: + dependency: "direct main" + description: + name: webview_flutter_web + sha256: "7f7cb8cfe5a5dee3b55d660a367c00838be56540ccb4097e84601bb6cb354af3" + url: "https://pub.dev" + source: hosted + version: "0.2.2+4" webview_flutter_wkwebview: dependency: transitive description: diff --git a/pubspec.yaml b/pubspec.yaml index 070f7d1..1389459 100644 --- a/pubspec.yaml +++ b/pubspec.yaml @@ -14,6 +14,7 @@ dependencies: url_launcher: ^6.2.5 video_player: ^2.8.2 webview_flutter: ^4.7.0 + webview_flutter_web: ^0.2.2+4 universal_html: ^2.2.4 google_fonts: ^6.1.0 responsive_framework: