I need to integrate Jitsi Meet in webview for our flutter application. Initially I used the following jitsi-meet plugin "https://pub.dev/packages/jitsi_meet" but unfortunately had to switch to InAppwebview plugin "https://pub.dev/packages/flutter_inappwebview" because of missing features such as jitsi reconnection after internet drop and participant information in jitsi-meet plugin. I have successfully integrated the jitsi in webview but have no idea how to include jitsi callbacks like onConferenceJoined, onParticipantLeft etc. Any help would be much appreciated
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_inappwebview/flutter_inappwebview.dart';
import 'package:permission_handler/permission_handler.dart';
Future main() async {
WidgetsFlutterBinding.ensureInitialized();
await Permission.camera.request();
await Permission.microphone.request();
runApp(MyApp());
}
class MyApp extends StatefulWidget {
#override
_MyAppState createState() => new _MyAppState();
}
class _MyAppState extends State<MyApp> {
#override
Widget build(BuildContext context) {
return MaterialApp(home: InAppWebViewPage());
}
}
class InAppWebViewPage extends StatefulWidget {
#override
_InAppWebViewPageState createState() => new _InAppWebViewPageState();
}
class _InAppWebViewPageState extends State<InAppWebViewPage> {
InAppWebViewController _webViewController;
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("InAppWebView")),
body: Container(
child: Column(children: <Widget>[
Expanded(
child: Container(
child: InAppWebView(
initialUrl: "https://meet.jit.si/hello",
initialOptions: InAppWebViewGroupOptions(
crossPlatform: InAppWebViewOptions(
mediaPlaybackRequiresUserGesture: false,
debuggingEnabled: true,
),
),
onWebViewCreated: (InAppWebViewController controller) {
_webViewController = controller;
},
androidOnPermissionRequest:
(InAppWebViewController controller, String origin,
List<String> resources) async {
return PermissionRequestResponse(
resources: resources,
action: PermissionRequestResponseAction.GRANT);
}),
),
),
])));
}
}
Sorry to say, but you can't access such features through webview, because when you access thorough webview it's similar to open the site on the browser as a user. You can use Jitsi SDK or plugins which allow you to modify the settings.
Suggestion: Use the jitsi meet plugin which you had used before it already has such features as which you want:
onConferenceWillJoin Meeting is loading.
onConferenceJoined User has joined meeting.
onConferenceTerminated User has exited the conference.
onPictureInPictureWillEnter User entered PIP mode.
onPictureInPictureTerminated User exited PIP mode.
onError Error has occurred with listening to meeting events.
But there is no feature for participant information. But you can achieve this all by hosting your own jitsi server, which would allow you to either customize it or directly have such settings on your custom domain so that on the app you can simply access through webview.
I have used this plugin for a long time and made an app published on the play store. Check that out do you something similar to that? app name Just Meet. If you want like that then I can help you out with my repo.
Maybe you can use socket.io to communicate between the app and webview.
Related
TLDR; I added a custom page transition, sliding to the left. It works perfectly for every page in the App except the Welcome screen which contains only a video player. After the video ends, I get transferred to the desired page but the normal 'transition animation' happens instead of my custom one.
More info: I use Navigator.pushNamed(context, '/pagename') for my page travels. I created a custom transition, CustomPageRoute, which did not support named navigation. After a few searches I made it work and now supports both the cleanness of named navigation plus the transition animations plus the data transferring from page to page. All expect the welcome screen which just plays a video then after 3 seconds it pushes the Login page. Here is the code of the Welcome Page:
import 'package:flutter/material.dart';
import 'package:video_player/video_player.dart';
class WelcomePage extends StatefulWidget {
const WelcomePage({Key? key}) : super(key: key);
#override
State<WelcomePage> createState() => _WelcomePageState();
}
class _WelcomePageState extends State<WelcomePage> {
late VideoPlayerController _controller;
#override
void initState() {
super.initState();
_controller = VideoPlayerController.asset('assets/welcome_vid.mp4')
..initialize().then((_) {
setState(() {});
})
..setVolume(0.0);
_playVideo();
}
void _playVideo() async {
_controller.play();
await Future.delayed(const Duration(seconds: 3))
.then((_) => Navigator.pushNamed(context, '/login'));
}
#override
void dispose() {
_controller.dispose();
super.dispose();
}
#override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
body: Center(
child: _controller.value.isInitialized
? AspectRatio(
aspectRatio: _controller.value.aspectRatio,
child: VideoPlayer(
_controller,
),
)
: Container(),
));
}
}
Also, here is a sample of the named routes I use in main.dart:
static Route onGenerateRoute(RouteSettings settings) {
switch (settings.name) {
case '/login':
return CustomPageRoute(child: LoginPage(), settings: settings);
Also, Flutter Doctor detected no problems, everything is up to date and I don't think any libraries overlap another. I even tried to change the destination if maybe somehow that affected anything but no.
Why doesn't it work?
I am trying to create a basic alarm app which plays a sound at the given time. For this, I am using the android_alarm_manager plugin. To play the sound, I am using the flutter_ringtone_player plugin
main(List<String> args) async {
WidgetsFlutterBinding.ensureInitialized();
await AndroidAlarmManager.initialize();
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return ChangeNotifierProvider(
...
home: HomeScreen(),
),
);
}
}
class HomeScreen extends StatefulWidget {
#override
_HomeScreenState createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
#override
void initState() {
AndroidAlarmManager.initialize();
super.initState();
}
#override
Widget build(BuildContext context) {
return Scaffold(
...
floatingActionButton: FloatingActionButton(
child: Icon(Icons.alarm),
onPressed: () async {
await AndroidAlarmManager.oneShotAt(
DateTime.now().add(Duration(seconds: 5)),
10,
_fireAlarm,
);
},
),
);
}
}
void _fireAlarm() {
FlutterRingtonePlayer.play(
android: AndroidSounds.notification,
ios: IosSounds.glass,
looping: true, // Android only - API >= 28
volume: 0.1, // Android only - API >= 28
asAlarm: false, // Android only - all APIs
);
print('Alarm fired!');
}
The application runs as intended when it is in foreground. However, when the floatingActionButton is tapped and the app is closed, the app crashes in the background.
I am using flutter version 2.0.6 and the API version of the emulator is 29, which I believe comes with Flutter Android Embedding V2 which means no additional configuration is required according to the documentation (at the bottom).
I have tried looking at resources on the web but I did not have much luck.
Yes, It will shut down, it suppose to shut down. Flutter has what we call isolates. It is basically running the alarm process in another memory that will not depend on the main activity memory. Google workmanager, isolates for background task..
I have a problem in intergrating a simple GoogleMap in my Flutter App.
I correctly inserted the API Key in my Manifest file and inserted the library in the app.
But the emulator is just showing a blank page. I am doing nothing special until now; just trying to create a GoogleMap.
This is the Code i am using in the App:
return Stack(
children: <Widget>[
GoogleMap(initialCameraPosition: CameraPosition(target:
LatLng(-33.870840,151.206286),
zoom: 12)
)
], );
What the emulator is showing:
The first lines in the console(which i think are of special meaning):
E/flutter ( 5736): [ERROR:flutter/lib/ui/ui_dart_state.cc(157)] Unhandled Exception: PlatformException(error, java.lang.IllegalStateException: Trying to create a platform view of unregistered type: plugins.flutter.io/google_maps
I tried several workarounds but only ended up with more errors. Looking Forward to your answers!
I tried to add Google Map in a fresh project and was able to see it on emulator successfully. I followed this article step by step and used your code snippet to show the map and it worked.
Complete code used:
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
void main() => runApp(MyApp());
class MyApp extends StatefulWidget {
#override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
Completer<GoogleMapController> _controller = Completer();
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: Text('Maps Sample App'),
backgroundColor: Colors.green[700],
),
body: Stack(
children: <Widget>[
GoogleMap(initialCameraPosition: CameraPosition(target:
LatLng(-33.870840,151.206286),
zoom: 12)
)
],
)
),
);
}
}
Couple of points to note:
Double check if the api is enabled (Maps SDK for Android) when you generated key for it.
Do flutter clean once you cross-check to confirm you've latest dependencies.
Hope this helps.
I want to disable logging of Firebase Analytics in a Flutter project when the app is being run on Firebase Test Lab. According to Firebase docs, TestLab can be detected by adding the following in MainActivity.java
String testLabSetting = Settings.System.getString(getContentResolver(), "firebase.test.lab");
if ("true".equals(testLabSetting)) {
// Do something when running in Test Lab
// ...
}
How can I access the result of this test on the dart side in main.dart which is where I want to disable logging (as there are some other reasons logging is disabled already in the dart code).
Thanks!
I just found this. I didn't try it yet though:
https://pub.dev/packages/flutter_runtime_env
This project allows you to check if you're running in the Firebase
Test Labs
You can use it like their example:
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_runtime_env/flutter_runtime_env.dart';
void main() => runApp(MyApp());
class MyApp extends StatefulWidget {
#override
_MyAppState createState() => _MyAppState();
}
class _MyAppState extends State<MyApp> {
bool _shouldBeEnabled = false;
#override
void initState() {
super.initState();
initPlatformState();
}
// Platform messages are asynchronous, so we initialize in an async method.
Future<void> initPlatformState() async {
var result = await shouldEnableAnalytics();
setState(() {
_shouldBeEnabled = result;
});
}
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('Should Enable Analytics'),
),
body: Center(
child: Text('Should Analytics be Enabled: $_shouldBeEnabled\n'),
),
),
);
}
}
EDIT:
I think I found a better solution.
https://pub.dev/packages/flutter_sentry
It has the follow method
/// Return `true` if running under Firebase Test Lab (includes pre-launch
/// report environment) on Android, `false` otherwise.
static Future<bool> isFirebaseTestLab() async
It seems to be the best solution so far...
EDIT 2:
Fuck it! I just created a small plugin.
https://pub.dev/packages/is_firebase_test_lab_activated
I am using flutter_webview_plugin: ^0.3.8 but I have the same problem with webview_flutter: ^0.3.13.
In webview, I want to make use of a website which triggers a file download on successful completion of a captcha. However, I complete the captcha and nothing happens, no download.
Is there something in Flutter like a webview download listener ("webview.setDownloadListener")? I only need this for Android.
If not, is there a way of downloading files from a webview in Flutter?
A similar issue can be found here!
You can use my plugin flutter_inappwebview, which is a Flutter plugin that allows you to add inline WebViews or open an in-app browser window and has a lot of events, methods, and options to control WebViews. It can recognize downloadable files in both Android (using setDownloadListener) and iOS platforms!
I report here the same answer that I gave to the similar issue:
To be able to recognize downloadable files, you need to set the useOnDownloadStart: true option, and then you can listen the onDownloadStart event!
Also, for example, on Android you need to add write permission inside your AndroidManifest.xml file:
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
Then, you need to ask permission using the permission_handler plugin. Instead, to effectively download your file, you can use the flutter_downloader plugin.
Here is a complete example using http://ovh.net/files/ (in particular, the http://ovh.net/files/1Mio.dat as URL) to test the download:
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:flutter_inappwebview/flutter_inappwebview.dart';
import 'package:flutter_downloader/flutter_downloader.dart';
import 'package:path_provider/path_provider.dart';
import 'package:permission_handler/permission_handler.dart';
Future main() async {
WidgetsFlutterBinding.ensureInitialized();
await FlutterDownloader.initialize(
debug: true // optional: set false to disable printing logs to console
);
await Permission.storage.request();
runApp(new MyApp());
}
class MyApp extends StatefulWidget {
#override
_MyAppState createState() => new _MyAppState();
}
class _MyAppState extends State<MyApp> {
InAppWebViewController webView;
#override
void initState() {
super.initState();
}
#override
void dispose() {
super.dispose();
}
#override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
appBar: AppBar(
title: const Text('InAppWebView Example'),
),
body: Container(
child: Column(children: <Widget>[
Expanded(
child: InAppWebView(
initialUrl: "http://ovh.net/files/1Mio.dat",
initialHeaders: {},
initialOptions: InAppWebViewGroupOptions(
crossPlatform: InAppWebViewOptions(
debuggingEnabled: true,
useOnDownloadStart: true
),
),
onWebViewCreated: (InAppWebViewController controller) {
webView = controller;
},
onLoadStart: (InAppWebViewController controller, String url) {
},
onLoadStop: (InAppWebViewController controller, String url) {
},
onDownloadStart: (controller, url) async {
print("onDownloadStart $url");
final taskId = await FlutterDownloader.enqueue(
url: url,
savedDir: (await getExternalStorageDirectory()).path,
showNotification: true, // show download progress in status bar (for Android)
openFileFromNotification: true, // click on notification to open downloaded file (for Android)
);
},
))
])),
),
);
}
}
Here, as you can see, I'm using also the path_provider plugin to get the folder where I want to save the file.
just add this code to your AndroidManifest.xml
<provider
android:name="vn.hunghd.flutterdownloader.DownloadedFileProvider"
android:authorities="${applicationId}.flutter_downloader.provider"
android:exported="false"
android:grantUriPermissions="true">
<meta-data
android:name="android.support.FILE_PROVIDER_PATHS"
android:resource="#xml/provider_paths"/>
</provider>
and add this code to your AndroidManifest.xml
it works to me
it works for me
require plugin https://pub.dev/packages/url_launcher
add this code to your project to download file from flutter webview
onDownloadStart: (controller, url,) async {
// print("onDownloadStart $url");
final String _url_files = "$url";
void _launchURL_files() async =>
await canLaunch(_url_files) ? await launch(_url_files) : throw 'Could not launch $_url_files';
_launchURL_files();
},