是否可以在 Flutter Web iframe 中禁用 Esc 键、单击并启用悬停?

问题描述 投票:0回答:2

我正在我的 flutter web 应用程序中显示 iframe/url。在此 iframe 中,我只想启用悬停并禁用转义键和单击事件。这可以做到吗?

以下是显示 iframe 的完整代码

// ignore: avoid_web_libraries_in_flutter
import 'dart:html';
import 'dart:ui' as ui;
import 'dart:js' as js;
import 'package:flutter/material.dart';

class IframeExp extends StatefulWidget {
  final String url;

  const IframeExp({super.key, required this.url});
  @override
  State<IframeExp> createState() => _IframeExpState();
}

class _IframeExpState extends State<IframeExp> {
  final IFrameElement _iFrameElement = IFrameElement();

  @override
  void initState() {
    _iFrameElement.style.height = '100%';
    _iFrameElement.style.width = '100%';
    _iFrameElement.src = widget.url;
    _iFrameElement.style.border = 'none';

// ignore: undefined_prefixed_name
    ui.platformViewRegistry.registerViewFactory(
      'iframeElement',
      (int viewId) => _iFrameElement,
    );

    _iFrameElement.onKeyPress.listen((event) {
      print("[Escape]${event.charCode} ${String.fromCharCode(event.charCode)}");
    });
    _iFrameElement.onClick.listen((event) {
      print("[Escape] ${event}");
    });

    window.onKeyPress.listen((KeyboardEvent e) {
      print("[Escape] ${e.charCode} ${String.fromCharCode(e.charCode)}");
    });

    super.initState();
  }

  final Widget _iframeWidget = HtmlElementView(
    viewType: 'iframeElement',
    key: UniqueKey(),
  );

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          SizedBox(
            height: MediaQuery.of(context).size.height / 2,
            width: MediaQuery.of(context).size.width,
            child: _iframeWidget,
          )
        ],
      ),
    );
  }

  void disableEscapeKey() {}

  @override
  void didChangeDependencies() {
    super.didChangeDependencies();
  }
}

在这个iframe中,我想实现以下行为:

Enable only hover events.
Disable the escape key.
Disable click events.

我尝试在 IFrameElement 上使用 onKeyPress 和 onClick 事件,但它似乎并不能阻止转义键或单击事件。此外,我还附加了一个通用 window.onKeyPress 事件侦听器,但它不会捕获 iframe 内的事件。

有没有办法在 Flutter Web 的 iframe 中实现这些特定的事件处理要求?

flutter iframe
2个回答
0
投票

是的 有可能 你可以随时随地改变


0
投票

是的,这是可能的。 您可以使用“RawKeyboardListerner”小部件来捕获键盘事件并相应地调整 iframe 的属性

© www.soinside.com 2019 - 2024. All rights reserved.