2

输入一个答案或链接到一些页面,其中包含有关布局管理器如何工作的信息(布局管理器内部)?

在一般情况下。用于在浏览器中放置 2d(普通)组件。我想在 javascript 中为应用程序框架构建布局管理器

4

1 回答 1

3

假设我掌握了您的问题,布局管理器执行的典型任务是:

  • 跟踪每个布局组件的位置信息。在浏览器中,您可以映射 css 定位顶部、左侧、绝对、相对等的关系。包括边距、填充、边框等的影响。

  • 这可能被视为同一点,但跟踪图层(通常是 z-index 在您的情况下)也很重要。

  • 跟踪形状信息,通常是框的高度和宽度
  • 跟踪哪些组件具有“活动元素”,例如脚本、动画、表单或嵌入
  • 跟踪哪些组件必须附加到具有特定要求的其他组件,哪些是独立的和类似小部件的
  • 通常动态更新样式属性甚至给定布局组件中的内容的能力
  • 提供基于一个或多个其他布局组件的属性重新定位、对齐、调整大小和以其他方式调整一个布局组件的跟踪属性的功能

如果您有能力处理此问题,那么您将有一个良好的开端。通过设计可以基于模板或模式重新排列的布局格式,能够更进一步,这也非常有用。


更新:至于哪个尺寸优先,我不确定你在找什么。如果您已经在使用 JavaScript,最好在 css 旁边动态保持最小和最大宽度之间的宽度以保持跨浏览器。读取节点结构并处理它在某种程度上是一个偏好问题,并且在很大程度上是一个设计问题。以我自己的经验,将最子节点的“层”抽象出来是很好的,特别是将所有内容保存节点抽象为代码的一部分,而将最父节点抽象为另一部分。这些不是严格意义上的顶部和底部节点,但是因为某些内容确实具有子节点,<b> 以标签为例。之后我为容器填写了另一个抽象,最后使用这三层的关系来解释所有节点。

如果您使用相对长度(例如 em、ex 等)或百分比来排列“主要”元素,并在<div style="position: relative">包装​​器中使用绝对定位或使用边距来添加或减去相对长度,那么您就是能够在不同的浏览器不同的最终用户屏幕分辨率上产生紧密匹配的显示。

此外,请查看基本的 HTML/CSS 设计最佳实践以供参考,并尝试简单地实现它们,您将有一个良好的开端。

于 2011-02-04T10:27:29.817 回答