Ext.dataview.ListView(xtype: list) 사용법

            {

                xtype: 'container',

                layout: 'fit',

                title: '테마날씨',

                iconCls: 'bookmarks',

                items:

                [

                    {

                        /* top title */

                        docked: 'top',

                        xtype: 'titlebar',

                        title: '테마 날씨 정보'

                    },

                    {

                        /* 애드센스 */

                        docked: "top",

                        xtype: "panel",

                        style: "text-align:center",

                        html: '<div style="width: 340px; margin: 0px auto;"><iframe src ="/Mobile/view/adsence.htm" width="340" height="60" frameBorder="0" scrolling="no"></iframe></div>'

                    },

                    {

                        /* 테마 목록 */

                        xtype: 'list',

                        data:

                        [

                            { rowID: 1, themaName: '산', img: "/resources/icons/beach_chair.png" },

                            { rowID: 2, themaName: '바다', img: "/resources/icons/beach_chair.png" },

                            { rowID: 3, themaName: '벗꽃 축제', img: "/resources/icons/beach_chair.png" },

                            { rowID: 4, themaName: '산', img: "/resources/icons/beach_chair.png" },

                            { rowID: 5, themaName: '바다', img: "/resources/icons/beach_chair.png" },

                            { rowID: 6, themaName: '벗꽃 축제', img: "/resources/icons/beach_chair.png" },

                            { rowID: 7, themaName: '산', img: "/resources/icons/beach_chair.png" },

                            { rowID: 8, themaName: '바다', img: "/resources/icons/beach_chair.png" },

                            { rowID: 9, themaName: '벗꽃 축제', img: "/resources/icons/beach_chair.png" },

                            { rowID: 10, themaName: '산', img: "/resources/icons/beach_chair.png" }

                        ],

                        itemTpl: "<div><div style='float:left'>{themaName}</div><div style='float:right;'><img src='{img}' width=35 height=35 /></div></div>",

                        listeners: {

                            itemtap: function (me, index, target, record) {

                                console.log(record.raw.rowID);

                                Ext.getCmp('main').setActiveItem(3);

                                //                                ListDemo.detailPanel.update(record.data);

                                //                                ListDemo.Viewport.setActiveItem('detailpanel');

                            }

                        }

                    }

                ]

            }