[发明专利]页面动态参照布局及展现方法

说明书

技术领域

本发明涉及到网页、软件、操作系统以及各种实物等的页面、界面、版面元素的动态布局及展现方法。 

背景技术

伴随着当今社会的日新月异，一个蕴含了大量信息的页面往往不能同时由一个窗口全部展现出来时，窗口就会给用户提供一种叫做“滚动条”的工具，使用户可以上下左右滚动查看，但是在这种情况下，经常会出现多个布局元素由于不能等高或者等宽，在页面布局时无法对齐从而出现空白区域的现象，不但浪费了有限的窗口资源，减少了窗口的使用效率，用户体验效果也不是很好，例如一个页面包含左右两栏，且两栏的高度不同，在页面滚动浏览的过程中，相对短的一栏就会给窗口框架留出空白，如图1.1、图1.2所示。为了解决这个难题，最常用的就是把左右两栏分开控制，左右两栏各执一个滚动条，如图1.3所示，但是这样，又会产生了新的问题：一是页面包含了多个滚动条时不好控制，二是滚动条的出现减少了有限的窗口显示面积，三是影响页面的完整性、美观性。 

发明内容

本发明为页面提供了一种动态参照布局及展现的方法，如果某个页面中的元素A与元素B由于高度（或宽度）不能达成统一，从而造成页面的布局空白或缺失，那么通过判断元素A、元素B、窗口框架三者之间的尺寸关系，智能的得出相应的布局方法，使页面在窗口框架中移动时，元素A与元素B进行相互的参照，适时的移动、锁定、解锁，达到元素A、元素B的纵向（或横向）有效区域在其窗口框架中存在与消失时保持同步，最终使页面达到完整、美观、易用的目的，改善用户体验，其大致布局过程请参照图2、图3所示。 

为达到上述目的，本发明实施采用如下技术方案： 

首先为某个元素A指定一个纵向（或横向）参照元素B，通过智能的判断元素A、B的高度（或宽度）与其窗口框架的高度（或宽度）的关系，执行相应的布局方法，理论上，元素A、B可以任意指定，但是在实际应用中，为达到智能布局的有效性，一般参照元素B的高度（或宽度）尽量大于元素A，并且参照元素B的高度（或宽度）尽量大于窗口框架的高度（或宽度），元素A、B应该在页面中有一定的联系，比如想在显示B的过程中始终显示元素A，当然，有时页面布局时，由于元素的内容需要动态加载，所以无法预知各元素的高度（或宽度），主要体现在下面的三种情况：

一、元素A的高度（或宽度）大于其窗口框架的高度（或宽度），同时纵向（或横向）参照元素B的高度（或宽度）大于其窗口框架的高度（或宽度），如图4所示，对于此种情况，所对应的布局方案为——首先比较元素A与参照元素B的高度（或宽度），如果元素A的高度（或宽度）大于参照元素B的高度（或宽度），需先将元素A与参照元素B  所代表的元素对调，再执行布局方法，在参照元素B进入纵向（或横向）“提供参照”状态后，元素A会参照元素B在其所属的窗口框架中以特定的方式进行纵向（或横向）移动，当元素A纵向（或横向）的有效区域在其窗口框架中的部分将要减少时，将元素A纵向（或横向）锁定，直到符合条件时解锁；

二、元素A、B有一方的高度（或宽度）大于其窗口框架的高度（或宽度），另一方的高度（或宽度）小于等于其窗口框架的高度（或宽度），对此情况，如果参照元素B的高度（或宽度）小于等于其窗口框架的高度（或宽度），那么首先要将元素A、B所代表的元素对调，在页面移动的过程中，如果参照元素B进入纵向（或横向）“提供参照”状态后，将元素A纵向（或横向）锁定，直到符合条件时解锁，如图5所示；

三、元素A的高度（或宽度）小于等于其窗口框架的高度（或宽度），同时纵向（或横向）参照元素B的高度（或宽度）小于等于其窗口框架的高度（或宽度），如图6所示，对于此种情况，所对应的布局方案为——不会执行布局方法。