I have been trying to mimic the behavior of the android browser with the scrolling of the address bar on top of the WebView. If you notice, if the user scrolls down, the address bar "moves" up with the WebView (but the WebView doesn't scroll). Only when the address bar disappears completely the WebView starts to scroll. At first I tried to override the onScrollChanged method of WebView, and got something but it wasn't as smooth as the desired goal. I noticed in the docs that WebView inherits from AbsoluteLayout, so I was wondering if it's possible to add a View programmatically on top the "browser" in the WebView and by that achieve the desired scrolling effect?
EDIT
Ok so after poking around in the source code of the native browser app, I found out that there is an hidden method for that called setEmbeddedTitleBar(View v)
And here is the description (from the Android source):
/**Add or remove a title bar to be embedded into the WebView, and scroll
* along with it vertically, while remaining in view horizontally. Pass
* null to remove the title bar from the WebView, and return to drawing
* the WebView normally without translating to account for the title bar.
* #hide*/
Do you know how I can hack my way to use this ?
You could probably still use reflection to access it. See:
Using Reflection for Backward Compatibility for Android (Android Developers)
Calling a Method Using Reflection (StackOverflow)
As far as I can see this method is public. So you can use it I think.
I've just looked through its implementation. It just calls addView() method of WebView object. So if you don't want to use hidden method you can reimplement this method.
Related
I want to use the quick return pattern which is described here:
http://www.androiduipatterns.com/2012/08/an-emerging-ui-pattern-quick-return.html
When i use a webview this webview must have the fullscreen height of the device to implement it correctly. Then i have to inject a paddingTop to the body tag on the html in the webview to get the correct margin/padding from top. But there is a problem if the toolbar isnt shown and the site loads new content with javascript which cant scroll. First there is a ugly white area on the top off the webview and second the toolbar cant get shown because the site cant scroll.
Is there any best practice for this behaviour?
Is the javascript injection the correct way?
I have an activity with a WebView. I would like to give the possibility to the user to scroll from one WebView to another WebView (as it's done to Android desktop):
with something in the bottom which shows which screen is actually viewed. I have think about the ScrollView but maybe something else exists which easier to use.
what you want to use is the ViewPager
http://android-developers.blogspot.de/2011/08/horizontal-view-swiping-with-viewpager.html
To get an indicator which shows on what page the user is use:
http://jakewharton.com/viewpagerindicator/
An example how to use it is here:
http://blog.stylingandroid.com/archives/537
I am looking to create a navigation or menu bar similar to the functionality of the one at the top of the Fox News app. I started to code this myself using a Gallery but I'm not sure how to hide the left and right arrows when they are not needed. I was also wandering if you would have to use images for the menu items or if you could just use TextView or buttons so I could change the text without having to modify an image. I have seen this type of navigation on several apps and I tried all types of searches trying to find code examples but I must not be using the correct name for this type of scrollable menu because I couldn't find anything. If anyone has an example or provide a link to an article I would greatly appreciate it.
Look into HorizontalScrollView. It is a Layout that will handle the smooth scrolling and is likely to be much less of a hassle to work with than Gallery for this operation (I just added one for a similar reason).
To handle the left/right, look into setOnTouchListener. I'm not sure if you can get the current scroll position without making a new child class of HorizontalScrollView to access protected methods. There may be other ways, however - I didn't need to add buttons so I didn't investigate.
I'm trying to mimic the default android Browser app layout, which has a "search_bar" on top and then a "webview" right below it. The user can scroll both items up, all the while the scroll bar only appears to the right of the webview (not both the webview and the search bar).
I've tried putting both the webview and the searchbar into a scrollview, but this shows the scrollbar next to the search_bar.
If you need to mimic the exact layout of default browser have a look at it's source code:
Where can I find Android source code online?
If you need only browser source have a look here:
https://android.googlesource.com/platform/packages/apps/Browser
From what I can see (a quick look at it) it is more complicated layout, but you may start analysing it from:
Browser\res\layout\browser_subwindow.xml
which directly includes WebView. This file is directly loaded by Tab... Go ahaed and analyse it on your own it is pretty simple as it is a regular Android application.
Hope it helps.
I am writing a PhoneGap app on Android. I am trying to stay pure HTML+CSS+JS, without calling specific PhoneGap APIs. So the app is somewhat an embedded web page, more or less.
The page has some "buttons" on it, which are actually table cells with some CSS attributes (among which cursor: pointer) and an onClick function.
I have noticed that when I touch a button, it "flashes" for a second or so, then its corresponding action is performed. By the way, I don't like this very much, since it causes a delay in the UI.
Some of the "buttons" activate a menu. I handle the menu by making visible a semi-opaque black div that covers the whole screen, and above it a centered div containing a table containing the menu items. (the black div and the centered div are hidden, normally).
The problem is that when I touch a menu item, it does not flash; one of the underlying buttons flashes instead (that is, one of those that at the moment are covered by the semi-opaque black div, and are supposed to be inactive). Nevertheless, the correct action is performed, in other words the onClick function of the menu item gets called, not the one of the flashing button .
So my question is two-fold:
1) Is there a simple way to make the right item flash (I mean the menu item instead of the underlying, semi-covered button)?
2) Is there a simple way to totally disable button flashing, so that the UI would speed-up and problem 1 be solved too?
Many thanks
You should be using the touch events, which are supported on Android WebKit. This will prevent the select + touch behaviour that you're seeing on your HTML elements that the onClick event causes.
Android versions past Android 1.5 support touch events such as touchstart and touchend. I recommend using them, and reading Apple's documentation (yes, I know it's weird, but Google's Web App documentation is still poor with respect to touchevents.)