image - 如何在 sencha touch 中创建这样的图像查看器？

Question

我需要在 sencha touch 中创建这样的图像查看器。它应该显示图像的缩略图。单击缩略图应显示放大的图像。我是sencha touch的新手。请帮帮我。

Answer 1

AFAIK 没有这样的标准画廊插件，所以你必须自己做。你可以试试这个:

在 vbox 中创建一个带有 2 个面板的容器布局，更大的顶部面板将有 image下面板将是水平 list .在 itemtap任何列表项，您可以更改 src image 的属性.您可以通过使用提供缩略图和大图像 url 的商店从服务器加载数据来创建这个简单的列表。

我还没有测试过，但这应该是这样的:

{
    xtype : 'panel',
    layout : 'vbox',
    items : [{
        xtype : 'panel',
        flex : 5,
        items : [{
            xtype : 'image',
            id : 'myImg',
            src : 'http://xyz.com/asdf.jpg'
        }]
    },{
        xtype : 'panel',
        items : [{
            xtype : 'list',
            listeners: {
            itemtap: function(list, index, item, rec) {
                Ext.getCmp("myImg").setSrc(rec.get('bigImgUrl'));
            }
        }
        }]
    }]
}