英文:
I can't see embed youtube or pdf on flutter web html viewer
问题
以下是您提供的内容的中文翻译:
"Can anyone help me with this please? I'm using Flutter 3.7.9, when I add something embeded (pdf or youtube video) with my html editor, and then try to view it, I only can see it on mobile, doesn't show up on flutter web.
I tried using other things like easy web view but It's doesn't seem to work with these version of my pubspec.yaml and I can't change much of those versions or the html editor advanced will not work correctly.
this is when I addded embed youtube video and embed pdf:
but this is what shows up in my preview page ( on web ), only text, images..etc:
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
export 'htmleditor_model.dart';
export 'htmleditor_model.dart';
class MyPreviewPage extends StatelessWidget {
final String htmlText;
const MyPreviewPage({Key? key, required this.htmlText}) : super(key: key);
@override
Widget build(BuildContext context) {
/* if (kIsWeb) {
return Scaffold(
appBar: AppBar(
title: const Text('Preview Page'),
),
body: SingleChildScrollView(
child: HtmlWidget('$htmlText'),
),
);
} else {*/
return Scaffold(
appBar: AppBar(
title: const Text('Preview Page'),
),
body: Padding(
padding: const EdgeInsets.all(8.0),
child: SingleChildScrollView(
child: Html(
data: htmlText,
),
),
)
);
}
}
This is my pubspec.yaml, I can't change much of the versions because I'm using the html_editor_advanced and it seems to only work with these versions:
name: text_editor_project
description: A new Flutter project.
publish_to: 'none'
version: 1.0.0+1
environment:
sdk: '>=2.12.0 <3.0.0'
dependencies:
flutter:
sdk: flutter
flutter_localizations:
sdk: flutter
auto_size_text: 3.0.0
cached_network_image: 3.2.1
flutter_animate: 1.0.0
flutter_cache_manager: 3.3.0
font_awesome_flutter: 10.1.0
from_css_color: 2.0.0
go_router: 3.1.0
google_fonts: 3.0.1
html_editor_enhanced: ^2.5.1
intl: 0.17.0
json_path: 0.4.1
page_transition: 2.0.4
provider: 6.0.4
shared_preferences: 2.0.15
sqflite: 2.2.0+2
timeago: 3.2.2
url_launcher: 6.1.5
firebase_core: ^2.5.0
firebase_auth: ^4.2.6
cloud_firestore: ^4.4.4
lottie: ^2.2.0
google_sign_in: ^6.0.1
google_sign_in_web: ^0.11.0+1
flutter_windowmanager: ^0.2.0
image_picker: ^0.8.7+1
firebase_storage: ^11.1.0
cupertino_icons: ^1.0.0
flutter_widget_from_html: ^0.10.0
flutter_html: 3.0.0-alpha.5
#sanitize_html: ^2.0.0
#video_player_web: ^2.0.16
#flutter_html_video: ^3.0.0-alpha.4
#flutter_html_iframe: ^3.0.0-beta.2
dependency_overrides:
provider: 6.0.0
webview_flutter_android: 2.10.3
webview_flutter_platform_interface: 1.9.5
webview_flutter_wkwebview: 2.9.5
dev_dependencies:
flutter_test:
sdk: flutter
flutter:
uses-material-design: true
assets:
- assets/fonts/
- assets/images/
- assets/videos/
- assets/audios/
- assets/lottie_animations/
- assets/rive_animations/
- assets/pdfs/
英文:
Can anyone help me with this please ? I'm using Flutter 3.7.9 , when I add something embeded (pdf or youtube video ) with my html editor , and then try to view it, I only can see it on mobile , doesn't show up on flutter web.
I tried using other things like easy web view but It's doesn't seem to work with these version of my pubspec.yaml and I can't change much of those versions or the html editor advanced will not work correctly.
this is when I addded embed youtube video and embed pdf :
but this is what shows up in my preview page ( on web ) , only text,images..etc :
import 'package:flutter/foundation.dart';
import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
export 'htmleditor_model.dart';
export 'htmleditor_model.dart';
class MyPreviewPage extends StatelessWidget {
final String htmlText;
const MyPreviewPage({Key? key, required this.htmlText}) : super(key: key);
@override
Widget build(BuildContext context) {
/* if (kIsWeb) {
return Scaffold(
appBar: AppBar(
title: const Text('Preview Page'),
),
body: SingleChildScrollView(
child: HtmlWidget('$htmlText'),
),
);
} else {*/
return Scaffold(
appBar: AppBar(
title: const Text('Preview Page'),
),
body: Padding(
padding: const EdgeInsets.all(8.0),
child: SingleChildScrollView(
child: Html(
data: htmlText,
),
),
)
);
}
}
This is my pubspec.yaml , I can't change much of the versions because I'm using the html_editor_advanced and it seems to only work with these version :
name: text_editor_project
description: A new Flutter project.
publish_to: 'none'
version: 1.0.0+1
environment:
sdk: ">=2.12.0 <3.0.0"
dependencies:
flutter:
sdk: flutter
flutter_localizations:
sdk: flutter
auto_size_text: 3.0.0
cached_network_image: 3.2.1
flutter_animate: 1.0.0
flutter_cache_manager: 3.3.0
font_awesome_flutter: 10.1.0
from_css_color: 2.0.0
go_router: 3.1.0
google_fonts: 3.0.1
html_editor_enhanced: ^2.5.1
intl: 0.17.0
json_path: 0.4.1
page_transition: 2.0.4
provider: 6.0.4
shared_preferences: 2.0.15
sqflite: 2.2.0+2
timeago: 3.2.2
url_launcher: 6.1.5
firebase_core: ^2.5.0
firebase_auth: ^4.2.6
cloud_firestore: ^4.4.4
lottie: ^2.2.0
google_sign_in: ^6.0.1
google_sign_in_web: ^0.11.0+1
flutter_windowmanager: ^0.2.0
image_picker: ^0.8.7+1
firebase_storage: ^11.1.0
cupertino_icons: ^1.0.0
flutter_widget_from_html: ^0.10.0
flutter_html: 3.0.0-alpha.5
#sanitize_html: ^2.0.0
#video_player_web: ^2.0.16
#flutter_html_video: ^3.0.0-alpha.4
#flutter_html_iframe: ^3.0.0-beta.2
dependency_overrides:
provider: 6.0.0
webview_flutter_android: 2.10.3
webview_flutter_platform_interface: 1.9.5
webview_flutter_wkwebview: 2.9.5
dev_dependencies:
flutter_test:
sdk: flutter
flutter:
uses-material-design: true
assets:
- assets/fonts/
- assets/images/
- assets/videos/
- assets/audios/
- assets/lottie_animations/
- assets/rive_animations/
- assets/pdfs/
答案1
得分: 1
我升级了pubspec.yaml文件,它有效了,还降级了一些flutter_html,原来flutter_html_iframe引起了问题。感谢所有试图帮助的人,希望这对于遇到相同问题的人有所帮助。
英文:
I upgraded the pubspec.yaml file and it worked and also downgraded some of the flutter_html one, turns out flutter_html_iframe is causing an issue.
Thanks to everyone who is trying to help & I hope this benefit anyone who got the same issue.
name: text_editor_project
description: A new Flutter project.
publish_to: 'none'
version: 1.0.0+1
environment:
sdk: ">=2.12.0 <3.0.0"
dependencies:
flutter:
sdk: flutter
flutter_localizations:
sdk: flutter
auto_size_text: 3.0.0
cached_network_image: 3.2.1
flutter_animate: 1.0.0
flutter_cache_manager: 3.3.0
font_awesome_flutter: 10.1.0
from_css_color: 2.0.0
go_router: 3.1.0
google_fonts: 3.0.1
html_editor_enhanced: ^2.5.1
intl: 0.17.0
json_path: 0.4.1
page_transition: 2.0.4
provider: 6.0.4
shared_preferences: 2.0.15
sqflite: 2.2.0+2
timeago: 3.2.2
url_launcher: 6.1.5
firebase_core: ^2.5.0
firebase_auth: ^4.2.6
cloud_firestore: ^4.4.4
lottie: ^2.2.0
google_sign_in: ^6.0.1
google_sign_in_web: ^0.11.0+1
flutter_windowmanager: ^0.2.0
image_picker: ^0.8.7+1
firebase_storage: ^11.1.0
cupertino_icons: ^1.0.0
#flutter_widget_from_html: ^0.10.0
universal_html: ^2.2.1
flutter_html: ^2.1.2
#sanitize_html: ^2.0.0
#video_player_web: ^2.0.16
#flutter_html_video: ^3.0.0-alpha.4
#flutter_html_iframe: ^2.0.
dependency_overrides:
provider: ^6.0.5
webview_flutter_android: ^3.8.0
webview_flutter_platform_interface: ^2.3.1
webview_flutter_wkwebview: ^3.5.0
dev_dependencies:
flutter_test:
sdk: flutter
flutter:
uses-material-design: true
assets:
- assets/fonts/
- assets/images/
- assets/videos/
- assets/audios/
- assets/lottie_animations/
- assets/rive_animations/
- assets/pdfs/
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论