ExtJs收缩栏位置改变需求

本帖最后由 xiaokui_wingfly 于 2014-03-10 16:02:20 编辑

解决方案 »

  1.   

    找找API  记得收缩和展开都是有相关事件和方法的   相信根据这些事件应该可以解决问题
      

  2.   


    <!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
    <link href="Scripts/ExtJS4.2.1/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    .myCss
    {
    background-image:url("Scripts/ExtJS4.2.1/resources/ext-theme-classic/images/tools/tool-sprites.gif");
    background-position-x: 0px;
    background-position-y:-210px;
    margin:0px;
    overflow:hidden;
    width:16px;
    height:15px;

    }
    </style>
    <script src="Scripts/ExtJS4.2.1/ext-all-debug-w-comments.js" type="text/javascript"></script>
    <script src="Scripts/jquery-1.8.3.min.js" type="text/javascript"></script>
    </head>
    <body>
        <form id="form1" runat="server">
        <div>
       
        </div>
        </form>
    </body><script type="text/javascript">
    Ext.onReady(function ()
    {
    Ext.create('Ext.toolbar.Toolbar', {
    renderTo: document.body,
    width: 500,
    items: [
    {
    // xtype: 'button', // default for Toolbars
    text: 'button',
    iconCls: 'myCss',
    listeners:
    {
    render: function (obj, opts)
    {
    $('.myCss').css({ 'background-position-x': '0px', 'background-position-y': '-210px' });
    $('.myCss').attr('state', 'up');
    },
    click: function (obj, e, opts)
    {
    if ($('.myCss').attr('state') == 'up')
    {
    $('.myCss').css({ 'background-position-x': '0px', 'background-position-y': '-195px' });
    $('.myCss').attr('state', 'down');
    }
    else
    {
    $('.myCss').css({ 'background-position-x': '0px', 'background-position-y': '-210px' });
    $('.myCss').attr('state', 'up');
    }
    }
    }
    },
    {
    xtype: 'splitbutton',
    text: 'Split Button'
    }]
    });
    });

    </script>
    </html>
      

  3.   

    请问在面板收缩后怎么让bbar不隐藏呢？
      

  4.   

    这个没办法，toolbar是嵌套在某个region里的，无法显示。
    如果确实要这种效果，则点击btn的时候，手动设置south的高度，模拟效果。
    或重写layout，比较麻烦。