Flutter flutter_inappwebview rotate to landscape when the user click the fullscreen video. In the documentation flutter_inappwebview says.
onEnterFullscreen: Event fired when the current page has entered full
screen mode.
onExitFullscreen: Event fired when the current page has exited
full screen mode.
Container(
height: globals.screenHeight * 0.25,
color: Colors.white,
child: Column(children: <Widget>[
Expanded(
child: Container(
margin: const EdgeInsets.all(0.0),
decoration: BoxDecoration(
border: Border.all(color: Colors.blueAccent)),
child: InAppWebView(
initialUrl:
"http://URL/play.html?name=123456789",
initialHeaders: {},
onWebViewCreated: (InAppWebViewController controller) {
webView = controller;
},
onEnterFullscreen: AutoOrientation.landscapeAutoMode(),
onLoadStart:
(InAppWebViewController controller, String url) {
setState(() {
this.url = url;
});
},
onLoadStop: (InAppWebViewController controller,
String url) async {
setState(() {
this.url = url;
});
},
onProgressChanged:
(InAppWebViewController controller, int progress) {
setState(() {
this.progress = progress / 100;
});
},
),
),
),
]
)
),
when the page load, the phone automatic landscape, and i received this error.
what i want is, when the user click the fullscreen, the video automatic landscape
The problem is that onEnterFullscreen is waiting for a (InAppViewController) => void but you are assigning the result of AutoOrientation.landscapeAutoMode().
onEnterFullscreen: AutoOrientation.landscapeAutoMode(),
So, that function is evaluated each time that build method is called. That is the reason why you have those two weird behaviors:
Landscape automatically on load
Exception because types don't match
To solve that, you need to assign the callback in this way:
onEnterFullscreen: (controller) { AutoOrientation.landscapeAutoMode() },
Related
i am new here. Please forgive me if I make a mistake. I'm trying to make a payment screen. But I can't solve a small problem. I couldn't understand the cause of the problem. when i click to 'start payment' button it's show me that screen about 2 second.And it's look bad. Bad View
But good news it's skip automatically normal payment screen. How can I show something else(Circular progress indicator, Lineer progres indicator etc.) on the screen instead of that String? My codes are below;
if (data['Status'] != "failure") {
Navigator.of(context).push(MaterialPageRoute(
builder: ((context) => CoreWebView(
htmlCode: data['paymentUrl'],
))));
}
It's my WebView
WebViewPlus(
initialUrl: "https://example.com",
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (controller) {
//widget.html==data['paymentUrl'];
var page = 'r"""${widget.htmlCode}"""';
controller.loadString(page);
},
zoomEnabled: false,
),
Make your widget a StatefulWidget.
Add a variable as bool isLoading = true;.
Change your code as:
Stack(
children: [
WebViewPlus(
onPageFinished: (url) {
setState(() {
isLoading = false;
});
},
initialUrl: "https://example.com",
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (controller) {
//widget.html==data['paymentUrl'];
var page = 'r"""${widget.htmlCode}"""';
controller.loadString(page);
},
zoomEnabled: false,
),
if(isLoading)
Center(child: CircularProgressIndicator()
)
],
),
I'm new to flutter. Now I am able to take screenshot for my entire desktop app screen using Screenshot package & storing that image to local storage.
But my requirement is to capture the screenshot of entire screen of the window, like if 2 applications are opened(1 Flutter + 1 any other app e.g. browser) in 1 screen, then we can able to take whole screen's screenshot not only flutter app.
Please help me on how to take entire window's screenshot in Windows OS desktop app?
If it's not possible directly from Flutter, then how to achieve this by implementing some native code with Flutter?
check this completely working as expected
bool _isAccessAllowed = false;
CapturedData? _lastCapturedData;
#override
void initState() {
super.initState();
_init();
}
void _init() async {
_isAccessAllowed = await ScreenCapturer.instance.isAccessAllowed();
}
void _handleClickCapture(CaptureMode mode) async {
Directory directory = await getApplicationDocumentsDirectory();
String imageName =
'Screenshot-${DateTime.now().millisecondsSinceEpoch}.png';
String imagePath =
'${directory.path}/screen_capturer_example/Screenshots/$imageName';
_lastCapturedData = await ScreenCapturer.instance.capture(
mode: mode,
imagePath: imagePath,
silent: true,
);
if (_lastCapturedData != null) {
// ignore: avoid_print
// print(_lastCapturedData!.toJson());
} else {
// ignore: avoid_print
print('User canceled capture');
}
setState(() {});
}
Widget _buildBody(BuildContext context) {
return PreferenceList(
children: <Widget>[
if (Platform.isMacOS)
PreferenceListSection(
children: [
PreferenceListItem(
title: const Text('isAccessAllowed'),
accessoryView: Text('$_isAccessAllowed'),
onTap: () async {
bool allowed =
await ScreenCapturer.instance.isAccessAllowed();
BotToast.showText(text: 'allowed: $allowed');
setState(() {
_isAccessAllowed = allowed;
});
},
),
PreferenceListItem(
title: const Text('requestAccess'),
onTap: () async {
await ScreenCapturer.instance.requestAccess();
},
),
],
),
PreferenceListSection(
title: const Text('METHODS'),
children: [
PreferenceListItem(
title: const Text('capture'),
accessoryView: Row(children: [
CupertinoButton(
child: const Text('region'),
onPressed: () {
_handleClickCapture(CaptureMode.region);
},
),
CupertinoButton(
child: const Text('screen'),
onPressed: () {
_handleClickCapture(CaptureMode.screen);
},
),
CupertinoButton(
child: const Text('window'),
onPressed: () {
_handleClickCapture(CaptureMode.window);
},
),
]),
),
],
),
if (_lastCapturedData != null && _lastCapturedData?.imagePath != null)
Container(
margin: const EdgeInsets.only(top: 20),
width: 400,
height: 400,
child: Image.file(
File(_lastCapturedData!.imagePath!),
),
),
],
);
}
// screen shot taken by the App.
You might try using this package: screen_capturer. It works on Windows, Linux and MacOS.
From the docs:
Example of usage:
import 'package:screen_capturer/screen_capturer.dart';
CapturedData? capturedData = await screenCapturer.capture(
mode: CaptureMode.screen, // screen, window
imagePath: '<path>',
);
CaptureMode.screen is to capture the entire screen.
The screenshot package which you mention is only for taking screenshots for widgets of your app not of whole screen.
i am making a house management app i have to upload images of the property alongside other data related to the property so i am using two screens one for the general info about the house and the second one specifically to upload images
Form screen
Image Upload Screen
from the upload screen i am returning back a list of images to the form screen
// i am waiting for the list in the form screen
images = await Navigator.push(context, MaterialPageRoute(builder: (context) => AddPictures()));
// i am returning the list back from the upload screen
Navigator.pop(context,imageStrings);
I am failing to show circular progress indicator for some reason beyond my capacity to know itried all ways i know
this is the rest of the code
//outiside the widdget build i have two lists
List<XFile> imagesXFiles = []; //for raw image files from the gallery or camera
List<String> imageStrings = []; //for image links from the firebase storage
body: isLoading == true ? CircularProgressIndicator() : Column(
children: [
Expanded(
//the first grid is a button to let the user access camera or gallery
child: GridView.builder(
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 3,
crossAxisSpacing: 2.0,
mainAxisSpacing: 2.0
),
itemCount: imagesXFiles.length + 1,
itemBuilder: (BuildContext context, int index) {
return index == 0 ? GestureDetector(
onTap: (){
// a function to pick images and add store them to the list "imagesXFiles"
_showPicker(context);
},
child: Container(
decoration: BoxDecoration(
color: Colors.black12,
borderRadius: BorderRadius.circular(5.0),
),
child: Icon(
Icons.add,
color: Colors.black,
size: 30.0,
),
),
): Container(
child: Image(
image: FileImage(File(imagesXFiles[index-1].path)),
fit: BoxFit.fill
),
);
},
),
),
TextButton(
onPressed: ()async{
// for some reason the circular progress doesn't work i dont understand why
setState(() {
isLoading = true;
});
imageStrings = await uploadImages(imagesXFiles).whenComplete(() {
setState(() {
isLoading = false;
Navigator.pop(context,imageStrings);
});
});
},
child: Text("Upload",style: TextStyle(color: Colors.black,fontSize: 25),)),
],
),
here is the upload function that uploads the images to firebase
Future<List<String>> uploadImages(List<XFile> imagesXFiles) async {
imagesXFiles.forEach((image) async {
final storageRef = storage.ref().child(Random().nextInt(100).toString());
await storageRef.putFile(File(image.path));
String imageURL = await storageRef.getDownloadURL();
imageStrings.add(imageURL);
firebaseFirestore
.collection("housePictures")
.add({
"imageURL" : imageURL,
});
});
return imageStrings;
}
You can use forEach with Future as below.
await Future.forEach(imagesXFiles, (image) async {
final storageRef = storage.ref().child(Random().nextInt(100).toString());
await storageRef.putFile(File(image.path));
String imageURL = await storageRef.getDownloadURL();
imageStrings.add(imageURL);
FirebaseFirestore.instance
.collection("housePictures")
.add({
"imageURL" : imageURL,
});
});
You can’t use forEach statement in an async operation. It is not going to wait. Use a normal for statement. Example: for(var item in items) etc. That should fix your issue. If you really want to use a for each you need to use Future. foreach see this thread -> How to Async/await in List.forEach() in Dart
Please I'm working on a flutter WebView project and I need to reload my page if I click a button but it gave me this Error : Null check operator used on a null value. Thank you in advance
this is my code :
WebView(
initialUrl: "https://wikoget.com",
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (WebViewController webViewController) {
_webViewController = webViewController;
_controller.complete(webViewController);
},
onPageFinished: (String url) {
_webViewController
.evaluateJavascript("javascript:(function() { " +
"var head = document.getElementsByClassName('main-header-bar-wrap')[0];" +
"head.parentNode.style.cssText = ' position: sticky;position: -webkit-sticky; top : 0 ';" +
"var footer = document.getElementsByTagName('footer')[0];" +
"footer.parentNode.removeChild(footer);" +
"})()")
.then((value) => debugPrint('Page finished loading Javascript'));
},
onWebResourceError: (error) => setState(() {
isError = true;
}),
),
if (isError)Center(
child :RaisedButton(
padding: const EdgeInsets.symmetric(vertical: 10,horizontal: 30),
onPressed: ()=> _webViewController.reload(),
color: Color(int.parse("0xff135888")),
shape:const RoundedRectangleBorder(
borderRadius: BorderRadius.all(Radius.circular(30)),
),
child:const Text("Réessayez",style: TextStyle(color:Colors.white),)
),
],
),
),
Although your code is incomplete, here's what you need to make your webview reload easily.
Create a webview controller and initialize it when the webview is created to the controller of the webview:
WebViewController? webViewController;
.
.
.
onWebViewCreated: (controller){
webViewController = controller;
}
reload when your button is pressed:
onPressed: () {
webViewController!.reload();
},
Click here to read more about making your webview work excellently
I am trying to build webview in my mobile application
In the webview when click on search all the records to particular time period are shown it works but when click on Export To Excel button it should download the excel sheet but nothing works in my application..
Below is the code what I have done
Thanks for help!![enter image description here][1]
PS: URL hidden for security reasons..
`
Stack(
children: [
Container(
padding: EdgeInsets.all(10.0),
child: progress < 1.0
? LinearProgressIndicator(
value: progress,
backgroundColor: Colors.amber,
)
: Container()),
WebView(
initialUrl:
"URL",
javascriptMode: JavascriptMode.unrestricted,
gestureNavigationEnabled: true,
onWebViewCreated: (WebViewController controller) {
_webViewController = controller;
},
onProgress: (int progress) {
setState(() {
this.progress = progress / 100;
});
},
onPageFinished: (finish) {
setState(
() {
isLoading = false;
},
);
},
),
],
),
Use navigationDelegate parameter in Webview constructor.
WebView(
initialUrl: 'https://google.com',
navigationDelegate: (action) {
if (action.url.contains('mail.google.com')) {
print('Trying to open Gmail');
Navigator.pop(context); // Close current window
return NavigationDecision.prevent; // Prevent opening url
} else if (action.url.contains('youtube.com')) {
print('Trying to open Youtube');
return NavigationDecision.navigate; // Allow opening url
} else {
return NavigationDecision.navigate; // Default decision
}
},
),
That's it. Enjoy coding!