I would like to open pdf file in my flutter-web project, as long as I know... when I open the pdf, it always navigates me to new tab, is there a way to display pdf inside container of widget flutter? So, far I only open the pdf file by doing this
html.window.open('http://xxxx.pdf',"my_pdf");
I still didn't know how to put it inside widget flutter
You can copy paste run full code below
In the demo code, I add blue border
on Container
code snippet
class Iframe extends StatelessWidget {
Iframe() {
// ignore: undefined_prefixed_name
ui.platformViewRegistry.registerViewFactory('iframe', (int viewId) {
var iframe = html.IFrameElement();
iframe.src = 'http://www.africau.edu/images/default/sample.pdf';
return iframe;
});
}
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(border: Border.all(color: Colors.blueAccent)),
width: 400,
height: 300,
child: HtmlElementView(viewType: 'iframe'));
}
}
working demo
full code
import 'package:flutter/material.dart';
// import 'dart:io' if (dart.library.html) 'dart:ui' as ui;
import 'dart:ui' as ui;
import 'dart:html' as html;
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
home: MyHomePage(),
);
}
}
class MyHomePage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(child: Iframe()),
floatingActionButton: FloatingActionButton(
onPressed: () {},
tooltip: 'Increment',
child: Icon(Icons.add),
),
);
}
}
class Iframe extends StatelessWidget {
Iframe() {
// ignore: undefined_prefixed_name
ui.platformViewRegistry.registerViewFactory('iframe', (int viewId) {
var iframe = html.IFrameElement();
iframe.src = 'http://www.africau.edu/images/default/sample.pdf';
return iframe;
});
}
@override
Widget build(BuildContext context) {
return Container(
decoration: BoxDecoration(border: Border.all(color: Colors.blueAccent)),
width: 400,
height: 300,
child: HtmlElementView(viewType: 'iframe'));
}
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.