I have used InAppWebView plugin to load webview. It works fine in android and iOS. But in flutter web app, it throws error as plugin not supported.
Kindly suggest some solution or an plugin that works fine in all platforms.
InAppWebview or Webview isn't supported in Flutter Web.
Check this package out: https://pub.dev/packages/webviewx
This is an example:
import 'package:flutter/material.dart';
import 'package:webviewx/webviewx.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key}) : super(key: key);
#override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
return const Scaffold(
body: WebViewX(
initialContent: "https://flutter.dev/",
width: double.maxFinite,
height: double.maxFinite,
),
);
}
}
Related
When I restart this code in Visual Studio autofocus is working as well as keyboard is showing. When I close the visual studio and re open the app in android emulator the keyboard is not showing but auto focus is working (Cursor is showing).
But its work in android 5 perfectly.
My code:
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: TextField(
autofocus: true,
)
),
);
}
}
Can anyone fix this? Thank you.
Try the following code:
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(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
final FocusNode focusNode = FocusNode();
#override
void initState() {
super.initState();
focusNode.requestFocus();
}
#override
void dispose() {
focusNode.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(widget.title),
),
body: Center(
child: TextField(
focusNode: focusNode,
autofocus: true,
),
),
);
}
}
I have made a new file in my views folder but whenever I turn on the emulator and run the code, it just says "Hello World".
Is there a way I can set the starting point of the project to be on this new file? Because it only seems to turn on the main.dart file.
This is the code that is in the views file called home_page.dart . It is supposed to just say "Hi" 10 times.
import 'package:flutter/material.dart';
import '../models/post.dart';
class HomePage extends StatefulWidget {
const HomePage({Key? key}) : super(key: key);
#override
_HomePageState createState() => _HomePageState();
}
class _HomePageState extends State<HomePage> {
List<Post>? posts;
var isLoaded = false;
#override
void initState() {
super.initState();
//fetch data from API
getData();
}
getData() async {
// posts = await
}
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: const Text('Posts'),
),
body: ListView.builder(
itemCount: 10,
itemBuilder: (context, index) {
return Container(
child: Text('Hi'),
);
},
)
);
}
}
in flutter the main.dart file is the first file
import 'package:flutter/material.dart';
import 'package:get/get_navigation/src/root/get_material_app.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'Flutter Demo Home Page'),//add your home page here
);
}
}
i am having problems with my first flutter project, i want to insert a linear gauge on the screen with syncfusion but it gives me this error
A value of type 'Widget' can't be assigned to a variable of type 'InheritedWidget'.
how can i fix it?
this is what i have so far
import 'package:flutter/material.dart';
import 'package:syncfusion_flutter_gauges/gauges.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'MyApp',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'MyApp'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
#override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child:SfLinearGauge()
)
)
);
}
and in pubspec.yaml i have added in dependencies
syncfusion_flutter_gauges: ^19.1.65
As #Peter Koltai commented, you don't need another MaterialApp
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'MyApp',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: const MyHomePage(title: 'MyApp'),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
#override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: SfLinearGauge(),
),
);
}
}
I had the same problem and solved it by changing the NDK version.
android/app/build.gradle
Before:
ndkVersion flutter.ndkVersion
After:
ndkVersion "23.1.7779620"
Got that hint from
ould not get unknown property 'ndkVersion' for extension 'flutter' of type FlutterExtension
If that does not help, maybe changing SDK version in pubspec.yaml helps
environment:
sdk: ">=2.16.2 <3.0.0"
Dont forget to flutter clean and flutter pub get afterwards
Very trivial problem.
Super simple code.
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
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 ListView(
children: [
Container(color: Colors.red, height: 1000),
Container(color: Colors.blue, height: 1000),
],
);
}
}
It keeps snapping to the item instead of scrolling organically; any ideas?
There seems to be a scrollbug bug with Flutter + iOS Simulator 14.4.
Logged a bug with Flutter here:
https://github.com/flutter/flutter/issues/79641
My App is a Flutter WEB app.
This is the plugin I am using to display some HTML coming from the server:
https://pub.dev/packages/web_browser
Here is the code I am using:
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}',
),
My screen looks like below:
I would like to rid of the address bar and bottom bar but not sure how. Can someone help please?
You can copy paste run full code below
You can use attribute interactionSettings and set WebBrowserInteractionSettings's topBar and bottomBar to SizedBox.shrink()
code snippet
return WebBrowser(
initialUrl: 'https://dart.dev/',
interactionSettings: WebBrowserInteractionSettings(
topBar: SizedBox.shrink(), bottomBar: SizedBox.shrink()));
working demo
full code
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()),
);
}
}