zoukankan      html  css  js  c++  java
  • ExtJS4 border layout 左侧treePanel 中间 panel

    效果图:

     <link href="../extjs-4.1.1/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
        <script src="../extjs-4.1.1/ext-all-debug.js" type="text/javascript"></script>
        <script type="text/javascript">
            Ext.onReady(function () {
                var store = Ext.create('Ext.data.TreeStore', {
                    root: {
                        expanded: true,
                        children: [
                    { text: "detention", leaf: true },
                    {
                        text: "homework",
                        expanded: true,
                        children: [
                            { text: "book report", leaf: true },
                            { text: "alegrbra", leaf: true }
                        ]
                    },
                    { text: "other", leaf: true },
                    { text: "other", leaf: true },
                    { text: "other", leaf: true },
                    { text: "other", leaf: true },
                    { text: "other", leaf: true },
                    { text: "other", leaf: true },
                    { text: "other", leaf: true },
                    { text: "other", leaf: true },
                    { text: "other", leaf: true },
                    { text: "other", leaf: true },
                    { text: "other", leaf: true }
                ]
                    }
                });
                var tree = Ext.create('Ext.tree.Panel', {
                    region: 'west', //for border layout
                    collapsible: true,
                    title: 'Simple Tree',
                    bodyStyle: 'background:#ffc;',
                    200,
                    store: store,
                    rootVisible: false,
                    margins: '5 0 5 5'
                });
                var main = Ext.create('Ext.panel.Panel', {
                    region: 'center', //for border layout
                    title: 'Main Panel',
                    bodyPadding: 10,
                    html: 'html content',
                    margins: '5 5 5 5'
                });
                Ext.create('Ext.panel.Panel', {
                    layout: 'border',
                    600,
                    height: 250,
                    items: [
                    tree,
                    main
                ],
                    renderTo: Ext.getBody()
                });
            });
    </script>
  • 相关阅读:
    Android开发学习总结(一)——搭建最新版本的Android开发环境
    EntityFramework 6
    EntityFramework优缺点
    十分钟轻松让你认识Entity Framework 7
    SqlServer中的merge操作(转载)
    python打印即时输出的方法
    我的人工智能机器人的游戏
    网络编程的一些知识
    hdu4722 Good Numbers
    hdu4727 The Number Off of FFF
  • 原文地址:https://www.cnblogs.com/wangjunwei/p/3106308.html
Copyright © 2011-2022 走看看