Sencha touch 如何在Sencha Touch中显示图像？

所以，我在Sencha Touch中有一个面板，我有一个图像，我想在面板中显示为一个组件。我尝试了以下几点：

   logo = {
        xtype: 'component',
        autoEl: {
            src: 'http://addressofmyimage.com/image.png',
            tag: 'img',
            style: { height: 100, width: 100 }
        }
    };

然后将上述组件添加为“我的面板”中的项目。不显示任何图像。将显示所有其他组件，但不显示图像。甚至连一个坏掉的图像链接图标都没有。我搞不懂这个

---

我不希望只插入原始html，因为我无法按照我的意愿格式化它。

最好使用面板来显示图像本身。将上述代码替换为

logo = {
    xtype: 'panel',
    html: '<img style="height: 100px; width: 100px;" src="http://addressofmyimage.com/image.png" />'
};

logo={
xtype:'面板'，
html:'
};

您可以覆盖组件的getElConfig方法并返回autoEl对象中的内容

{
    xtype: 'component',
    getElConfig : function() {
        return {tag: 'img',
        src: 'http://addressofmyimage.com/image.png',
        style: { height: 100, width: 100 },
        id: this.id};
    }
}

---

当呈现组件以获得底层元素的组成时，将使用该方法。

您可以使用src.sencha.io API根据需要调整图像大小。下面的例子对我有用

{
    xtype: 'image',
    src: 'http://src.sencha.io/100/100/http://www.skinet.com/skiing/files/imagecache/gallery_image/_images/201107/windells_hood.jpg',
    height: 100
}

---

您可以找到文档。

您也可以使用bodyStyle参数True，bodyStyle属性与背景图像css属性一起使用是否可以向其添加tap处理程序事件？