Question

重要提示：这是在版本2.0而不是在2.1.1中工作

我的应用在底部有两个不同的标签（靠近，搜索）这个标签都使用下面给出的相同列表。此外，NearBy和Search都使用卡片布局，唯一的区别在于近列表在第一张卡片中，而搜索列表在第二张卡片中

我在过去2天尝试这个，但没有进展。请帮帮我

Ext.define('ChurchLookup.view.ChurchList', {
extend: 'Ext.List',
xtype: 'churchlist',


config:
{
    title: 'Zip Code',
    cls: 'x-contacts',
    grouped: true,
    store: 'Churches',
    itemTpl:
    [
        '<div class="headshot" style="background-image:url(resources/images/church-type-logo/{icon}.png);"></div>',
        '{name}, {city}',
        '<span>{phone} / {email}</span>'
    ].join('')
}});

对于近处，单击选项卡时，列表将显示在选项卡面板中。这很完美，我可以看到列表。

靠近卡片代码

Ext.define('ChurchLookup.view.NearBy',
{
    extend: 'Ext.Panel',
    xtype: 'nearbycard',
    config:
    {
        iconCls: 'locate',
        title: 'Near By',
        scrollable: 'vertical',
        layout:
        {
              type: 'card',
              animation:
            {
                type: 'pop',
                duration: 500,
            }
        },
        items:
        [
            {
                docked: 'top',
                xtype: 'titlebar',
                title: 'Near by Churches',
                items:
                [
                    {
                        itemId: 'btnBackNearBy',
                        text: "Back",
                        ui: "back",
                        hidden: true,
                        action:  'onBackNearBy'
                    }/*,
                    {
                        itemId: 'btnHomeSettings',
                        iconMask:true,
                        iconCls: 'settings',
                        ui:      'border',
                        align:   'right',
                        action:  'pingHomeBadge'
                    }*/
                ]
            },
            {
                xtype: 'churchlist'
            },
            {
                xtype: 'churchdetailsnearby'
            }
        ],
        listeners:
        [
            {
                delegate: "#btnHomeSettings",
                event: "tap",
                fn: "onHomeScreenSettings"
            },
            {
                delegate: "#btnBackNearBy",
                event: "tap",
                fn: "onBackNearBy"
            }
        ]
    },
    onHomeScreenSettings: function ()
    {
        this.fireEvent("homeScreenSettings", this);
    },
    onBackNearBy: function ()
    {
        this.fireEvent("onBackNearBy", this);
    }
});

但是对于我们单击“搜索”选项卡时的搜索，它将显示带有2张卡的卡片布局。第一张卡片是搜索表单，第二张卡片是列表。当用户填写表单并单击搜索按钮时，我只需加载商店并更改卡片布局以显示列表。但是卡片布局显示的是第二页而不是列表。

搜索标签代码

Ext.define('ChurchLookup.view.Search',
{
    extend: 'Ext.Panel',
    xtype: 'searchcard',
    config:
    {
        iconCls: 'search',
        title: 'Search',
          scrollable: 'vertical',
        layout:
        {
              type: 'card',
              animation:
            {
                type: 'pop',
                duration: 500,
            }
        },
        items:
        [
            {
                docked: 'top',
                xtype: 'titlebar',
                title: 'Search Church',
                items:
                [
                    {
                        itemId: 'btnBackSearch',
                        text: "Back",
                        ui: "back",
                        hidden: true,
                        action:  'onBackSearch'
                    }/*,
                    {
                        itemId: 'btnHomeSettings',
                        iconMask:true,
                        iconCls: 'settings',
                        ui:      'border',
                        align:   'right',
                        action:  'pingHomeBadge'
                    }*/
                ]
            },
            {
                xtype: 'searchform'
            },
            {
                xtype: 'favouritecard'
            },
            {
                xtype: 'churchdetailssearch'
            }
        ],
        listeners:
        [
            {
                delegate: "#btnHomeSettings",
                event: "tap",
                fn: "onHomeScreenSettings"
            },
            {
                delegate: "#btnBackSearch",
                event: "tap",
                fn: "onBackSearch"
            }
        ]
    },
    onHomeScreenSettings: function ()
    {
        this.fireEvent("homeScreenSettings", this);
    },
    onBackSearch: function ()
    {
        this.fireEvent("onBackSearch", this);
    }
});

Answer 1

也许身高问题。

'churchdetailssearch'与'churchlist'相同吗？

如果churchdetailssearch'有工具栏或设置布局：'vbox'到'churchdetailssearch'，并添加'churchdetailssearch'flex的列表：1。

也许页面很有用。 Explain how to a scrollable List use dynamic height without fixed height

列表未在2.1.1版本的卡片布局中显示。在2.0版本中完美运行

1 个答案: