【flutter】完美解決導入 dart.ui 中缺少 platformViewRegistry.registerViewFactory 方法

邂逅

很多情景需要使用

package:flutter_web_ui/ui.dart

或者

dart:ui

，比如顯示一個網頁：

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

ui.platformViewRegistry.registerViewFactory(
        'maphtml',
            (int viewId) => IFrameElement()
          ..allowFullscreen=true
          ..height = '360'
          ..src = 'https://hornhuang.github.io'+_params
          ..style.border = 'none');           

複制

運作一下，很不幸收到一朵大紅花：

戰勝

原因是

'dart:ui'

這個庫是

web-only

的，也就是說我們隻能在

flutter_web

上用它 ？但是如果在

iOS/android

上也想用怎麼辦？挑戰一下：

• 這裡我們先建立一個

  dart

  檔案：

  FakeUi.dart

// ignore: camel_case_types
class platformViewRegistry {
  static registerViewFactory(String viewId, dynamic cb) {}
}           

複制

• 然後再建立一個

  dart

  檔案：

  RealUi.dart

import 'dart:ui' as ui;

// ignore: camel_case_types
class platformViewRegistry {
  static registerViewFactory(String viewId, dynamic cb) {
    // ignore:undefined_prefixed_name
    ui.platformViewRegistry.registerViewFactory(viewId, cb);
  }
}           

複制

• 以後當我們想使用

  'dart:ui'

  裡的内容時，直接通過

  FakeUi.dart

  就可以啦

import 'FakeUi.dart' if (dart.library.html) 'RealUi.dart' as ui;           

複制