sencha touch textarea 手機上不顯示滾動條，且不能滾動

最近在項目中發現 sencha touch 中的 textarea 在手機上不顯示滾動條，也不能滾動。

在瀏覽器中之所以能顯示滾動條滾動，那是瀏覽器為 textarea 添加的滾動條。 但在手機中是不會顯示滾動條的。 可能在以后的版本中會有所改進吧。

於是只能另想辦法了，找了一個老外重寫的可滑動的 textarea （無滾動條）。

轉：

Ext.define('LeslieTest.view.TextArea',
{
    extend : 'Ext.field.TextArea',
    xtype : 'scrollTextArea',
    
    initialize : function() {
        this.callParent();
        this.element.dom.addEventListener(
                Ext.feature.has.Touch ? 'touchstart'
                        : 'mousedown',
                this.handleTouchListener = Ext.bind(
                        this.handleTouch, this), false);
        this.element.dom.addEventListener(
                Ext.feature.has.Touch ? 'touchmove'
                        : 'mousemove',
                this.handleMoveListener = Ext.bind(
                        this.handleMove, this), false);
        this.moveListenersAttached = true;
    },
    
    destroy : function() {
        if (this.moveListenersAttached) {
            this.moveListenersAttached = false;
            this.element.dom.removeEventListener(
                    Ext.feature.has.Touch ? 'touchstart'
                            : 'mousedown',
                    this.handleTouchListener, false);
            this.element.dom.removeEventListener(
                    Ext.feature.has.Touch ? 'touchmove'
                            : 'mousemove',
                    this.handleMoveListener, false);
            this.handleTouchListener = this.handleMoveListener = null;
        }
        this.callParent();
    },
    
    handleTouch : function(e) {
        this.lastY = e.pageY;
    },
    
    handleMove : function(e) {
        var textArea = e.target;
        var top = textArea.scrollTop <= 0;
        var bottom = textArea.scrollTop + textArea.clientHeight >= textArea.scrollHeight;
        var up = e.pageY > this.lastY;
        var down = e.pageY < this.lastY;
        this.lastY = e.pageY;

        if ((top && up) || (bottom && down))
            e.preventDefault();

        if (!(top && bottom))
            e.stopPropagation();
    }
});