I am writing an application for iPad using phonegap (Simple application using HTML5 and jQuery). The problem is the application window is draggable, as seen in image when I drag window down it comes down and when I leave window it goes up automatically. I don't want this behavior.
Try to set the UIWebViewBounce to NO in your file Cordova.plist.
Check this link: How to prevent app running in phone-gap from scrolling vertically?
Note: with this solution, you may disable the "landscape mode" of your app.
Hope this helps, let me know if this works for you mate
Related
I've used Vuejs and Framework7 in my PWA. I want to open a remote PDF file in my PWA and also it's important to me that users be able to back to my PWA after opening PDF. I did this using :
window.open(pdf_url, "_blank");
And it works fine for iOS > 12 and after opening pdf file there is an "OK" button for closing pdf.
But for example in iOS 11.3 there is no button and user has to use home button to close PWA.
I tried to solve problem using iframe but I can show only first page of the pdf.
Is there any way to fix this issue?
You can resolve this issue by doing some tricks (for any device without back button):
if you use iframe, you can set height manualy with overflow scroll, and I think this will resolve issue (dependence of style or lib dependency, so that may be not work).
you can add back button to your navbar, or Toolbar to let user click on it to back to previous page. (I prefer this solution).
you can render pdf in popup nested of normal html page, and then you can customize popup component by handling back button, or handling close by dropback overlay.
I use second and third point in real project and its work fine...
This is sample close button code used in popup:
'<p>'+ i18nextHelper.i18next.t('Exit From PDF') +'</p>'
Note: You can also customize height page for pdf page only, and add normal button bellow it, or by add absolute positioning button above PDF, but I think if you use second or third point will be best.
Good luck.
I have a Cordova (version 6.3.1) app. This issue only occurs on iOS version of the app (Android works fine). Every time i press on a text box to insert a text after doing some scrolling, it jumps straight back to the top. After some investigating, I found out that
DisallowOverscroll=true
in cordovas "config.xml" only works on the main screen of the app, not if I go and click on a "modal" "KompressionStromper" in the video (it does not work inside there), so how can I enable it inside there? So the behaviour is not like in video?
Please see video here on iOS 10.0.2 (during the first seconds i also try to pull at the main screen from top to bottom but there the "DisallowOverscroll" option works as expected).
Any other suggestions and help will be highly appreciated.
For the specific element you can disable overscroll with jQuery.
Like:
element.ontouchmove = (event) => {
event.preventDefault();
}
I strongly suggest that you also create a directive out of it, so it will be more done in a "angular way".
My application is an overlay (alwaysOnTop) for a full screen game and when the user clicks on my overlay it takes focus and shows the taskbar on top of their game as well. Taking focus is fine, but I can't have the taskbar show.
It says in the BrowserWindow docs:
not a toolbox window which can not be focused on
Implying that it is possible to create a window which cannot be focused on.
Does anyone know how to create a toolbox window, or to simply avoid having the taskbar showing when clicking on the electron window?
I should mention I've tried setAlwaysOnTop and skipTaskbar. I also have transparent: true and frame: false.
The overlay I've created is the "Safelane, Midlane, Offlane" buttons. When I run the application it shows on top of the full screen app (Dota 2) like this:
After clicking on the interface the taskbar appears. It would be fine that the full screen app (Dota) loses focus, the task bar appears on top which breaks the continuity of the experience:
I would like the experience to stay like the first image--when the user clicks on anything in my overlay, the taskbar should not show.
Electron GitHub Issue
Additional Solution Info -- After using Gaafar's solution below
Setting kiosk: true in the setup does not seem to allow it to render transparent. Using setKiosk(true) within a setTimeout after the window has been opened seemed to work.
I also found that any windows using kiosk or fullscreen with transparency had rendering issue. It would render multiple times on top of itself and could not unrender items (display: none in css would do nothing). The way I fixed this was by using Electron Window Manager creating a single kiosk window with nothing in it and creating other non-kiosk windows with the HTML / CSS interfaces. The result:
All of the interfaces can be interacted with, mouse and keyboard.
Rendering happens as it does regularly in electron.
The fullscreen application below receives input through any transparent areas.
Taskbar never shows up on any input.
skipTaskbar: true is to prevent showing your app in the taskbar.
To hide the taskbar altogether use fullscreen or kiosk mode instead
fullscreen: true
or
kiosk: true
EDIT:
There are some issues open where fullscreen or kiosk modes prevent the transparency of the window.
A solution that works for me is to run with these flags --enable-transparent-visuals --disable-gpu
issue & solution: https://github.com/electron/electron/issues/2170#issuecomment-145942717
showInActive();
set your BrowserWindows, focusable: false
Im gonna post a solution some might be facing with full screening, I was facing this issue and wandering here and there, this StackOverflow post kept coming up.
So Im posting it here so people getting similar problems can get help.
When fullscreening taskbar getting in way.
When you fullscreen using mainWindow.setFullScreen(true) taskbar will get in way when you are on home (all windows minimized) in windows.
Here is the solution:
ipcMain.on("fullscreenon",()=>{
mainWindow.setAlwaysOnTop(true, 'screen-saver');
mainWindow.setFullScreen(true);
})
//The order of the commands is important below
//don't setAlwaysOnTop() before getting out of fullscreen.
ipcMain.on("fullscreenoff",()=>{
mainWindow.setFullScreen(false);
mainWindow.setAlwaysOnTop(true, 'floating')
})
Basically, by default setFullscreen uses the level: "floating". We need a higher level, "screen-saver" is the highest level I think.
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.
I am using J2ME, Lwuit and Blackberry api for developing my app.
My form contains textbox as well as toolbar. While touching the textbox, the virtual keyboard appears and then disappears. This is happening due to the toolbar. Even if I remove the toolbar, the textbox remains beneath the virtual keyboard instead of scrolling up.
Issue is happening for the touch phones, for which we have to use touch screen.
I want the textbox to scroll up to the appropriate level to make it convenient for user.
Did anybody faced the same issue! Please share the solution.
There is a bug in LWUIT in that specific feature. It might have been fixed in Codename One but I'm not sure.
Did you know that you need a different UI lib for Blackberry touch development? If you don't import this specific lib you can find foreign issues. You must import a lib called UI_RIM_Touch.jar, if you generate this project with the Resource editor, you can find this file in the root of your project. Try this.