1

我对 Sencha Touch 完全陌生，似乎无法找到我正在尝试做的事情的答案。我目前有一个显示事件时间表的列表视图。我想要做的是在这个列表上方有一个块，显示场地位置的地图。

这是我当前的代码：

主.js

Ext.define('eventApp.view.Home', {

extend: 'Ext.List',
xtype: 'schedulepanel',
id: 'sched',

config: {
    title: '<span class="logo"></span>',
    iconCls: 'time',

    grouped: true,
    itemTpl: '<div class="white-circle">{time}</div> <div class="list-title">{title}</div> <div class="list-desc">{description}</div>',
    store: 'ScheduleList',
    onItemDisclosure: true
    }

});

对此的任何帮助将不胜感激。如果您还有更多代码，请告诉我。

4

1 回答 1

1

您应该使用vbox 布局将 UI 分成 2 个垂直块，如下所示，上半部分有地图，下半部分有列表：

Ext.define('eventApp.view.Home', {
    extend: 'Ext.Panel',
    alias: 'widget.schedulepanel',
    id: 'sched',
    config : {
        layout : 'vbox',
        items : [{
            xtype : 'panel',
            flex : 1,
            items : [{
                xtype: 'map',
                useCurrentLocation: true
            }]
        }, {
            xtype : 'panel',
            flex : 1,
            items : [{
                iconCls: 'time',
                grouped: true,
                itemTpl: '<div class="white-circle">{time}</div> <div class="list-title">{title}</div> <div class="list-desc">{description}</div>',
                store: 'ScheduleList',
                onItemDisclosure: true
            }]
        }]
    }
});

PS我没有测试过这段代码，但这就是想法。

于 2013-05-14T11:26:51.243 回答