0

私のExtJSアプリケーションには、、、 Ext.tree.Panelおよびの3つのコンポーネントがExt.grid.PanelありExt.Imgます。ここでのフィードビューアの例と同じレイアウトにする必要があります。

http://dev.sencha.com/deploy/ext-4.0.0/examples/feed-viewer/feed-viewer.html

私はコードを見ようとしていますが、コンポーネントをそのように表示するのにまだ問題があります（左側に1つのコンポーネント、右側に2つのコンポーネントを重ねて表示します）。「ボーダー」レイアウトを使用してこれを行う方法を誰かが説明できますか？（これは彼らが使用しているように見えるものです）。

編集：ネストされた境界線レイアウトを作成してみました。Ext.tree.Panel左側Ext.tab.Panelに、右側に、Ext.grid.Panelとその内側Ext.Imgがあります。これにより、タブパネル全体が空白で表示されます。以下のコード：

 grid_file = Ext.create('Ext.grid.Panel', {
            title: 'File List',
            region: 'north',
            height:200,
            width:700, 
            store: store_file,
            dockedItems: [upload_toolbar],
            columns: [..]});

var imagePanel = Ext.create('Ext.Img', {
            src: 'DefaultImage',
            region: 'south',
            width: 700,
            height: 200
        });
 var tab_Panel = Ext.create('Ext.tab.Panel' , {
            width: 700,
            region: 'center',
            items: [grid_file, imagePanel]})

        win = Ext.create('Ext.window.Window', {
            title: 'ExtJS Simple File Browser',
            width: 900,
            height: 400,
            layout: 'border',
            bodyStyle: 'padding: 5px;',
            items: [tree_dir,button_panel]
        });

        win.show();
4

2 に答える 2

2

これは実際にはネストされた境界線レイアウトです。

次の境界線であるメインレイアウトがあります。

  • 西：フィード
  • 中央：フィード情報パネル

また、フィード情報パネルには、次のような境界線レイアウトもあります。

  • 中央：グリッド。
  • 南：選択したフィード。

フィードビューアのコードは多少複雑です。おそらくこれがもっと役立つでしょう。

それでも解決できない場合は、コードを送信してください。

于 2012-12-06T15:43:37.950 に答える
0

Chromeでデベロッパーコンソールを開きます。そして、ソースを確認してください。それらは圧縮されておらず、読み取り可能ではありません。:)FeedViewerクラスで作成されたビューポート。つまり、これがエントリポイントです。

于 2012-12-08T19:48:09.623 に答える