Extjs iPad sencha touch 2上的可滚动文本区域

我想制作一个全屏（或部分屏幕）文本区域，用户可以在iPad上滚动

类似于Notes.app：有一个屏幕/面板可以包含大量文本，并且可以滚动

如果你点击它，你可以编辑文本。

是否有合适的组件或解决方法

---



谢谢

据我所知，Sencha Touch中的TextArea没有这个“可滚动”属性

在我的应用程序中，我使用了一种变通方法，覆盖了TextArea组件，下面是代码：

Ext.define('Ext.overrides.TextArea', {
            override: 'Ext.form.TextArea',
            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() {
                // cleanup event listeners to avoid memory leak
                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;
                // default (mobile safari) action when dragging past the top or bottom of a scrollable
                // textarea is to scroll the containing div, so prevent that.
                if((top && up) || (bottom && down))    e.preventDefault();
                // Sencha disables textarea scrolling on iOS by default,
                // so stop propagating the event to delegate to iOS.
                if(!(top && bottom))    e.stopPropagation();
            }
        });

Ext.define（'Ext.overrides.TextArea'{
重写：“Ext.form.TextArea”，
初始化：函数（）{
这是callParent（）；
this.element.dom.addEventListener(
Ext.feature.has.Touch？'touchstart'：'mousedown'，
this.handleTouchListener=Ext.bind（this.handleTouch，this），
假）；
this.element.dom.addEventListener(
Ext.feature.has.Touch？'touchmove'：'mousemove'，
this.handleMoveListener=Ext.bind（this.handleMove，this），
假）；
this.moveListenersAttached=true；
},
销毁：函数（）{
//清理事件侦听器以避免内存泄漏
如果（此.moveListenersAttached）{
this.moveListenersAttached=false；
this.element.dom.removeEventListener(
Ext.feature.has.Touch？'touchstart'：'mousedown'，
这是handleTouchListener，
假）；
this.element.dom.removeEventListener(
Ext.feature.has.Touch？'touchmove'：'mousemove'，
这是handleMoveListener，
假）；
this.handleTouchListener=this.handleMoveListener=null；
};
这是callParent（）；
},
手触式：功能（e）{
this.lastY=e.pageY；
},
handleMove:函数（e）{
var textArea=e.target；
var top=textArea.scrollTop=textArea.scrollHeight；
var up=e.pageY>this.lastY；
var down=e.pageY

非常感谢！它对我有用。顺便问一下，你知道当文本区域没有焦点且没有打开键盘时，我如何滚动文本区域吗？对不起，我不知道这是否可行。