0

Sencha Touch 2で丸みを帯びたリストビューが必要です。そのために、ui:round属性を使用しました。しかし、それは機能していません。左側になりましたが、丸みを帯びています。しかし、右側については、それは適切に来ていません。そして、私はその丸みを帯びた境界線の内側にリストが欲しいです。以下は私のコードです:

これが私のコードです:

Ext.define('MyApp.view.MyTabPanel', {
extend: 'Ext.tab.Panel',

config: {
    layout: {
        animation: 'fade',
        type: 'card'
    },
    items: [
        {
            xtype: 'container',
            draggable: true,
            styleHtmlContent: true,
            title: 'Artist',
            items: [
                {
                    xtype: 'list',
                    height: 696,
                    ui: 'round',
                    width: 325,
                    modal: true,
                    itemTpl: [
                        '{firstName}'
                    ],
                    store: 'name',
                    onItemDisclosure: true
                }
            ]
        },
        {
            xtype: 'container',
            styleHtmlContent: true,
            scrollable: true,
            title: 'Albums',
            items: [
                {
                    xtype: 'list',
                    height: 730,
                    ui: 'round',
                    width: 325,
                    modal: true,
                    itemTpl: [
                        '{albumlist}'
                    ],
                    store: 'albumstore',
                    onItemDisclosure: true
                }
            ]
        },
        {
            xtype: 'container',
            styleHtmlContent: true,
            title: 'Playlist',
            items: [
                {
                    xtype: 'list',
                    height: 700,
                    ui: 'round',
                    width: 325,
                    modal: true,
                    itemTpl: [
                        '{playlist}'
                    ],
                    store: 'playliststore',
                    onItemDisclosure: true
                }
            ]
        }
    ],
    tabBar: {
        docked: 'top',
        layout: {
            align: 'center',
            pack: 'center',
            type: 'hbox'
        }
    }
}

});

現在、丸められたリストになっています。しかし、スクロールは適切に行われていません。リストの最後まで行きません。

4

1 に答える 1

1

コンポーネントにいくつかの冗長な構成を含めました。

MyTabPanel.jsに変更を加えただけです(かなりたくさん)。

これは編集後のソースコードであり、アーティストリストでうまく機能し、他のコンポーネントにも同様に適用されます。

Ext.define('MyApp.view.MyTabPanel', {
    extend: 'Ext.tab.Panel',

    config: {
        layout: {
            animation: 'fade',
            type: 'card'
        },
        items: [
            {
                xtype: 'container',
                layout: 'card',
                //draggable: true,
                styleHtmlContent: true,
                title: 'Artist',
                items: [
                    {
                        xtype: 'list',
                        //height: 696,
                        ui: 'round',
                        //width: 325,
                        //modal: true,
                        itemTpl: [
                            '{firstName}'
                        ],
                        store: 'name',
                        onItemDisclosure: true
                    }
                ]
            },
            {
                xtype: 'container',
                layout: 'card',
                styleHtmlContent: true,
                //scrollable: true,
                title: 'Albums',
                items: [
                    {
                        xtype: 'list',
                        height: 730,
                        ui: 'round',
                        width: 325,
                        modal: true,
                        itemTpl: [
                            '{albumlist}'
                        ],
                        store: 'albumstore',
                        onItemDisclosure: true
                    }
                ]
            },
            {
                xtype: 'container',
                layout: 'card',
                styleHtmlContent: true,
                title: 'Playlist',
                items: [
                    {
                        xtype: 'list',
                        //height: 700,
                        ui: 'round',
                        //width: 325,
                        //modal: true,
                        itemTpl: [
                            '{playlist}'
                        ],
                        store: 'playliststore',
                        onItemDisclosure: true
                    }
                ]
            }
        ],
        tabBar: {
            docked: 'top',
            layout: {
                align: 'center',
                pack: 'center',
                type: 'hbox'
            }
        }
    }

});
于 2012-06-01T10:27:18.127 に答える