用flutter_html_view打开大成的cdsn的web网页详细操作

用flutter_html_view访问cdsn的web网页

1.源代码

用flutter_html_view打开大成的cdsn的web网页详细操作_第1张图片

2.main.dart

import 'dart:html';

import 'package:flutter_web_ui/ui.dart' as ui;

import 'package:flutter_web/material.dart';

void main() {
  ui.platformViewRegistry.registerViewFactory(
      'hello-world-html',
      (int viewId) => IFrameElement()
        ..width = '640'
        ..height = '360'
        ..src = 'https://blog.csdn.net/keny88888'
        ..style.border = 'none');

  runApp(Directionality(
    textDirection: TextDirection.ltr,
    child: SizedBox(
      width: 640,
      height: 360,
      child: HtmlElementView(viewType: 'hello-world-html'),
    ),
  ));
}

3. web/main.dart

import 'package:flutter_web_ui/ui.dart' as ui;
import 'package:flutter_web.examples.html_platform_view/main.dart'
    as app;

main() async {
  await ui.webOnlyInitializePlatform();
  app.main();
}

4.pubspec.yaml

name: flutter_web.examples.html_platform_view

environment:
  # You must be using Flutter >=1.5.0 or Dart >=2.3.0
  sdk: '>=2.3.0-dev.0.1 <3.0.0'

dependencies:
  flutter_web: any
  flutter_web_ui: any

dev_dependencies:
  build_runner: ^1.4.0
  build_web_compilers: ^2.0.0

dependency_overrides:
  flutter_web:
    path: ../../packages/flutter_web
  flutter_web_ui:
    path: ../../packages/flutter_web_ui

5.运行为

put get 获取依赖包

webdev serve 启动web服务

运行记录为:

 webdev serve
[INFO] Building new asset graph completed, took 1.4s
[INFO] Checking for unexpected pre-existing outputs. completed, took 1ms
[INFO] Serving `web` on http://127.0.0.1:8080
[INFO] Running build completed, took 20.8s
[INFO] Caching finalized dependency graph completed, took 181ms
[INFO] Succeeded after 21.0s with 558 outputs (3119 actions)

 

6.浏览器打开,目标是打开我的csdn首页https://blog.csdn.net/keny88888,但有区别,不是全屏的页面

效果为:

用flutter_html_view打开大成的cdsn的web网页详细操作_第2张图片


 

 

 

 

 

 

 

你可能感兴趣的:(Flutter实践大全)