scrollEnd event of ScrollableView inside ScrollableView


It seems that ScrollableView(parent) is catching the ScrollableView(child)'s event. How do I prevent Parent's ScrollableView event from triggering.

Below is not the actual code but it should work the same.

var label1 = Ti.UI.createLabel({ text: "Hello" });
var label2 = Ti.UI.createLabel({ text: "World" });
var childScrollable = Ti.UI.createScrollableView({
    views: [label1, label2]
var parentScrollable = Ti.UI.createScrollableView({
    views: [childScrollable]

parentScrollable.addEventListener("scrollEnd", function(e) {"I should stay in page 0. The current page is: "+e.currentPage);

childScrollable.addEventListener("scrollEnd", function(e) {"Im the child scrollableview and my page is "+e.currentPage);

When I scroll the child scrollableview to page 1 the parent scrollableview is triggered and display result as currentpage to 1.


2 Answers

  • Jason, why in the world would you want to put a scrollable view inside a scrollable view? It is more than normal to behave like this.

    — answered 3 years ago by Dan Tamas
    1 Comment
    • Actually the child scrollableview is rotated 90 deg. because normally scrollable view don't support vertical scrolling. What I'm saying is I'm creating UI which basically swipe left, right, up down.

      — commented 3 years ago by Jason James
  • I currently have the same need. I wish Titanium develops a vertical scrollableview too…
    Jason, a dirty way is to check the source of event.

    parentScrollable.addEventListener("scrollEnd", function(e) {
        if (e.source === parentScrollable) {
      "I should stay in page 0. The current page is: "+e.currentPage);
        } else if (e.source === childScrollable) {
  "Im the child scrollableview and my page is "+e.currentPage);

    I hope it will help.