EXTJS4自学手册——图形行为（rotate,scale）

一、旋转图像：

{
                    xtype: 'button',
                    text: '旋转的字',
                    handler: function (btn) {
                        Ext.create('Ext.window.Window', {
                            layout: 'fit',
                            items: Ext.create('Ext.draw.Component', {
                                viewBox: false,//是否随window一起改变大小，false（不改变）
                                items: [{
                                    type: 'text',//画字
                                    text: 'Hello World',//要写的内容
                                    fill: '#2266FF',//填充颜色
                                    font: '20px "Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif',//字体
                                    x: 200,//X坐标
                                    y: 200,//Y坐标
                                    rotate: {
                                        degrees: 45//旋转45度
                                    }
                                }]
                            })
                        }).show();
                    }
                }

显示效果：

二、放大缩小图像：

{
                    xtype: 'button',
                    text: '缩放的字',
                    handler: function (btn) {
                        Ext.create('Ext.window.Window', {
                            layout: 'fit',
                            items: Ext.create('Ext.draw.Component', {
                                viewBox: false,//是否随window一起改变大小，false（不改变）
                                items: [{
                                    type: 'text',//画字
                                    text: 'Hello World',//要写的内容
                                    fill: '#2266FF',//填充颜色
                                    font: '20px "Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif',//字体
                                    x: 200,//X坐标
                                    y: 200,//Y坐标
                                    scale: {
                                        x: 2,//X坐标拉长一倍
                                        y: 5//y坐标拉长五倍
                                    }
                                }]
                            })
                        }).show();
                    }
                }

显示效果：