Content clickable underneath scrollview

You must Login before you can answer or comment on any questions.

Is it possible somehow with Titanium to have a scrollview that has its content offset by say 200px from the top, so that you can see another view beneath, this "bottom" view should be clickable. The effect is seen on Path's user view and on Authentic Jobs iPhone app as seen here: http://cl.ly/EOFG.

I have tried adding a transparent view to the top of a scrollview with touch enabled false, but whilst that allows the click through, only as far as the scrollview. I have tried the same on the scrollview itself, but of course it leaves the scrollview unmovable.

I am working only for iOS and 1.8.1 of the SDK.

— asked 1 year ago by Ian Tearle
4 Comments
  • Could you share some code? Something you have done for now.

    — commented 1 year ago by Ivan Škugor

  • This is what I tried: https://gist.github.com/1876215

    — commented 1 year ago by Ian Tearle

  • Some information is missing. Could you strip down that example to something I can work on?

    — commented 1 year ago by Ivan Škugor

  • Show 1 more comment

2 Answers

You can do this by just adding click event on scrollable view. it will listen background click.

— answered 1 year ago by Moiz Chhatriwala
answer permalink
4 Comments
  • Im not sure I follow, how do you listen a background click from the scrollable view? Would you care to show a snippet of code?

    — commented 1 year ago by Ian Tearle

  • scrollableview.addEventListener('click',function(){

    // place your code here

    });

    — commented 1 year ago by Moiz Chhatriwala

  • Ok, but say if I wanted a map view to be usable in the background?

    — commented 1 year ago by Ian Tearle

  • Show 1 more comment

Set "win" layout property to "vertical" or use "zIndex" property on map and search bar.

The thing here is that components overlap when "absolute" layout is used. Component that are added later will be above components that are added before (if they are positioned as you positioned them). Because they overlap, this above component will receive all events and they will not be propagated to below components because they are not in parent-child relationship (they are brothers, so to say :D )

Schematically:

parent

    child1

    child2

"child2" will overlap "child1" (by using "transparent" background, you made that invisible :) ) and will capture all events. All event will be propagated to "parent" and not to "child1" (because that's how things works :) ).

The solution is to position them vertically (so they can't overlap) or to use "zIndex" so that "child1" is positioned above "child2".

Your Answer

Think you can help? Login to answer this question!