v3.5.3

add YoutubePlayerExample

Author: X-Wei

Diff for: CHANGELOG.md

@@ -1,5 +1,11 @@
 # Change Log
 
+## v3.5.3
+[2023-01-17]
+- Add new heatmap calendar example
+- Add like button example
+- Add youtube player example
+
 ## v3.5.2
 [2022-12-11]
 - add StoreSecretsExample example on how to store secrets

Diff for: CONTRIBUTING.md

@@ -1 +1,37 @@
-https://github.com
+# CONTRIBUTING
+
+## contribute by adding a new example page
+
+1. Create a dart file under `lib/route/` (or just duplicate a file, e.g. `cp widgets_icon_ex.dart new_example.dart`);
+2. In the new file, create an example widget;
+3. In `my_app_routes.dart`, add a new `MyRoute` entry, with `child` being the example widget from last step;
+4. Add other metadata like `sourceFilePath`,`title`, `description` and `links` to the `MyRoute` entry;
+5. test run the app;
+6. create a git pull request on github
+
+
+## app release
+
+### Android
+
+```sh
+# Copy dart defines to clipboard
+$ define_env -c
+# Build appbundle with the dart defines:
+$ flutter build --dart-define=...
+# Copy the built file to tmp/releases:
+$ cp build/app/outputs/bundle/release/app-release.aab \
+  tmp/releases/releases.link/flutter_catalog_va.b.c+dd.aab
+```
+
+### iOS
+```sh
+# Optional: re-install pod files
+$ cd ios && pod install --repo-update && cd ..
+# Copy dart defines to clipboard
+$ define_env -c
+# Build ipa with the dart defines:
+$ flutter build ipa --release --dart-define=...
+# Open the archive in XCode
+$ open build/ios/archive/Runner.xcarchive
+```

Diff for: README.md

@@ -27,16 +27,6 @@ And note there are some [limitations](https://github.com/X-Wei/flutter_catalog/i
 <img src="screenshots/Screenshot_1546722852.png" width="240px" />
 
 
-## How to contribute by adding a new example page
-
-1. Create a dart file under `lib/route/` (or just duplicate a file, e.g. `cp widgets_icon_ex.dart new_example.dart`);
-2. In the new file, create a class that extends MyRoute;
-3. Add  constructor, the convention is to use the file path as constructor's default parameter;
-4. (Optional) override getters: `title`, `description`, `links`;
-5. Override `buildMyRouteContent()`, try to make the code simple, as it'll be shown on phone screens;
-6. Open `lib/my_app_meta.dart`, import the new file at the beginning of file;
-7. In `kMyAppRoutesStructure`, add an instantiation of the new class under the appropriate item group.
-
 ## Credits
 
 This app is written with reference to many resources, including:

Diff for: lib/env.dart

@@ -74,6 +74,7 @@ import 'routes/multimedia_extended_image_ex.dart';
 import 'routes/multimedia_image_picker_ex.dart';
 import 'routes/multimedia_image_plugin_ex.dart';
 import 'routes/multimedia_video_player_ex.dart';
+import 'routes/multimedia_youtube_player_ex.dart';
 import 'routes/nav_bottom_navbar_ex.dart';
 import 'routes/nav_bottom_sheet_ex.dart';
 import 'routes/nav_bottom_tabbar_ex.dart';
@@ -777,6 +778,12 @@ const kMyAppRoutesAdvanced = <MyRouteGroup>[
         description: 'Video/audio player plugin by the flutter team.',
         links: {'Pub': 'https://pub.dev/packages/video_player'},
       ),
+      MyRoute(
+        child: YoutubePlayerExample(),
+        sourceFilePath: 'lib/routes/multimedia_youtube_player_ex.dart',
+        title: 'Youtube Player',
+        links: {'Pub': 'https://pub.dev/packages/youtube_player_iframe'},
+      ),
       MyRoute(
         child: EdgeDetectionExample(),
         sourceFilePath: 'lib/routes/multimedia_edge_detection_ex.dart',

Diff for: lib/my_app_routes.dart

@@ -0,0 +1,72 @@
+import 'package:flutter/material.dart';
+import 'package:youtube_player_iframe/youtube_player_iframe.dart';
+
+class YoutubePlayerExample extends StatefulWidget {
+  const YoutubePlayerExample({super.key});
+
+  @override
+  State<YoutubePlayerExample> createState() => _YoutubePlayerExampleState();
+}
+
+class _YoutubePlayerExampleState extends State<YoutubePlayerExample> {
+  final _txtController = TextEditingController();
+  //! Use `YoutubePlayerController.fromVideoId` if just play a single video.
+  final _ytController = YoutubePlayerController(
+    params: const YoutubePlayerParams(
+        showFullscreenButton: true, mute: false, showControls: true),
+  );
+
+  @override
+  void initState() {
+    super.initState();
+    _txtController.text = 'https://www.youtube.com/watch?v=jfKfPfyJRdk';
+  }
+
+  String? _getVideoId() {
+    if (_txtController.text.startsWith('https://youtu.be/')) {
+      return _txtController.text.substring('https://youtu.be/'.length);
+    } else if (_txtController.text
+        .startsWith('https://www.youtube.com/watch?v=')) {
+      return _txtController.text
+          .substring('https://www.youtube.com/watch?v='.length);
+    }
+    return null;
+  }
+
+  Future<void> _play() async {
+    final videoId = _getVideoId();
+    if (videoId == null) {
+      ScaffoldMessenger.of(context)
+        ..clearSnackBars()
+        ..showSnackBar(
+          SnackBar(
+            content: Text(
+                'Failed to extract video Id from "${_txtController.text}"!\n'
+                'Please make sure it is in either "https://youtu.be/\$id" or "https://www.youtube.com/watch?v=\$id" format!'),
+          ),
+        );
+      return;
+    }
+    //? loadVideoByUrl doesn't work?
+    // await _ytController.loadVideoByUrl(mediaContentUrl: _txtController.text);
+    await _ytController.loadVideoById(videoId: videoId);
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    // We can add the player along with other widgets with the YoutubePlayerScaffold
+    return YoutubePlayerScaffold(
+      builder: (ctx, player) => SingleChildScrollView(
+        child: Column(
+          children: [
+            Text('YT player iframe'),
+            TextField(controller: _txtController),
+            ElevatedButton(onPressed: _play, child: Text('play')),
+            player,
+          ],
+        ),
+      ),
+      controller: _ytController,
+    );
+  }
+}

Diff for: lib/routes/multimedia_youtube_player_ex.dart

@@ -1912,7 +1912,7 @@ packages:
       name: url_launcher
       url: "https://pub.dartlang.org"
     source: hosted
-    version: "6.1.6"
+    version: "6.1.7"
   url_launcher_android:
     dependency: transitive
     description:
@@ -2032,6 +2032,34 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "1.2.0"
+  webview_flutter:
+    dependency: transitive
+    description:
+      name: webview_flutter
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "4.0.1"
+  webview_flutter_android:
+    dependency: transitive
+    description:
+      name: webview_flutter_android
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "3.1.1"
+  webview_flutter_platform_interface:
+    dependency: transitive
+    description:
+      name: webview_flutter_platform_interface
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "2.0.1"
+  webview_flutter_wkwebview:
+    dependency: transitive
+    description:
+      name: webview_flutter_wkwebview
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "3.0.2"
   widget_with_codeview:
     dependency: "direct main"
     description:
@@ -2067,6 +2095,20 @@ packages:
       url: "https://pub.dartlang.org"
     source: hosted
     version: "3.1.1"
+  youtube_player_iframe:
+    dependency: "direct main"
+    description:
+      name: youtube_player_iframe
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "4.0.1"
+  youtube_player_iframe_web:
+    dependency: transitive
+    description:
+      name: youtube_player_iframe_web
+      url: "https://pub.dartlang.org"
+    source: hosted
+    version: "2.0.0"
 sdks:
   dart: ">=2.18.0 <3.0.0"
   flutter: ">=3.3.0"

Diff for: pubspec.lock

@@ -1,7 +1,7 @@
 name: flutter_catalog
 description: An app showcasing Flutter components, with side-by-side source code view.
 
-version: 3.5.2+93
+version: 3.5.3+95
 
 environment:
   sdk: ">=2.17.0 <3.0.0"
@@ -103,6 +103,7 @@ dependencies:
   url_launcher: ^6.0.9
   video_player: ^2.1.12
   widget_with_codeview: ^3.0.1
+  youtube_player_iframe: ^4.0.1
 
 dev_dependencies:
   build_runner: ^2.0.6