javascript ExtJS 中的图像
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14072369/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Images in ExtJS
提问by Art F
Does anyone know of a way to rotate an image in ExtJs inside an Ext.Imgcomponent? The code I have right now is:
有谁知道在Ext.Img组件内的 ExtJs 中旋转图像的方法？我现在拥有的代码是：
xtype:'image',
id: 'south_image',
src: '/Home/DefaultImage',
region: 'south',
width: 700,
height: 200
回答by Min
use below code
使用下面的代码
xtype:'image',
id: 'south_image',
src: '/Home/DefaultImage',
region: 'south',
width: 700,
height: 200,
style: {
transform: rotate(45deg),
-ms-transform: rotate(45deg),
-moz-transform: rotate(45deg),
-webkit-transform: rotate(45deg),
-o-transform: rotate(45deg)
}
回答by Avinash T.
Image rotation is possible using css. Set style of your image like
使用 css 可以旋转图像。设置图像的样式，例如
transform:rotate(180deg)
回答by A1rPun
You can rotate a Ext.draw.Componentlike so:
你可以Ext.draw.Component像这样旋转：
Ext.create('Ext.draw.Component', {
renderTo: Ext.getBody(),
id: 'rotateImg',
viewBox: false,
padding: 20,
items: [{
type: 'image',
src: 'http://www.sencha.com/img/apple-touch-icon.png',
width: 200,
height: 200
}]
});
Ext.create('Ext.slider.Single', {
renderTo: Ext.getBody(),
hideLabel: true,
width: 400,
minValue: 0,
maxValue: 360,
value: 0,
listeners: {
change: function (slider, value) {
var sprite = Ext.getCmp('rotateImg').surface.items.first();
sprite.setAttributes({
rotation: {
degrees: value
}
}, true);
}
}
});
回答by VoidMain
AFAIK there is no way to rotate that via ExtJs given that the img is generated dynamically, you can, of course rotate it on your server, that should be something trivial or, fall back to rotate it on canvas and, then add it to your component.
AFAIK 没有办法通过 ExtJs 旋转它，因为 img 是动态生成的，你当然可以在你的服务器上旋转它，这应该是微不足道的，或者回退到画布上旋转它，然后将它添加到你的零件。
