1

我有这个想要滑入的视图:

Ext.define('GS.view.AddBidView', {
extend: 'Ext.Panel',
    config: {   
        xtype: 'panel',
        modal: true,
        width: '100%',
        height: '50%', 
        bottom: '0%',
        hideOnMaskTap: true,
        items: [{
            xtype: 'textareafield',
            name: 'bio',        
            clearIcon: false,
            id: 'textarea',
            placeHolder: 'Ange ditt bud här...'
        },
        {
            xtype:'button',
            text: 'Lägg bud',
            docked:'bottom',
            maxWidth: '95%',
            minHeight: '45px',
            cls: 'saveBidBtn'
        }]
    },
    initialize: function() {
        this.down('#textarea').on('keyup', this.grow, this);
        this.textarea = this.element.down('textarea');
        this.textarea.dom.style['overflow'] = 'hidden';
    },

    grow: function() {
        this.textarea.setHeight(this.textarea.dom.scrollHeight); // scrollHeight is height of all the content
        this.getScrollable().getScroller().scrollToEnd();
    }
});

它由此控制器呈现:

Ext.define('GS.controller.ShowModal', {
    extend : 'Ext.app.Controller',    
    config : {   
        control : {
            'button[action="showBidModal"]' : {
                tap : 'showModal'
            },
        }
    },
    showModal : function() {
        var addBidPanel = Ext.create('GS.view.AddBidView');
        Ext.Viewport.add(addBidPanel);
    }
});

如何通过向上/向下滑动或类似的方式设置动画?尝试了一堆东西,但似乎没有任何效果。

感谢所有帮助!

4

1 回答 1

4

一种方法是默认隐藏模式:

hidden: true

然后,您可以将showAnimationhideAnimation应用于具有指定动画的模态,例如:showhide

showAnimation: {
    type: 'slideIn',
    duration: 1000,
    direction: 'down'
}, 

hideAnimation: {
    type: 'slideOut',
    duration: 1000,
    direction: 'up'
},  

这是一个工作小提琴:http ://www.senchafiddle.com/#6tN6b

于 2013-02-13T05:55:38.723 回答