Ext JSやRapid Driveなど
システム開発の技術情報をご紹介。

GNU GPL license v3.

Ext_ux_Image.zip

最新版に関しては、Google Codeをご確認ください。

Step.1 読み込み

パッケージに含まれる以下のファイルをコンテンツに読み込みます。

• ux/image/image.js

Step.2 xtypeとして利用

パネルなどのコンテナコンポーネントのアイテム設定でxtypeを使用してイメージを設定します。

new Ext.Panel(

    title: 'Ext.ux.Image',

    items: [{
        xtype: 'image',
        src: 'image1.png'
    }]

)

実装コード

new Ext.TabPanel({

    activeItem: 0,
    height: 200,
    width: 300,
    items: [{
        title: 'Image1',
        xtype: 'image',
        src: 'image1.jpg',
        height: 200,
        width: 300,
    },{
        title: 'Image2',
        xtype: 'image',
        src: 'image2.jpg',
        height: 200,
        width: 300,
    },{
        title: 'Image3',
        xtype: 'image',
        src: 'image3.jpg',
        height: 200,
        width: 300,
    }],

    renderTo: 'sandbox'
});