I'm trying to use SmartLook in my Flutter project. I use the latest flutter_smartlook package. Here is my code according to their documentation:
void main() => runApp(const MyApp());
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);
#override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
#override
void initState() {
super.initState();
final SetupOptions options = (SetupOptionsBuilder('*******')
..Fps = 10
..StartNewSession = true)
.build();
Smartlook.setupAndStartRecording(options);
}
#override
Widget build(BuildContext context) {
return SmartlookHelperWidget(
child: MaterialApp(
title: 'My App',
theme: ThemeData(
fontFamily: 'OpenSans',
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
debugShowCheckedModeBanner: false,
navigatorKey: Global.navigatorKey,
initialRoute: AppRouter.main,
onGenerateRoute: AppRouter.onGenerateRoute,
onGenerateInitialRoutes: AppRouter.onGenerateInitialRoutes,
),
);
}
}
The problem is that in recordings, only the first page is visible (with very poor quality / not bad fps but just poor quality). I should mention that my first page contains a GoogleMap widget from google_maps_flutter package which fill almost two third of the entire screen. In the recordings, you can see that one third of the screen which whenever user opens a new page, that part gets updates. So I think it has something with Google maps widget but I'm not sure.
Related
I am building a flutter app which simply views website URL. but I press back instead of navigating back it exists the app. I searched for solutions but no solution helped me. or that code doesn't support with latest flutter...
Here is my code
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.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'),
);
}
}
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 WebView(
initialUrl: 'https://flutter.dev',
);
}
}
This is happening because you are not coming from any page.
This is how currently your structure is following...
main() ===> MyApp() ===> MyHomePage(title: 'Flutter Demo Home Page') ===> "your-web-vide-page".
so if you would like to work back button then there has to be any page from the page you are going to like...
Navigator.push(context, MaterialPageRoute(builder: (context) {
return //<=== your-page-here
},));
You need to handle this manually.
Create a webView Controller first:
final Completer<WebViewController _controller =
Completer<WebViewController ();
and then create actions in the appBar, and add buttons to handle back and forward actions.
so on back button you would call:
controller.goBack();
and forward:
controller.goForward();
to handle the back button on android device you need to wrap your scaffold with willpopscop and then handle the case inside onWillPop function.
I followed the tutorial of adding a splash screen in an app in flutter using rive animation tool, but the splash screen won't show up.
Link which i followed:- https://pub.dev/packages/rive_splash_screen
Code in main.dart file
import 'package:flutter/material.dart';
import 'package:rive_splash_screen/rive_splash_screen.dart';
import 'package:rive/rive.dart';
import 'dart:ui';
void main() {
runApp(const MyApp());
}
class MyApp extends StatefulWidget {
const MyApp({Key? key}) : super(key: key);
#override
State<MyApp> createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: SplashScreen.navigate(
name: 'assets/doublersplashscreen.riv',
next: (_) => const MyHomePage(),
until: () => Future.delayed(const Duration(seconds: 5)),
startAnimation: 'Splash',
),
);
}
}
class MyHomePage extends StatelessWidget {
const MyHomePage({Key? key}) : super(key: key);
#override
Widget build(BuildContext context) {
return Container(
color: Colors.red,
height: 400,
width: 300,
);
}
}
Code in pubspec.yaml file
Code in pubspec.yaml file
I have used your code and a sample rive's community-made animation to reproduce the issue. But I could not, and everything worked as expected. So please check the following steps:
1- Be sure that your animation path is added correctly to pubspec.yaml:
pubspec.yaml
flutter:
uses-material-design: true
assets:
- assets/
2- Be sure that the riv file's path is written accurately in the SplashScreen.navigate widget. Check if there is an uppercase in the provided path.
home: SplashScreen.navigate(
name: 'assets/alarm.riv',
next: (_) => const MyHomePage(title: 'Demo App'),
until: () => Future.delayed(const Duration(seconds: 5)),
startAnimation: 'bell',
),
3- Lastly, even if this can not be causing this problem, be sure that you are providing the correct animation name. If you don't, animation will show up but won't animate as expected.
Check the following repository on Github.
If you have further problems, please don't hesitate to write in the comments.
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,
),
);
}
}
I working on a prototype Flutter app, I have a use case where I should be able to capture all the OS Hotkey events and prevent the default behaviour.
I should be able to prevent the app from closing on CMD+Q.
any help would be appreciated, thanks in advance.
Update:
I used RawKeyboardLintener to watch on the keyboard event it captures the events when the app is in focus, but on cmd+tab or cmd+q the OS takes over and the app loses its focus or it gets closed.
I didn't find any material to capture it or prevent it from happening.
Code block
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
void main() => runApp(new MyApp());
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return new MaterialApp(
title: 'Flutter Demo',
theme: new ThemeData(
primarySwatch: Colors.blue,
),
home: new MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
#override
_MyHomePageState createState() => new _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
return new Scaffold(
appBar: AppBar(
title: new Text(widget.title),
),
body: RawKeyboardListener(
focusNode: FocusNode(),
onKey: (RawKeyEvent event) {
if (event.runtimeType.toString() == 'RawKeyDownEvent') print(event);
},
autofocus: true,
child: new Container(
child: Text("hello"),
),
),
);
}
}
Flutter has no ability to handle events that never reach the Flutter view. If you want to handle events for which the OS uses a different delivery path you'd need to do it in native code (the same way it would be done in a non-Flutter macOS application).
i created a basic app to use mapbox with flutter_maps package, i get a blank screen..
i connected a mobile phone, i didn't use the emulator...
i removed my private access token for obvious reasons...
thanks in advance...
import 'package:flutter/material.dart';
import 'package:flutter_map/flutter_map.dart';
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 {
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
#override
Widget build(BuildContext context) {
return Scaffold(
body: FlutterMap(
options: MapOptions(minZoom: 10.0),
layers: [
TileLayerOptions(
urlTemplate:"https://api.mapbox.com/styles/v1/hazem-saeed/ck9b1uisj0oht1iplyruetv9q/wmts?access_token=access_token",
additionalOptions: {
'accessToken':"access_token",
'id': 'mapbox.mapbox-streets-v7'
}
)
]
)
);
}
}
Correct urlTemplate is
https://api.mapbox.com/styles/v1/{id}/tiles/{z}/{x}/{y}?access_token={accessToken}
WMTS is not supported in fluttter_map
I had a similar situation. But looking closer I realized that the blank screen was the map drawn with a lot of zoom in the ocean. So I zoomed out and the map appeared.