var store = Ext.create('Ext.data.Store', {

                storeId:'employeeStore',

                fields:['name', 'seniority', 'department'],

                groupField: 'department',

                data: {'employees':[

                    { "name": "Michael Scott",  "seniority": 7, "department": "Management" },

                    { "name": "Dwight Schrute", "seniority": 2, "department": "Sales" },

                    { "name": "Jim Halpert",    "seniority": 3, "department": "Sales" },

                    { "name": "Kevin Malone",   "seniority": 4, "department": "Accounting" },

                    { "name": "Angela Martin",  "seniority": 5, "department": "Accounting" }

                ]},

                proxy: {

                    type: 'memory',

                    reader: {

                        type: 'json',

                        root: 'employees'

                    }

                }

            });

            var myComponent = Ext.create('Ext.grid.Panel', {

                renderTo: Ext.getBody(),

                width: 800,

                height: 500,

                layout: 'fit',

                closable: true,

                //hidden: false,

                store: Ext.data.StoreManager.lookup('employeeStore'),

                columns: [

                    { header: 'Name',  dataIndex: 'name',flex:1},

                    { header: 'Email', dataIndex: 'email'},

                    { header: 'Phone', dataIndex: 'phone'}

                ],

                title: '测试中',

                //style: 'border: 1px solid red;',

                listeners: {

                    beforeclose:function(){

                        myComponent.getEl().slideOut("r", {duration: 500});

                        // 在这里延迟5秒关闭

                        return false;

                    }

                }

            });

            Ext.create('Ext.fx.Anim', {

                target: myComponent,

                duration: 1000,

                from: {

                    width: 1000,

                    height: 800 // 开始宽度 400

                },

                to: {

                    left:200

                    // width

                    // height

                },

                iterations: 1,   //动画次数

                easing: 'backOut', // 中间值

                alternate: true   // 动画反转

            });

           Ext.create('Ext.fx.Animator', {

                target: myComponent,

                duration: 1000, // 10 seconds

                keyframes: {

                    0: {

                        opacity: 1,

                        left: 100

                    },

                    20: {

                        x: 30,

                        left: 150

                    },

                    40: {

                        x: 130,

                        left: 75

                    },

                    60: {

                        y: 80,

                        left: 100

                    },

                    80: {

                        y: 200

                    },

                    100: {

                        opacity: 1,

                        backgroundColor: '00FF00'

                    }

                }

            });