Fixing header (navbar) in webview flutter-CodePudding

I am currently working on a project where I need to convert a website to a mobile app using flutter I did it with the widget WEBVIEW but the header of the webview in my mobile is not fixed when i scroll the page the header (navBar) of my website scroll too but i want it to be fixed even if i scroll the page this is my code :

import 'dart:async';
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';


class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);

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

class _HomePageState extends State<HomePage> with TickerProviderStateMixin{

  final Completer<WebViewController> _controller =
  Completer<WebViewController>();

  late WebViewController _webViewController;


  @override
  Widget build(BuildContext context) {
    String hexString = "1b5c80";
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Welcome to Flutter',
      home: Scaffold(
        body: WebView(
          initialUrl: "https://www.journaldunet.fr/web-tech/dictionnaire-du-webmastering/1203251-blog-definition-et-acteurs/",
          javascriptMode: JavascriptMode.unrestricted,
          onWebViewCreated: (WebViewController webViewController) {
            _webViewController = webViewController;
            _controller.complete(webViewController);
            },
          onPageFinished: (String url) {
            _webViewController.evaluateJavascript("javascript:(function() { "  
                "var footer = document.getElementsByTagName('footer')[0];"  
                "footer.parentNode.removeChild(footer);"  
                "})()");
            },
          gestureNavigationEnabled: true,
        ),
      ),
    );
  }

  JavascriptChannel _toasterJavascriptChannel(BuildContext context) {
    return JavascriptChannel(
        name: 'Toaster',
        onMessageReceived: (JavascriptMessage message) {
          // ignore: deprecated_member_use
          Scaffold.of(context).showSnackBar(
            SnackBar(content: Text(message.message)),
          );
        });
  }
}

this is my mobiel app :

CodePudding user response：

If you build build own AppBar in Flutter then it will be Fix according to you. But If header came from Webview then you can not control this... Because Webview is only view of your website inside your flutter app...

CodePudding user response：

Wrap your Scaffold with SafeArea.

SafeArea(
  child: Scaffold