Flutter, WebView empty page using Provider

Question

I have Provider on top of MyApp, and the webview is still opening with a blank screen. No errors, no suggestions it just opening with a blank screen and not loading. If i put a web address in the url is working fine but i want to have this dynamic.

runApp(
    Provider<Events>.value(
      value: Events(),
      child: MyApp(),
    ),
  );

class Events {
  final String imagePath, site;

Events({
  this.imagePath, this.site
});

final events = [
  castel,
  lake,
];

import 'package:flutter/material.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:provider/provider.dart';
import '../model/events.dart';
import './flutter_web.dart';

class Site extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    final events = Provider.of<Events>(context);

    return Container(
      padding: const EdgeInsets.all(4.0),
      child: Container(
        child: IconButton(
          onPressed: () => Navigator.of(context).push(
            MaterialPageRoute(
              builder: (context) => FlutterWeb(events.site),
            ),
          ),
          icon: Icon(
            FontAwesomeIcons.internetExplorer,
            size: 30.0,
            color: Colors.lightBlue,
          ),
        ),
      ),
    );
  }
}

return WebView(
          initialUrl: events.site,
        )

What is definition of MyApp, FlutterWeb

Dev
– Dev

2020-03-06 05:25:56 +00:00
Commented Mar 6, 2020 at 5:25 — Dev
– Dev, Commented Mar 6, 2020 at 5:25

chunhunghan · Accepted Answer · 2020-03-06 05:40:16Z

1

You can copy paste run full code below
In value attribute, you need to pass variable not class
In your code snippet events is array it might be a typo

code snippet

void main() {
  final events = Events(imagePath: "castel", site: "https://flutter.dev/");

  runApp(
    Provider<Events>.value(
      value: events,
      child: MyApp(),
    ),
  );
}

working demo

full code

import 'package:flutter/material.dart';
import 'package:provider/provider.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:webview_flutter/webview_flutter.dart';

class Events {
  final String imagePath, site;

  Events({this.imagePath, this.site});
}

void main() {
  final events = Events(imagePath: "castel", site: "https://flutter.dev/");

  runApp(
    Provider<Events>.value(
      value: events,
      child: MyApp(),
    ),
  );
}

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

class Site extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    var events = Provider.of<Events>(context);

    return Scaffold(
      body: Center(
        child: Container(
          padding: const EdgeInsets.all(4.0),
          child: Container(
            child: IconButton(
              onPressed: () => Navigator.of(context).push(
                MaterialPageRoute(
                  builder: (context) => FlutterWeb(events.site),
                ),
              ),
              icon: Icon(
                FontAwesomeIcons.internetExplorer,
                size: 30.0,
                color: Colors.lightBlue,
              ),
            ),
          ),
        ),
      ),
    );
  }
}

class FlutterWeb extends StatelessWidget {
  String site;
  FlutterWeb(this.site);

  @override
  Widget build(BuildContext context) {
    return WebView(
      initialUrl: site,
    );
  }
}

edited Mar 6, 2020 at 5:40

answered Mar 6, 2020 at 5:34

chunhunghan

54.7k5 gold badges123 silver badges132 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

blueprint Over a year ago

i don't want to put final events under void main(), i have already decleared in my model/events.dart, there is a list of 30 site paths

blueprint Over a year ago

what about if I want to add to Navigator => FlutterWeb(events.site) the imagePath?

chunhunghan Over a year ago

question 1, you can directly final events = Events()

chunhunghan Over a year ago

questions 2, if you events has 30 elements. you can do Navigator => FlutterWeb(events[index]) to pass Event item directly. and use it with WebView( initialUrl: event.site, )

blueprint Over a year ago

i've tried with MapBox(events[index]) but i have error: "The operator '[]' isn't defined for the class 'Events'

|

Collectives™ on Stack Overflow

Flutter, WebView empty page using Provider

1 Answer 1

6 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

6 Comments

Your Answer

Sign up or log in

Post as a guest

Related