Редактировать
flutter build web
и flutter run -d chrome
все работает нормально.
потому что код веб-интерфейса (webui.dart)
и код мобильного интерфейса (mobileui.dart)
находятся в разных файлах дротиков,
, поэтому эти два файла могут иметь разные import
Вы можете скопировать и вставить команду 3 из трех файлов ниже main.dart
, webui.dart
и mobileui.dart
Вы можете использовать conditional import
для разделения разных орудий для сети и мобильных устройств
, чтобы у Интернета и мобильных устройств были совершенно разные логики c
вызов фрагмента кода с префиксом multiPlatform
import 'mobileui.dart' if (dart.library.html) 'webui.dart' as multiPlatform;
...
home: multiPlatform.TestPlugin(),
рабочая демонстрация при использовании Android Studio
запуск с Android Emulator
и Chrome
main.dart
import 'package:flutter/material.dart';
import 'mobileui.dart' if (dart.library.html) 'webui.dart' as multiPlatform;
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: multiPlatform.TestPlugin(),
);
}
}
mobileui.dart
import 'package:flutter/material.dart';
class TestPlugin extends StatefulWidget {
@override
_TestPluginState createState() => _TestPluginState();
}
class _TestPluginState extends State<TestPlugin> {
@override
Widget build(BuildContext context) {
return Text("Mobile");
}
}
webui.dart
import 'package:flutter/material.dart';
import 'dart:html' as html;
import 'dart:js' as js;
import 'dart:ui' as ui;
class TestPlugin extends StatefulWidget {
TestPlugin();
_TestPluginState createState() => _TestPluginState();
}
class _TestPluginState extends State<TestPlugin> {
String createdViewId = 'map_element';
@override
void initState() {
// ignore: undefined_prefixed_name
ui.platformViewRegistry.registerViewFactory(
createdViewId,
(int viewId) => html.IFrameElement()
..width = MediaQuery.of(context).size.width.toString() //'800'
..height = MediaQuery.of(context).size.height.toString() //'400'
..srcdoc = """<!DOCTYPE html><html>
<head><title>Page Title</title></head><body><h1>This is a Heading</h1><p>This is a paragraph.</p></body></html>"""
/*..src = "http://f12apidev32.umc.com/Tableau/jsapi_practice.aspx"*/
..style.border = 'none');
super.initState();
}
@override
void dispose() {
super.dispose();
}
@override
Widget build(BuildContext context) {
return Container(
padding: EdgeInsets.symmetric(horizontal: 10),
decoration: BoxDecoration(
color: Colors.white,
border: Border.all(color: Colors.grey[300], width: 1),
borderRadius: BorderRadius.all(Radius.circular(5))),
width: 200,
height: 200,
child: Directionality(
textDirection: TextDirection.ltr,
child: HtmlElementView(
viewType: createdViewId,
)));
}
}