首页 > 解决方案 > 如何摆脱 Flutter 'WebBrowser' 插件中的地址栏和底栏?

问题描述

我的应用是一个 Flutter WEB 应用。这是我用来显示来自服务器的一些 HTML 的插件:

https://pub.dev/packages/web_browser

这是我正在使用的代码:

  WebBrowser( 
initialUrl: 'https://${Provider.of<CP>(context).getPaymentURL()+Provider.of<CP>(context).getPaymentPATH()}?O=${Provider.of<CP>(context).getOrder().orderUID}&Ro=${Provider.of<CP>(context).getOrder().res_key}',

),

我的屏幕如下所示:

在此处输入图像描述

我想摆脱地址栏和底栏,但不知道如何。有人可以帮忙吗?

标签: flutterflutter-layoutflutter-dependenciesflutter-web

解决方案


您可以在下面复制粘贴运行完整代码
您可以使用属性interactionSettings和设置WebBrowserInteractionSettingstopBarbottomBarSizedBox.shrink()

代码片段

return WebBrowser(
        initialUrl: 'https://dart.dev/',
        interactionSettings: WebBrowserInteractionSettings(
            topBar: SizedBox.shrink(), bottomBar: SizedBox.shrink()));

工作演示

在此处输入图像描述

完整代码

import 'package:flutter/material.dart';
import 'package:web_browser/web_browser.dart';

class MyWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return WebBrowser(
        initialUrl: 'https://dart.dev/',
        interactionSettings: WebBrowserInteractionSettings(
            topBar: SizedBox.shrink(), bottomBar: SizedBox.shrink()));
  }
}

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return SafeArea(
      child: Scaffold(
          appBar: AppBar(
            title: Text("Demo"),
          ),
          body: MyWidget()),
    );
  }
}

推荐阅读