基于网格的应用中的动态内容布局的制作方法
【专利说明】基于网格的应用中的动态内容布局
[0001] 背景
[0002] 在计算设备上显示内容存在许多不同的方式。例如，可将内容显示在页中、列中、 表中等。显示器可包括从外部源获得（例如，从网络位置获得）的内容。在不知道将从外 部源获得多少数据时创建期望的内容布局可能是个挑战。
[0003] 概述
[0004] 提供本概述以便以简化的形式介绍将在以下详细描述中进一步描述的一些概念。 本概述不旨在标识出所要求保护的主题的关键特征或必要特征，也不旨在用于帮助确定所 要求保护的主题的范围。
[0005] 获得内容项，并将其动态地布置在显示器上的各列（例如，相同大小的列）内的不 同尺寸的小块中。基于时间（例如创建时间）来对所获得的项以及尚未被渲染的先前获得 的项进行排序。使用该排序来作出关于这些项中的任何一者是否准备好渲染的确定。可在 获得所有内容项之前作出项是否准备好渲染的确定。项可以不按与渲染次序相同的次序来 获得。准备好渲染的项的布局被确定为在列的小块内。例如，这些项可基于其内容被放置 在小块中（例如，与富内容相比，文本内容被放置在更小尺寸的小块中）。可将项放置在使 与该项相关联的内容显示动画化的实况小块中。被确定为准备好渲染的各项被发送以供渲 染。
[0006] 附图简述
[0007] 图1示出了用于进行动态内容布局的系统；
[0008] 图2示出了不同尺寸的小块和列的视图；
[0009] 图3示出了具有不同尺寸的列的不同显示；
[0010] 图4解说了获得内容项和动态渲染内容项；
[0011] 图5示出了用于在基于网格的应用中进行动态内容布局的说明性过程；
[0012] 图6解说了用于进行动态内容布局的示例性系统；以及
[0013] 图7-9以及相关描述提供了其中可实施本发明的实施例的各种操作环境的讨论。
[0014] 详细描述
[0015] 现将参考其中相同的标号代表相同的元件的附图来描述各实施例。
[0016] 图1示出了用于进行动态内容布局的系统。如所示的，系统100包括应用程序 110、布局管理器26、触摸屏输入设备/显示器115以及包括内容项122的内容提供方/存 储 120〇
[0017] 为了促成与布局管理器26通信，可以实现一个或多个回调例程。根据一个实施 例，应用程序110是被配置为接收来自触敏输入设备115和/或其他输入设备的输入的生 产力应用，诸如协作程序（如微软的SHAREPOINT)。例如，语音输入、键盘输入（例如物理 键盘和/或SIP)、基于视频的输入等等。例如，布局管理器26可响应于用户的选择内容的 姿势（即，姿势150)和其他基于触摸的姿势来向应用110提供信息。例如，姿势可包括但 不限于：捏合姿势；拉伸姿势；选择姿势（例如在所显示的元素上的轻击动作）；选中并保 持姿势（例如在所显示的元素上接收到的轻击并保持姿势）；滑扫动作和/或拖动动作；等 等。
[0018] 所示的系统100包括检测何时接收了触摸输入（例如，手指触摸或接近触摸该触 摸屏）的触摸屏输入设备/显示器115。可利用检测用户的触摸输入的任何类型的触摸屏。 例如，触摸屏可包括一层或多层检测触摸输入的电容性材料。除了电容性材料之外或代替 电容性材料，可使用其他传感器。例如，可使用红外（IR)传感器。根据一实施例，触摸屏被 配置成检测与可触摸的表面接触或位于可触摸的表面上方的物体。尽管在本说明书中使用 术语"上方"，应理解，触摸面板系统的定向是不相关的。术语"上方"旨在可适用于所有这 样的定向。触摸屏可被配置成确定触摸输入被接收的位置（如起点、中间点和终点）。可通 过任何合适的手段，包括如耦合到触摸面板的振动传感器或话筒，来检测可触摸的表面和 物体之间的实际接触。用于检测接触的传感器的示例的非穷尽列表包括：基于压力的机构、 微机械加速度计、压电器件、电容传感器、电阻传感器、感应传感器、激光振动计和LED振动 计。
[0019] 布局管理器26被配置成当项可用于渲染并被确定为准备好渲染时对这些项进行 增量式布局和植染。根据一实施例，布局管理器26按经修改的时间次序从内容提供方/存 储120(例如，服务器）获得内容项（例如，首先获得最新近修改的项）。布局管理器26使 用未经渲染的项的列表（该列表是基于项的创建时间来排序的）来确定所获得的项何时准 备好渲染。替代按接收各项的次序来显示这些项，布局管理器26基于经排序的创建时间来 确定这些项的布局。
[0020] 布局管理器26对准备好在包括小块的列内植染的各项进行布局。列内的小块可 以为相同的尺寸和/或不同的尺寸。根据一实施例，这些小块包括单一单位高度小块、一个 半单位高度小块、二高度单位小块和三高度单位小块。这些小块可以为不同的尺寸和/或 形状。列尺寸可以有从1高度小块尺寸到N高度小块尺寸的范围。列尺寸可基于显示器分 辨率和/或不同的考虑（例如，用于显示文本的字体大小、期望的图片分辨率……）。一般 来说，列尺寸有在大约三个单位和八个单位之间的范围。根据一实施例，布局管理器26基 于项的内容来确定对其中放置该项的小块的选择。例如，文本被放置在一单位小块或一个 半单位小块中，而富内容（例如，图像、图形……）被放置在更大单位小块中，诸如二单位小 块或三单位小块。布局管理器26将每一列布置成有相同的高度，并选择小块单位以创建期 望高度（例如，参见图3和相关的描述）。
[0021] 显示115示出了被布置在具有相同高度（例如，6个单位的高度）的列内的不同尺 寸的小块中的内容项的示例性显示。列116示出了包括被包括在四个具有单位尺寸为1. 5 的小块中的文本内容的各内容项。列117示出了包括被包括在两个具有单位尺寸为3的小 块中的富内容的各内容项。在当前说明中，被放置在列117中的较低小块中的富内容是实 况小块，该实况小块示出了包括在该小块中的富内容的至少一部分的动画。根据一实施例， 可选择实况小块（例如，轻击在该小块上）以便显示富内容121的扩展视图。列118示出 了以下内容项：这些内容项包括被包括在具有单位尺寸为2的第一小块中的富内容，接着 是在具有单位尺寸为3的第二小块中的富内容，接着是在具有单位尺寸为1的第三小块中 的文本内容。列119示出了以下内容项：这些内容项包括被包括在具有单位尺寸为1的第 一小块中的文本内容、被包括在具有单位尺寸为2的第二小块中的富内容、接着是在具有 单位尺寸为2的第三小块中的富内容、接着是在具有单位尺寸为1的第四小块中的文本内 容。
[0022] 内容项被获得，并被动态地布置在显示器上的各列（例如，相同大小的列）中的不 同大小的小块中。所获得的项以及尚未被渲染的先前获得的项均是基于时间（例如创建时 间）来排序的。使用该排序来作出这些项中的任何一项是否已经准备好渲染的确定。可在 获得所有内容项之前作出项是否准备好渲染的确定。确定准备好渲染的项在列的小块内的 布局。例如，这些项可基于其内容被放置在小块中（例如，与富内容相比，文本内容被放置 在更小尺寸的小块中）。可将项放置在使与该项相关联的内容显示动画化的实况小块中。被 确定为准备好渲染的各项被发送以供渲染。在以下提供关于交互式性能评估的更多细节。
[0023] 图2示出了不同尺寸的小块和列的视图。如图所示，图2包括四个不同尺寸的小 块（210、211、212和213)以及五个不同高度的列（220、221、222、223和224)。
[0024] 不同尺寸的小块用于创建显示的相同高度的列。相同尺寸的列和/或大致相同尺 寸的列可被显示在具有标准/大的显示器（例如，大于12英寸的显示器）的显示器上以及 具有有限显示器大小的设备（例如，具有大约2乘3英寸的显示器的智能电话、具有大约7 到10英寸显示器的板式/平板和/或具有其他显示器大小（例如，4、5、6)的其他设备） 上。
[0025] 小块210是具有高度为1个单位的小块。小块211是具有高度为1. 5个单位的小 块。小块212是具有高度为两个单位的小块。小块213是具有高度为三个单位的小块。不 同尺寸的小块可被组合以创建具有相同高度的列。根据一实施例，基于项的内容将各项放 置在小块中。例如，将文本内容放置在较小的小块（210和211)之一中，并将富内容（例如， 图片、图像、图形等）放置在较大小块（212和213)之一中。通过组合一个或多个不同尺寸 的一个或多个小块来创建列。
[0026] 图3示出了具有不同尺寸的列的不同显示。如所示出的，图3包括四个显示，包括 显示310、显示320、显示330和显示340。这些说明用于解释的目的，并不旨在进行限制。尽 管在不同列中的每一列中示出了不同尺寸的小块，但不同的列也可具有相同尺寸的小块。
[0027] 显不310解说了在四个具有尚度为3的列内的小块的显不。尽管不出了四个列， 但可显示更多或更少的列。第一列包括单个具有高度为3的小块。第二列包括具有高度为 1的小块和具有高度为2的第二小块。第三列包括具有高度为1. 5的第一小块和具有高度 为1. 5的第二小块。第四列包括具有高度为2的第一小块和具有高度为1的第二小块。
[0028] 显不320解说了在四个具有尚度为4的列内的小块的显不。尽管不出了四个列， 但可显示更多或更少的列。第一列包括具有高度为1的第一小块以及具有高度为3的第二 小块。第二列包括具有高度为2的第一小块和具有高度为2的第二小块。第三列包括具有 高度为1. 5的第一小块、具有高