[TIMOB-8831] BlackBerry: Implement important Titanium.UI.ScrollableView functionality

GitHub Issue	n/a
Type	New Feature
Priority	High
Status	Closed
Resolution	Fixed
Resolution Date	2013-05-06T05:42:20.000+0000
Affected Version/s	n/a
Fix Version/s	2013 Sprint 09 BB, 2013 Sprint 09, Release 3.1.2, Release 3.2.0
Components	BlackBerry
Labels	notable, qe-closed-3.2.0, qe-testadded
Reporter	Francois Boisvert
Assignee	Pedro Enrique
Created	2012-04-20T11:28:09.000+0000
Updated	2013-12-20T00:53:25.000+0000

Description

As a developer, I want a view that allows displaying a set of child views that can be navigated through by using swipe gestures. The existing Titanium API for this view is Ti.UI.ScrollableView. While Cascades does not provide a built-in control for this type of view, it does appear possible to implement our own custom control.

Comments

Tatyana Petrenko 2012-09-12

There is no such thing in Cascades support. This should likely be removed from the Beta scope.
Pedro Enrique 2013-04-25

Pull request https://github.com/appcelerator/titanium_mobile_blackberry/pull/31

Pedro Enrique 2013-12-10

Test code:

   var win = Ti.UI.createWindow();
   
   var views = [];
   for(var i = 0; i < 11; i++) {
     var view = Ti.UI.createView({
       backgroundColor: '#'+((1<<24)*(Math.random()+1)|0).toString(16).substr(1)
     });
     views.push(view);
   }
   //
   var otherView = Ti.UI.createView({
     backgroundColor: 'red'
   });;
   
   views.push(otherView);
   
   var scrollableView = Ti.UI.createScrollableView({
     currentPage: 4,
     views: views,
     top: 0,
     width: 200,
     height: 112
   });
   
   var scrollToAnimated = Ti.UI.createButton({
     title: 'scroll animated',
     bottom: 40,
     right: 0
   });
   
   var scrollToNotAnimated = Ti.UI.createButton({
     title: 'scroll',
     bottom: 40,
     left: 0
   });
   
   var prev = Ti.UI.createButton({
     bottom: 0,
     left:0,
     title: 'prev'
   });
   var next = Ti.UI.createButton({
     bottom: 0,
     right:0,
     title: 'next'
   });
   var x = 0;
   
   prev.addEventListener('click', function(){
     scrollableView.movePrevious();
   });
   next.addEventListener('click', function(){
     scrollableView.moveNext();
   });
   
   scrollToAnimated.addEventListener('click', function(){
     scrollableView.scrollToView(otherView, true);
   });
   
   scrollToNotAnimated.addEventListener('click', function(){
     scrollableView.scrollToView(2, false);
   });
   win.add(prev);
   win.add(next);
   win.add(scrollToAnimated);
   win.add(scrollToNotAnimated);
   win.add(scrollableView);
   
   win.open();

Olga Romero 2013-12-10

Tested the above code with: Appcelerator Studio, build: 3.2.0.201312091648 Titanium SDK, build: 3.2.0.v20131210112451 CLI 3.2.0- cr Alloy 1.3.0-cr BB Z10 10.1.0.2019 Verified scroll, scroll animated.

JSON Source