ExtJs：如何以百分比设置宽度？答案

【问题标题】：ExtJs:How to set a width in percentage?ExtJs：如何以百分比设置宽度？
【发布时间】：2012-10-03 21:34:32
【问题描述】：

我的测试代码如下：

<script type="text/javascript">
    Ext.onReady(function() {
        Ext.create('Ext.button.Button', {
            id: "Button",
            renderTo: Layer
        });
    });

    function SetPixelWidth() {
        var button = Ext.getCmp("Button");
        button.setWidth(200);
    }

    function SetPercentageWidth() {
        var button = Ext.getCmp("Button");
        button.setWidth("50%");
    }
</script>

<button onclick="SetPixelWidth()">Set Width(Pixel)</button>
<button onclick="SetPercentageWidth()">Set Width(Percentage)</button>
<div id="Layer" style="width:100%;background:black"></div>

setWidth(200) 工作正常，但 "setWidth("50%")" 不生效。

如何以percentage 或pixel 以外的其他单位设置宽度？

提前感谢您的帮助！

【问题讨论】：

查看Ext.dom.AbstractElement.defaultUnit。我不确定你能不能随心所欲。
我将 defaultUnit 设置为“%”和“button.setWidth(50)”，但它也没有将按钮宽度设置为其层长度的 50%。 Ext.dom.AbstractElement.defaultUnit="%";

标签： extjs width percentage

【解决方案1】：

See this post on the Sencha forums

在这种情况下，您能做的最好的事情就是抓住包含对象的宽度。所以像

function SetPercentageWidth()
{
    var button = Ext.getCmp("Button");
    button.setWidth(button.ownerCt.getWidth() * .5);
}

【讨论】：