创建可自动调整大小的面板，其中包含面板
抱歉，问题标题不太清楚，但也许图片有助于描述我的问题：
图片http://my.jetscreenshot.com/2951/20100604-ioyo-164kb.jpg
我希望父面板中的小子面板能够自动调整大小。这是我的标记和代码隐藏：
protected void Page_Load(object sender, EventArgs e)
{
var bkg = new[] { "background-color: wheat;", "background-color: gray;", "background-color: #AAAAAA;" };
var random = new Random();
for (var i = 0; i < 285; i++)
{
var panel = new Panel
{
Header = false,
Width = 60,
Height = 30,
BodyStyle = bkg[random.Next(0, 3)],
Frame = false,
StyleSpec = "padding-top: 1px; padding-left: 1px;",
ID = "panel_" + i,
Html = string.Format("<span class='x-unselectable'>{0}</span>", i)
};
var cell = new Cell();
cell.Items.Add(panel);
TableLayout1.Cells.Add(cell);
}
}
<ext:Panel ID="pnlWorkArea" runat="server" Title="Test">
<Body>
<ext:TableLayout ID="TableLayout1" runat="server" Columns="15">
</ext:TableLayout>
</Body>
</ext:Panel>
Sorry for not very clear question title, but maybe image will help to describe my ploblem:
image http://my.jetscreenshot.com/2951/20100604-ioyo-164kb.jpg
I want small child panels in parent panel to be autosizeable. Here is my markup and codebehind:
protected void Page_Load(object sender, EventArgs e)
{
var bkg = new[] { "background-color: wheat;", "background-color: gray;", "background-color: #AAAAAA;" };
var random = new Random();
for (var i = 0; i < 285; i++)
{
var panel = new Panel
{
Header = false,
Width = 60,
Height = 30,
BodyStyle = bkg[random.Next(0, 3)],
Frame = false,
StyleSpec = "padding-top: 1px; padding-left: 1px;",
ID = "panel_" + i,
Html = string.Format("<span class='x-unselectable'>{0}</span>", i)
};
var cell = new Cell();
cell.Items.Add(panel);
TableLayout1.Cells.Add(cell);
}
}
<ext:Panel ID="pnlWorkArea" runat="server" Title="Test">
<Body>
<ext:TableLayout ID="TableLayout1" runat="server" Columns="15">
</ext:TableLayout>
</Body>
</ext:Panel>
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
如果您的意思是希望子面板排列完全填充中心区域，那么除了计算该区域的内部尺寸，然后像现在一样为子面板分配固定的高度/宽度之外，没有一种简单的方法可以做到这一点，但基于您的测量。您可以通过处理
render事件或覆盖中心区域面板的onRender来完成此操作。如果行数和列数始终相同，您可以尝试使用 % 维度，但根据我的经验，这在不同浏览器中的工作效果不一致（有时由于从小数百分比四舍五入到像素，您可能会出现小间隙）。
If you mean that you want the child panel arrangement to completely fill the center region, there's not a simple way to do that other than calculating the inner dimensions of the region, then assigning fixed height/width to the child panels as you are now, but based on your measurements. You could do this either by handling the
renderevent or overridingonRenderof the center region panel.If the number of rows and columns is always the same you could try using % dimenstions, but in my experience that does not work consistently across browsers (you can get small gaps sometimes due to rounding from decimal percentages to pixels).