1

Sencha Touch はまったく初めてで、自分がやろうとしていることに対する答えが見つからないようです。現在、イベントのタイム スケジュールを表示するリスト ビューがあります。私がやりたいのは、このリストの上に、会場の場所の地図を表示するブロックを配置することです。

これが私の現在のコードです：

Main.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 に答える