I have a WebView wrapped in a GestureDetector like below.
GestureDetector(
behavior: HitTestBehavior.translucent,
onHorizontalDragEnd: (dragEndDetails) {
if (dragEndDetails.primaryVelocity! < 0) {
// Something happens
} else if (dragEndDetails.primaryVelocity! > 0) {
// Something else happens
}
},
child: Center(
child: WebView(
initialUrl: "example.com",
onWebViewCreated: (WebViewController webViewController) {
// Whatever
},
);,
),
)
Is there a way so that events in both the GestureDetector and the child will be triggered instead of in the GestureDetector only ?
For instance, if I remove the onHorizontalDragEnd handler, the user can resize an image in the underlying webView but that's not the case if the handler is present.
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()
)
],
),
This is the code I have written for my home screen of the app. There is not any error but when I run the program, it just stops on the indicator. The screen doesn't go forward to the entire code and screen. I don't know what happened there.
Widget build(BuildContext context) {
return Scaffold(
appBar: CustomAppBar(
title: '',
),
body: BlocBuilder<SwipeBloc, SwipeState>(
builder: (context, state) {
if (state is SwipeLoading) {
return Center(
child: CircularProgressIndicator(),
);
} else if (state is SwipeLoaded) {
var userCount = state.users.length;
return Column(
children: [
InkWell(
onDoubleTap: () {
Navigator.pushNamed(context, '/users',
arguments: state.users[0]);
},
child: Draggable<User>(
data: state.users[0],
child: UserCard(user: state.users[0]),
feedback: UserCard(user: state.users[0]),
childWhenDragging: (userCount > 1) ?
UserCard(user: state.users[1]): Container(),
onDragEnd: (drag) {
if (drag.velocity.pixelsPerSecond.dx < 0) {
context.read<SwipeBloc>()
..add(SwipeLeft(user: state.users[0]));
print('Swiped left');
} else {
context.read<SwipeBloc>()
..add(SwipeRight(user: state.users[0]));
print('Swiped right');
}
},
),
),
Just able to see this screen. This screen doesn't go forward for the entire code.
you forget stop condition in if (state is SwipeLoading).
add some code to change your variable state and call setstate.
you will always loading if you not change variable state
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
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() },
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!