Use own menu bar in customized Cordova InAppBrowser Plugin - ios

I have a Cordova iOS app that uses the Cordova InAppBrowser plugin. The InAppBrowser has been modified natively so that a menu bar is displayed as a header above the InAppBrowser, so that various other functionalities can be used (e.g. a drawing/screenshot function). To fulfill this requirement, the InAppBrowser plugin was forked and adapted: In addition to the standard parameters of the InAppBrowser plugin you can add offsets to our customized InAppBrowser to avoid filling the whole display and to have the possibility to show the above mentioned menu bar in the empty area.
This worked successfully for years with the following versions:
Cordova: 6.5.0
Cordova-iOS: 4.5.2
InAppBrowser Plugin: 1.6.1
After upgrading to the latest Cordova Framework we currently have the following versions in use:
Cordova: 10.0.0
Cordova-iOS: 6.1.1
InAppBrowser Plugin: 4.0.0
The InAppBrowser Plugin is forked in the same way as the old version, so that a menu bar can be displayed at the top. This seems to work optically correct respectively as before. But if you click on our navigation bar now, it doesn't react. So it looks like the plugin or the WkWebView makes an invisible glass pane over the navigation bar. You don't see this "glass pane" in the DOM elements, so it is likely that this happens somehow natively. For example, if you make a URL with "toolbar=yes", you have the possibility to close the InAppBrowser and only then, you have access to the navigation bar behind it and you can use the menu elements. There are also several parameters in the InAppBrowser plugin, which can be passed when opening a URL (e.g. PresentationStyle), but they don't have any effect.
Who had this problem and could solve it? How?

Related

Hide spinner on iOS Cordova inAppBrowser

When running InAppBrowser in iOS device and when I click on some LINK, then some spinner shows up, before the web loads. But on android inAppBrowser it does not.
How can I hide this spinner on iOS device?
I have been searching for solution, but nothing found yet.
Is there some inappbrowser option for hidding spinner?
There is an option in the InAppBrowser called hidespinner
hidespinner: Set to yes or no to change the visibility of the loading indicator (defaults to no).
More info can be found here: https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-inappbrowser/

How to immediately show an instance of InAppBrowser, when a controller loads, without the Ionic app becoming unresponsive?

I am using Ionic 1.2.4. I am immediately showing an InAppBrowser (https://github.com/apache/cordova-plugin-inappbrowser) via an Angular controller. I have also setup the controller to respond to taps on the page by again showing an InAppBrowser.
The initial appearance of the InAppBrowser works correctly. However, once the user taps "Done" and then taps on the revealed page, the subsequent InAppBrowser is not displayed. In addition to this it appears that the app stops responding to further gestures (the page is setup to display the number of touch gestures it has detected).
I have confirmed that there is no issue with the code that presents the InAppBrowser on taps by testing without the immediate InAppBrowser display. This results in an app where the user can indefinitely display and dismiss the InAppBrowser (and where the number of touches is correctly displayed on the page).
I have a demo of the issue here: https://github.com/ryanggrey/cordova-plugin-inappbrowser-issue. This shows all my code and dependency versions (see package.json and bower.json). touch.js is where all the above mentioned code can be found.
I'm guessing I've either found a bug in cordova-plugin-inappbrowser, or I'm using the API incorrectly. Any suggestions would be greatly appreciated!
I guess the problem is due to the inappbrowser plugin added from Cordova as some some code are missing in it. Remove the plugin and try adding it from
-
cordova plugin add https://git-wip-us.apache.org/repos/asf/cordova-plugin-inappbrowser.git
Hope it will work.

iPhone/iPad Status bar overlapping on app's header

I am using worklight 6.2 Consumer Edition on WAS Liberty Profile 8.5.5.1 Server. I am using jQuery Mobile 1.4.2 to develop UI. When I install app on iPhone/iPad, status bar of phone is hiding some part of my app's header.
How can I fix this issue (if its an issue)?
This works fine in a default new app with jQuery Mobile that was generated by Worklight Studio. As you can see, the status does not overlap the text.
You can also take a look at the Worklight Starter with jQuery Mobile edition, that also works on iOS w/out the status bar covering the top of app. Compare your CSS.
You need to provide a screen shot of what you're seeing, as well as provide a sample application where you are experiencing it. This issue originates from your code. Provide code.
One possible solution would be to add some margin-top to whichever element is at the top of your applicaiton's HTML.

JQuery Mobile Label on Loading screen

I am using JQuery Mobile version 1.1.1
I have a loading image with as a splash screen.
I need to add a version label to it but I do now know if this is possible or not.
Has anyone ever done this?

navbar phonegap plugin

I would like to add a navigation bar at the top of "some" of my phonegap based ios application pages. I have tried using JQM based headers and they don't seem to be steady enough ( i.e. they scroll when I scroll the content and jump back). I would like to use a native control using a phonegap plugin ( like NativeControls) However I haven't been able to find anything ( as far as I can tell NativeControls used to have navbar control but it got discontinued) Any ideas? suggestions?
One of the options is to use a tool bar control on the top of the page but then it does not really have a way to create a title in the middle and buttons on left and right. Also it has no way of adding the native "back" control either.
I have been researching it for a while but haven't been able to find anything.
Update:
I ended up writing my own Navbar and hooking it to a javascript call through phonegap
Checkout this edited plugin for UINavigationbar
https://groups.google.com/forum/?fromgroups#!topic/phonegap/XVru2zgB_yc
I've had this problem too. Didn't find any plugins for this also.
This is what I did:
I've created a CSS NavBar/TopBar with position:fixed
Used this solution to make it work on iOS 4 too: Fix position:fixed in iOS 4

Resources