Question

Below is the markup i am using to render an EXT.NET container containing a collapsible panel(west) and another panel containing my content (center).

how do i make it resizable when i resize my browser?

currently its not resizing as i specified width and height and if i do not specify Width and Height, it does not show me anything, it shows blank.

    @Html.X().Container().Layout(LayoutType.Border).Width(500).Height(300).Items(
    Html.X().Panel()
                     .ID("Panel1")
                     .Region(Region.West)
                     .AutoDoLayout(true)
                     .Collapsible(true).Border(true).Title("West Panel").Items(
                     Html.X().Label().Text("Item 1"),
                     Html.X().Label().Text("Item 2")
                     ),
    Html.X().Panel().ID("Panel2").Region(Region.Center).Title("Center")
)

EDIT : I Cannot use ViewPort as its distracting my layout

Answer 1

我不是容器支持这个，而是视口。使用视口代替容器

@Html.X().Viewport().Layout(LayoutType.Border).Items(
        Html.X().Panel()
        .ID("Panel1")
                     .Region(Region.West)
                     .AutoDoLayout(true)
                     .Collapsible(true).Border(true).Title("West Panel").Items(
                     Html.X().Label().Text("Item 1"),
                     Html.X().Label().Text("Item 2")
                     ),
        Html.X().Panel().ID("Panel2").Region(Region.Center).Title("Center")
)

我能想象的另一个解决方案，获取resize事件并使用适当的值设置容器的宽度和高度

How to resize ext.net container with border layout on browser window resize

1 个答案: