添加滾動視圖和管道到鼠標的視圖

Question

我想添加一個視圖到（水平）滾動視圖和管道到MouseSync。滾動工作在曲面上，但不在視圖上。

使用鼠標滾動對於曲面工作良好，但對於添加到滾動視圖的TestView完全忽略。

我main.js看起來是這樣的：

define(function(require, exports, module) { 
    var Engine   = require('famous/core/Engine'); 
    var Surface   = require('famous/core/Surface'); 
    var Scrollview  = require('famous/views/Scrollview'); 
    var SequentialLayout = require('famous/views/SequentialLayout'); 
    var MouseSync   = require('famous/inputs/MouseSync'); 
    var TestView = require('TestView'); 

    var context = Engine.createContext(); 

    var scrollview = new Scrollview({ 
     direction:0, 
     friction:0.001, 
     drag:0.001 
    }); 

    var cells = []; 
    scrollview.sequenceFrom(cells); 

    var mouse = new MouseSync({direction:0}); 
    var sequence = new SequentialLayout({ direction:0 }); 
    var surfaces = []; 
    sequence.sequenceFrom(surfaces); 

    var surface1 = new Surface({ 
     size: [200,undefined], 
     content: '<div>I am surface 1</div>', 
     properties: { 
      backgroundColor: 'red' 
     } 
    }); 

    var surface2 = new Surface({ 
     size: [200,undefined], 
     content: '<div>I am surface 2</div>', 
     properties: { 
      backgroundColor: 'green' 
     } 
    }); 

    var testview = new TestView({size: [200, undefined]}); 

    surface1.pipe(mouse); 
    surface2.pipe(mouse); 
    testview.pipe(mouse); 

    surface1.pipe(scrollview); 
    surface2.pipe(scrollview); 
    testview.pipe(scrollview); 

    surfaces.push(surface1); 
    surfaces.push(testview); 
    surfaces.push(surface2); 

    mouse.pipe(scrollview); 
    cells.push(sequence); 
    context.add(scrollview);  
}); 

而且TestView這樣的：

define(function(require, exports, module) { 
    var View = require('famous/core/View'); 
    var Surface = require('famous/core/Surface'); 

    function TestView(size){ 
     View.apply(this,arguments); 
     this.mainNode = this.add(this.rootModifier); 
     _createBackground.call(this, size); 
    } 

    TestView.prototype = Object.create(View.prototype); 
    TestView.prototype.constructor = TestView; 


    function _createBackground(size){ 
     var background = new Surface({ 
      size: size.size, 
      content: 'testview', 
      properties: { 
       backgroundColor: '#444' 
      } 
     }); 
     this.mainNode.add(background); 
    } 
    module.exports = TestView; 
}); 

難道我總得要管從視圖父滾動視圖？

任何幫助，非常感謝。

Answer 1

我相信它是作爲TestView的背景表面輸送至_eventOutput處理意見那麼簡單..

試試這個你_createBackground功能..

function _createBackground(size){ 
    var background = new Surface({ 
     size: size.size, 
     content: 'testview', 
     properties: { 
      backgroundColor: '#444' 
     } 
    }); 

    // Add this line 
    background.pipe(this._eventOutput); 

    this.mainNode.add(background); 
} 

希望這有助於！