6

I am implementing a webapp using jQuery Mobile and Phonegap. One thing I am missing, is the following: The App should scroll to the top when the statusbar is tapped.

I have already seen that using Objective C one has to indicate the view that has to scroll to top on tap. Is it possible to do something similar with Javascript/Phonegap?

Chagemei
  • 286
  • 6
  • 14
  • 1
    The status bar is not part of the App. Phonegap can't register any clicks on it. Without writing your own plugin anyway. – Jivings May 23 '12 at 07:12
  • Thanks for your reply. That was clear to me. But I am unsure if it is possible over all to write such a plugin, since I would have to indicate in that plugin which view to scroll. And all my views are not Objective C types, but html. – Chagemei May 23 '12 at 07:51
  • You're right, I don't think it is possible :( – Jivings May 23 '12 at 07:51

3 Answers3

7

Update for 22.9.2016

It's working fine

Plugin ID has changed, install it using:

cordova plugin add cordova-plugin-statusbar

Tested with cordova-6.3.1 cordova-ios-4.2.2 in the iOS 10.0 simulator and an iPhone 6s Plus running 9.3.5.

The official status-bar plugin has this feature. https://github.com/apache/cordova-plugin-statusbar

Install:

cordova plugin add org.apache.cordova.statusbar

In your javascript:

window.addEventListener('statusTap', function() {
    //scroll-up or do whatever you want
});
guya
  • 5,067
  • 1
  • 35
  • 28
  • Are you sure about this? I can't see it in the docs for this plugin. – Yaron Aug 09 '15 at 13:58
  • Yep, it's working great. It's not in the docs, I found it in the code: (line 102) https://github.com/apache/cordova-plugin-statusbar/blob/master/www/statusbar.js – guya Aug 10 '15 at 16:12
4

I wrote a plugin to solve this issue

https://github.com/j-mcnally/cordova-statusTap

you can register tap events on the status bar and handle this all in code. With an event listener.

j_mcnally
  • 6,928
  • 2
  • 31
  • 46
0

if the content that you are displaying in the phonegap app is bigger then the bounds of the webview, the scroll happens automatically.

Otherwise - for example if you are just scrolling a div using -webkit-overflow-scrolling - you need to use the solution found here: How to detect touches in status bar

In the scrollViewShouldScrollToTop you need to call

[theWebView stringByEvaluatingJavaScriptFromString:"should_scroll_to_top"];

should_scroll_to_top is a normal function in your js.

Community
  • 1
  • 1
memical
  • 2,353
  • 1
  • 24
  • 36
  • Yes, I am using fixed toolbars within PhoneGap. Thus the content of my webview is not bigger than the webview itself. Since I am not really familiar with Obj C I only understand parts of this, but it sounds as if it could be a solution. Am I right that in theory I would have to do the things as decribed: Explicitly create a hidden ScrollView in PhoneGap and apply the other stuff mentioned there. But: At the end of this solution is said, that it only works if there is no other view that reacts to these events. And as far as I understand, the webview is reacting to it. Does it still work? – Chagemei Jun 01 '12 at 09:23
  • i am using this solution in one of my apps. since my content is, like yours, not bigger then the webview, i have disabled the webview from receiving the events. and it works. my js function checks which page is current and hnows which divs it has that are scrollable. – memical Jun 01 '12 at 12:00