本公开涉及可以显示内容的电子设备。
背景技术：
通常，诸如智能电话、平板个人计算机(PC)等之类的电子设备可以在屏幕上显示内容(例如，电子文档)。此时，电子文档(例如网页)可以大于屏幕，因此只能在屏幕上显示电子文档的一部分。电子设备可以响应于用户输入(例如，通过触摸屏上的输入体(例如，手指、笔等)进行拖曳)来移动网页的显示区域，并且显示网页的另一部分。
以上信息只是作为背景信息来辅助理解本公开。并不是做出判断或者承认以上任意内容可以应用为相对于本公开的现有技术。
技术实现要素：
例如，按照层叠式样式表(CSS)或超文本链接标示语言(HTML)来实现网页。电子设备可以基于屏幕(换句话说，视口(viewport))的宽度(幅宽)来重排和显示网页的组成部分。通常根据屏幕宽度大于高度的台式个人计算机(PC)的环境来限定重排方法。
然而，因为宽度和高度在移动环境中是灵活的(例如，因为用户通过屏幕旋转可以颠倒宽度和高度)，存在通过普通重排方法不能满足的目标。为了满足这些目的，可以使用下面的重排方法。例如，可以使用诸如固定版面、视口元标签或设备缩放因子之类的技术。
固定版面：当便携设备处于人像模式时(也就是说，放置屏幕使得宽度小于高度)，可以将网页的组成部分放置为垂直方向较长。相反，当便携设备处于横向风景模式时，可以将网页的组成部分放置为水平方向较长。然而与模式切换无关，可能需要固定网页的宽度。例如，可以将根据经验获得的980像素(px)定义为网页的版面宽度。
视口元标签：当将标签“<metaname＝′viewport′content＝′width＝device-width′>”添加至网页时，便携设备可以配置为网页的版面，使得所述网页的版面宽度适合所述屏幕的视口宽度，并且显示所述网页。
缩放因子：便携设备可以具有高分辨率屏幕。例如，尽管第一便携设备和第二便携设备具有相同的屏幕尺寸，第二便携设备可以实现与第一便携设备相比更高的分辨率。一些网页可以排列和显示为适合第一便携设备的屏幕的宽度(也就是说视口宽度和版面宽度是相同的)，并且可以设置和显示为比第二便携设备中的屏幕的宽度窄(即，视口宽度窄于版面宽度)。也就是说，第二便携设备的屏幕可以具有空白区。因此，第二便携设备可以控制缩放因子以减小分辨率并且显示网页。例如，当设备的分辨率是640x960时，如果缩放因子(即相应设备的像素比率)配置为2时，设备的逻辑尺寸是320x480。也就是说，视口宽度逻辑地从640减小至320。因此，相应的设备可以按照与具有320x480的分辨率的设备相同的方式来显示网页。
根据以上技术，没有足够地考虑各种电子设备的属性(例如分辨率)的网页可能按照不适于电子设备的属性(例如，分辨率)的格式来显示内容。具体地，高分辨率设备(例如16∶9，16∶10)的屏幕可能具有空白区。例如，具有16∶10的分辨率2560x1600的设备的缩放因子可以配置为2或2.5。当缩放因子配置为2时，屏幕的逻辑尺寸是1280x800。“1280”可能不适于表达网页。例如，当相应的设备处于横向风景模式(即，1280配置为宽度)并且网页的宽度是980时，屏幕可以在左侧和右侧上具有空白区。当缩放因子配置为2.5时，屏幕的逻辑尺寸可以是1024*640。“640”可能不适于表达网页。例如，当相应的设备处于人像模式(即，640配置为宽度)并且网页的宽度是980时，屏幕不具有空白区，但是只可以在屏幕上显示网页的一部分。
同时，可以将内容划分为多个区域(换句话说，组成部分)。可以将所述组成部分的至少一个分类为主要组成部分。例如，在网页的文章和广告之间，可以将文章分类为主要组成部分。
本公开的多个方面是为了至少解决上述问题和/或缺点，并且为了至少提供下述优点。因此，本公开的一个方面是为了提供一种根据屏幕尺寸来自适应地显示内容的方法和实现所述方法的电子设备。
本公开的另一个方面是为了提供一种首先显示内容的主要组成部分的方法和实现所述方法的电子设备。
根据本公开的一个方面，提供了一种电子设备。所述电子设备包括：电子存储器，配置为存储内容；显示器，配置为在屏幕上显示已经确定了版面的内容的至少一部分；以及控制器，配置为：确定所述内容的至少一个组成部分作为主要组成部分，并且确定所述内容的版面宽度，使得所述主要组成部分的宽度窄于或等于屏幕的视口宽度。
根据本公开的另一个方面，提供了一种在电子设备中显示内容的方法。所述方法包括：确定内容的版面；确定所述内容的至少一个组成部分作为主要组成部分；确定所述内容的版面宽度，使得所述主要组成部分的宽度窄于或等于屏幕的视口宽度；以及在所述屏幕上显示所述内容的主要组成部分。
根据本公开的各种实施例，可以首先向用户显示内容的组成部分中重要的主要组成部分。另外，可以与主要组成部分一起显示多个附加信息。此外，当用户滚动内容时，根据本公开各种实施例的方法和电子设备可以防止主要组成部分的左右边界脱离所述屏幕的左右两侧，从而向用户提供主要以主要组成部分为基础观看内容的便利性。另外，当用户要放大的目标与主要组成部分相对应时，根据本公开各种实施例的方法和电子设备可以自动地扩大主要组成部分以适合屏幕宽度，从而向用户提供主要以主要组成部分为基础观看内容的便利性。
根据结合附图公开了本公开各种实施例的以下详细描述，本公开的其他方面、优势和显著特征对于本领域普通技术人员将是清楚明白的。
附图说明
根据结合附图进行的以下详细描述，本公开某些实施例的以上和其他目的、特征和优势将变得更加清楚明白，其中：
图1是示出了根据本公开各种实施例的电子设备的结构的方框图；
图2是示出了根据本公开各种实施例的内容显示方法的流程图；
图3示出了根据本公开各种实施例的内容版面的示例和确定主要组成部分的方法；
图4示出了根据本公开另一个实施例的内容版面的另一个示例和确定主要组成部分的方法；
图5A和5B示出了根据本公开实施例的内容版面的另一个示例和重新配置内容版面的方法；
图6示出了根据本公开实施例的内容版面的另一个示例和不适于主要组成部分的示例；
图7A和7B示出了根据本公开实施例的用于描述版面重新配置方法的屏幕；
图8A和8B示出了根据本公开实施例的用于描述放大网页中的主要组成部分的方法的屏幕；
图9A至9D示出了根据本公开实施例的用于描述在网页中临近主要组成部分存在的空白区中显示附加信息的方法的屏幕；
图10是示出了根据本公开各种实施例的移动内容的方法的流程图；
图11A至11C示出了根据本公开实施例的在主要组成部分的边界没有脱离屏幕的同时移动内容的方法的示例；
图12A至12B示出了根据本公开实施例的在主要组成部分的边界没有脱离屏幕的同时移动内容的方法的另一个示例；
图13是示出了根据本公开各种实施例的扩大主要组成部分以适合屏幕的方法的流程图；以及
图14A和14B示出了根据本公开各种实施例的自动控制内容的主要组成部分以适合屏幕的方法的示例。
贯穿附图，类似的附图标记将理解为表示类似的部分、部件和结构。
具体实施方式
参考附图提供以下描述来帮助全面理解权利要求及其等同物限定的本发明示例性实施例。以下描述包括多个具体细节以帮助理解，但是应将这些细节仅看作是示例性的。因此，本领域普通技术人员将认识到，可以在不背离本发明精神和范围的情况下对本文所描述的实施例进行多种改变和修改。此外，为了清楚和简明的目的，可以省略对公知功能和结构的描述。
以下描述和权利要求中使用的术语和词语并不限于字面意思，而是仅被发明人用来使本发明清楚并便于理解。因此，对于本领域技术人员显而易见的是，仅以说明的目的提供了本发明示例性实施例的以下描述，并且并不将其解释为对所附权利要求及其等同物限定的本发明的限制。
应该理解，除非上下文清楚地指示，否则单数形式的“一”、“一个”和“该”包括复数形式。因此，例如，提及“部件表面”包括提及一个或多个这种表面。
术语“包括”或“可以包括”指的是存在可以在本公开的各种实施例中使用的相应公开的功能、操作或部件，但是并不限制一个或多个附加的功能、操作或部件。在本公开中，诸如“包括”或“具有”之类的术语可以解释为表示某些特征、个数、操作、组成元件、部件及其组合，但是不可以解释为排除一个或多个其他特征、个数、操作、组成元件、部件及其组合的存在或可能性。
在本公开的各种实施例中使用的术语“或”包括所列举词语的任何或全部。例如，表达方式“A或B”可以包括A、可以包括B或者可以包括A和B两者。
在本公开的各种实施例中使用的诸如“第一”、“第二”等之类的表达方式可以用于修改各种实施例的各种部件元件，但是不限制相应的部件元件。例如，以上表达方式并不限制元件的顺序和/或重要性。这些表达方式可以用于将元件彼此区分。例如，在不背离本公开范围的情况下，可以将第一部件元件称作第二部件元件。类似地，可以将第二部件元件称作第一部件元件。
本公开各种实施例中的术语仅用于描述本公开的特定实施例，而不是意欲限制本公开。如这里所使用的，单数形式可以包括复数形式，除非上下文明确说明。
除非相反地说明，这里使用的所有术语(包括技术和科学术语)可具有与本公开所属领域的技术人员通常所理解的含义相同的含义。通常使用在字典中定义的术语解释为具有与相关技术的上下文的术语相同的含义，不应该解释为具有理想或过度刻板的含义，除非明确限定了。
根据本公开各种实施例的电子设备具有从外部设备接收内容并且显示所接收的内容的功能。例如，电子设备可以包括以下中的至少一个：智能电话、平板个人计算机(PC)、移动电话、视频电话、电子书阅读器、桌上PC、膝上型PC、笔记本计算机、个人数字助手(PDA)、便携式多媒体播放器(PMP)、移动图片专家组阶段1或阶段2(MPEG-1或MPEG-2)音频层3(MP3)播放器、移动医疗设备、摄像机、可穿戴设备(例如，智能眼镜、头戴式设备(HMD)、电子衣服、电子手环、电子项链、配饰、电子纹身、智能镜子或智能手表)
根据本公开的一些实施例，电子设备可以是具有从外部设备接收内容并且显示所接收的内容的智能家用电器。所述智能家用电器可以包括以下中的至少一种：例如，电视(TV)、数字通用盘(DVD)播放器、音频播放器、冰箱、空调、真空吸尘器、烤箱、微波炉、洗衣机、空气净化器、机顶盒、TV盒(例如SAMSUNGHOMESYNCTM、APPLETVTM或GOOGLETVTM)、游戏控制台、电子词典、电子钥匙、摄录像机或数字相框。
根据本公开的另一个实施例，电子设备可以包括以下各种设备中的至少一个：各种医疗设备(磁共振造影(MRA)机、磁共振成像(MRI)机、计算机断层(CT)扫描仪)、导航设备、全球定位系统(GPS)接收机、事件数据记录器(EDR)、飞行数据记录器(FDR)、车载娱乐设备、船用电子装备(例如，船用导航装备、陀螺仪等)、航空装备、安全装备、车辆头部单元、工业或家用机器人、银行的自动取款机(ATM)、零售店的销售点(POS)设备。
根据本公开的一些实施例，电子设备可以包括以下中的至少一个：家具或建筑物/结构的一部分、电子板、电子签名接收设备、投影仪和包照相功能的各种测量仪器(例如，水表、电表、燃气表、电子测波计等)。根据本公开各种实施例的电子设备也可以是上述列举的设备中的一种或多种设备的组合。同样，根据本公开各种实施例的电子设备可以是柔性设备。根据本公开各种实施例的电子设备不局限于上述列举的设备。
下文中，将参考附图描述根据本公开各种实施例的电子设备。
图1是示出了根据本公开各种实施例的电子设备的结构的方框图。
参考图1，根据本公开各种实施例的电子设备100可以包括显示单元110、输入单元120、存储单元130、通信单元140和控制器150。
显示单元110可以在控制器150的控制下在内容屏幕上显示内容。例如，控制器150处理(例如，放大、缩小等)网页，并且将已处理的网页存储在存储器(例如帧缓冲器)中。显示单元110可以将在帧缓冲器中存储的网页的一部分转换为模拟信号，并且在屏幕上显示所述模拟信号。
显示单元110可以包括显示面板或全息图。显示面板可以是例如液晶显示器(LCD)、有源矩阵有机发光二极管(AM-OLED)等。显示面板可以实现为是例如柔性的、透明的或可穿戴的。全息图可以使用光的干涉在空气中示出三维图像。显示单元110还可以包括用于控制显示面板或全息图的控制电路。
显示面板可以包括“触摸板111”，所述触摸板是用于用户和电子设备100之间相互作用的输入单元。然后，显示单元110可以与触摸屏互换。
触摸板111可以实现为叠加型，其中触摸板111位于显示单元110的屏幕上，或者实现为单元上或单元内型，其中将触摸板111插入到显示单元110中。触摸板111可以按照以下中的至少一种来检测用户输入，例如电容型、电阻型、红外型和超声波型，产生与用户输入相对应的事件，并且将所产生的事件传输至控制器150。
触摸板111可以检测导电物体(也就是输入体(例如手指或铁笔))的手势，所述输入体直接接触屏幕，或者邻近或悬置于其中触摸板111可以检测物体的预定范围内。触摸板111可以产生与手势相对应的事件，并且将所产生的事件传输至控制器150。
例如，输入单元120可以包括触摸按键，所述触摸按键与在显示单元110中安装的触摸板111不同。触摸按键可以识别人体和物体的触摸或邻近。输入单元120可以响应于用户输入来产生事件，并且将所产生的事件传输至控制器150。输入单元120还可以包括与触摸类型不同类型的按键(例如，拱形键)。例如，当用户按压所述拱形键时，所述拱形键变形以接触印刷电路板，并且相应地在印刷电路板上产生了按键事件，并且将按键事件发送至控制器150。
存储单元130可以在控制器150的控制下，存储由电子设备100产生的或者通过通信单元140从外部设备接收的数据(例如，消息和网页)。存储单元130存储引导程序、至少一个操作系统和应用程序。存储单元130存储用于设置电子设备100的用户环境的多个设置信息(例如，与屏幕亮度有关的信息等)。因此，控制器150可以参考设置信息来操作电子设备100。
存储单元130可以包括主存储器和辅助存储器。主存储器例如可以由随机存取存储器(RAM)来实现。辅助存储器可以由盘、RAM、只读存储器(ROM)或闪存存储器来实现。主存储器可以存储从辅助存储器加载的各种程序，例如引导程序、操作系统(例如内核)、中间件、应用程序接口(API)和应用程序。当将电池的电力供应至控制器150时，引导程序可以被首先加载到主存储器。引导程序可以将操作系统加载到主存储器。操作系统可以将应用程序加载到主存储器。控制器150可以访问主存储器以译解程序的命令(例程)，并且根据译解的结果来执行功能。
存储单元130还可以包括外部存储器。例如，存储单元130还可以包括紧凑闪存(CF)、安全数字(SD)、微-SD、迷你-SD、超数字(xD)或存储棒作为外部存储器。
根据本公开的各种实施例，存储单元130可以存储显示控制模块131。显示控制模块131可以配置为允许控制器150执行控制内容显示的功能。
通信单元140可以在控制器150的控制下通过网络执行与外部设备的语音呼叫、视频呼叫或数据通信。通信单元140可以包括蜂窝模块(例如，通过通信网络(长期演进(LTE)、LTE-高级(LTE-A)、码分多址(CDMA)、宽带CDMA(WCDMA)、通用移动电信系统(UMTS)、无线宽带(WiBro)或全球移动通信系统(GSM)提供语音呼叫、视频呼叫、文本消息服务或因特网服务的通信模块，数字广播模块(例如，数字多媒体广播(DMB)模块)，以及短距离通信模块(例如Wi-Fi模块、蓝牙模块和近场通信(NFC)模块))。
控制器150控制电子设备100的总体操作以及电子设备100的内部部件之间的信号流，处理数据，并且控制从电池到部件的电力供应。
控制器150可以包括处理器151。处理器151可以包括应用处理器(AP)、通信处理器(CP)、图形处理单元(GPU)和音频处理器。CP可以是通信单元140的蜂窝模块的部件。
处理器151(例如AP)可以通过使用显示控制模块131实现各种内容显示方法。下文中，将详细地描述根据本公开各种实施例的内容显示方法。
电子设备还可以包括用于检测物理量(例如，加速度、重力等)的传感器。传感器可以将对所检测的物理量加以表示的数据传输至控制器150。控制器150可以基于从传感器接收的数据来识别电子设备100的位置，基于所述位置来确定屏幕显示模式是水平模式还是垂直模式，并且根据所确定的模式来控制显示单元110显示内容。水平模式可以指的是横向风景模式，而垂直模式可以指的是人像模式。
此外，诸如耳机插孔、GPS接收模块、扬声器、麦克风等之类的上文没有提到的部件还可以被包括在电子设备100中。电子设备100还可以包括用于与外部设备的有线连接的接口单元。所述接口单元可以通过线(例如USB缆线)与外部设备相连。然后，控制器150可以通过接口单元执行与外部设备的数据通信。
图2是示出了根据本公开各种实施例的内容显示方法的流程图。
参考图2，在操作210中，控制器150可以确定要在屏幕上显示的内容的版面。这种操作可以包括确定所确定的内容的宽度(即版面宽度)的操作，以及根据版面宽度确定内容的组成部分的位置和大小并且排列组成部分(换句话说，称作视觉格式编排或回流)的操作。可以根据视口比率(例如宽度∶高度＝16∶9)来确定内容的版面高度。可以将版面宽度确定为预定值(例如980px)。另外，可以将版面宽度确定为与相应内容相关的附加信息(例如，视口元标签和层叠式样式表(CSS)设备适配)中限定的设备宽度。例如，当屏幕分辨率确定为与逻辑尺寸相对应的1280x800，并且屏幕处于横向风景模式(即，“1280”是宽度)时，如果电子设备100从外部设备接收限定为<metaname＝″viewport″width＝″device-width″>的内容时，可以将版面宽度确定为1280。当屏幕处于人像模式时，可以将版面宽度确定为800。
在操作215中，控制器150可以确定所确定的版面宽度“Wc”是否比预设的“最优宽度”(例如，内容屏幕宽度“Ws”)宽预设阈值或更多。内容屏幕可以是显示单元110的整个屏幕。另外，内容屏幕可以是屏幕的分配为显示区域的部分区域(例如，浏览器窗口)。同时，可以将位于内容的最上面部分中的组成部分称作页眉，并且将位于内容的最下面部分中的组成部分称作页脚。可以将Wc确定为位于除了页眉和页脚之外的版面中心处的组成部分的宽度，而不是版面宽度。
Ws＜＜Wc(即，Wc比Ws宽预设阈值或更多时)，控制器150可以确定所述内容的组成部分的一个或多个作为主要组成部分。将通过下面描述的图3和图4提供操作220的示例。
在操作225中，控制器150可以确定主要组成部分的属性是否满足预设条件。例如，操作225可以包括确定作为主要组成部分的属性，主要组成部分的面积是否大于预设阈值面积的操作。操作225也可以包括确定主要组成部分的宽度是否大于预设阈值宽度的操作。
当主要组成部分的属性满足预设条件时(例如，当主要组成部分的面积大于阈值面积时)，在操作230中，控制器150可以检查内容版面，并且确定临近主要组成部分是否存在其他组成部分。当临近主要组成部分不存在其他组成部分时，控制器150可以执行下面描述的操作250。
在操作235中，当临近主要组成部件存在其他组成部分时，控制器150可以确定其他组成部分的属性是否满足预设条件(例如，尺寸、位置、组成部分所属的层、显示属性等)。将通过下面描述的图5A、5B和6提供操作235的示例。
当其他组成部分的属性不满足预设条件时，控制器150可以执行操作250。当其他组成部分的属性满足预设条件时，在操作240中控制器150可以根据基于主要组成部分和其他组成部分而重新计算的版面宽度来重新配置内容版面。例如，控制器150可以重新配置内容版面以去除主要组成部分和其他组成部件之间的空白区。控制器150可以在执行操作240之后重新执行操作215。
同时，当基于操作215的确定结果，Ws≤Wc时(也就是说，当Wc比Ws宽小于预设阈值的值时)，或者当基于操作225的确定结果，主要组成部分的属性不满足预设条件时(例如，当主要组成部分的面积等于或小于阈值面积时)，在操作250中控制器150可以控制显示单元110在屏幕上显示内容。将通过下面描述的图7A、7B、8A、8B、9A、9B、9C和9D提供操作250的示例。
根据本公开的各种实施例，可以省略操作215。例如，与版面宽度是否比屏幕宽度窄无关，控制器150可以在确定内容版面之后执行操作220。也就是说，即使版面宽度宽于屏幕宽度，也可以执行操作220和后续的操作。
图3示出了根据本公开实施例的内容版面的示例和确定主要组成部分的方法。
例如，可以根据相应内容中包括的内容的类型(例如，图像、文本等)将内容(例如网页)划分为定界符(例如，定界符号、框等)和多个组成部分。可以将组成部分中的至少一个确定为主要组成部分。例如参考图3，可以将组成部分中具有最大尺寸的组成部分310确定为主要组成部分。可以将组成部分中位于最上面部分处的组成部分320确定为页眉，并且将位于最下面部分处的组成部分330确定为页脚。
图4示出了根据本公开实施例的内容版面的另一个示例和确定主要组成部分的方法。
可以将内容的几个组成部分确定为一个主要组成部分。例如，参考图4，当除了页眉410之外的组成部分420、430、440和450具有大于或等于预设阈值的宽度、并且连续地排列时，可以将这些组成部分确定为一个主要组成部分。
根据本公开的各种实施例，控制器150可以检查在每一个组成部分中包括的内容的量(例如，字母的个数)，并且因此可以确定具有最大内容的组成部分作为主要组成部分。
根据本公开的各种实施例，控制器150可以基于组成部分的位置来确定主要组成部分。例如，可以将组成部分中最靠近版面中央的组成部分确定为主要组成部分。
图5A和5B示出了根据本公开实施例的内容版面的另一个示例和重新配置内容版面的方法。
参考图5A，具有宽度“W1”的版面可以包括页眉510、页脚520和左组成部分530、右组成部分540和位于页眉510和页脚520之间的中央组成部分550。控制器150可以基于通过图3和图4所示的确定方法将中央组成部分550确定为主要组成部分。随后，控制器150可以发现组成部分530和540存在于中央组成部分550的两侧，并且确定组成部分530和540是其他主要组成部分(也就是说，组成部分530和540是除了先前确定的主要组成部分之外的其他重要的主要组成部分)。根据本公开的实施例，控制器150可以计算左组成部分530的宽度(lLeft-lRight)，并且当所计算的宽度大于或等于预设阈值宽度时，确定左组成部分530作为主要组成部分之一。另外，控制器150可以计算右组成部分540的宽度(rLeft-rRight)，并且当所计算的宽度大于或等于预设阈值宽度时，确定右组成部分540作为另一个主要组成部分。同时，当所计算的宽度小于阈值宽度时，可以从主要组成部分中排除相应的组成部分。
参考图5B，控制器150可以识别在中央组成部分550与一个或更多个组成部分(例如，组成部分530和540)之间存在空白区，并且重新排列组成部分530和540以去除空白区。控制器150可以确定中央组成部分550以及组成部分530和540作为主要组成部分。此外，控制器150可以将版面宽度从“W1”变窄至“W2”(新确定的主要组成部分的宽度)，并且根据宽度“W2”重新排列页眉510内的元素和页脚520内的元素。
根据本公开的各种实施例，可以省略去除空白区的操作。于是，可以将组成部分530和540的宽度“W3(lLeft-rRight)”确定为主要组成部分的宽度。版面宽度可以从“W1”变化为“W3”，并且可以根据宽度“W3”重新排列页眉510内的元素和页脚520内的元素。
根据本公开的以上实施例，例如，可以将主要组成部分的宽度确定为中央组成部分550的宽度，即W2或W3。根据本公开的各种实施例，当需要根据诸如媒体查询之类的条件来改变内容时，还可以将主要组成部分的宽度进一步扩大超过W2或W3。例如，当所确定的宽度是1000但是存在根据1100改变内容的条件时，将宽度扩大为超过1000的1100，从而可以防止内容的一些组成部分未被示出。媒体查询可以是根据设备分辨率灵活地改变页面版面的web标准。例如，相对于针对样式定义的“#img”标签，当设备的水平宽度是1000像素或以上时，图像用300px显示，并且因此在1280x800设备中的横向风景模式/人像模式下具有不同的尺寸。如上所述，因为可以根据设备的宽度改变内容，因此可能需要标识媒体查询。
media(max-width：1000px){#img{width：300px；}
media(max-width：800px){#img{width：200px}
图6示出了根据本公开实施例的内容版面的另一个示例和不适于主要组成部分的示例。
参考图6，组成部分621、622和623可以存在于主要组成部分610的左侧，并且组成部分631、632和633可以存在于主要组成部分610的右侧。
可以基于相应的组成部分的位置来确定组成部分是否包括在是主要组成部分中。例如，假设组成部分610的上侧的y坐标是“Y1”并且组成部分610的下侧的y坐标是“Y2”。当临近主要组成部分的组成部分存在于“Y1”和“Y2”之间的范围中时，可以将相应的组成部分确定为主要组成部分。换句话说，当任意组成部分的上侧位于主要组成部分610的上侧以下、并且所述组成部分的下侧位于所述主要组成部分610的下侧以上时，可以将相应的组成部分确定为另一个主要组成部分。基于以上描述，因为组成部分621、622、623、631和632部分地脱离了范围“Y1-Y2”，可以从主要组成部分中排除组成部分621、622、623、631和632。
根据本公开的各种实施例，可以基于相应组成部分的面积来确定所述组成部分是否包括在主要组成部分中。例如，控制器150可以计算组成部分633的面积，当所计算的面积大于或等于预设阈值面积时确定相应的组成部分作为主要组成部分之一，并且当所计算的面积小于阈值面积时排除相应的组成部分。
根据本公开的各种实施例，可以基于相应组成部分的类型来确定所述组成部分是否包括在主要组成部分中。例如，控制器150可以分析在相应组成部分中包含的文本，并且当基于分析的结果找到了不适合主要组成部分的词(例如，与广告相关的词)时，从主要部分排除所述相应组成部分。当没有找到不适合主要组成部分的词时(也就是说，当相应组成部分的类型配置为主要组成部分的类型时)，可以将所述相应组成部分确定为主要组成部分。控制器150可以分析与相应组成部分相关的附加信息(例如，链接信息)，并且当基于分析结果，所述附加信息不合适时(例如，当在已知的有害站点列表中包括所链接的站点时)，可以从主要组成部分中排除相应组成部分。有害站点列表可以存在于本地数据库，(DB，例如存储单元130)中。当然，有害站点列表可以存在于外部设备中，并且相应地，控制器150可以通过通信单元140访问所述外部设备以识别所述有害站点列表。同时，当附加信息是合适的时(例如，当在有害站点列表中不包括所链接的站点时)，可以确定所述相应组成部分作为主要组成部分之一。
根据本公开的各种实施例，可以基于以上条件(即，宽度、面积、位置和类型)中的至少两个或更多个来确定组成部分是否可以包括在主要组成部分中。例如，当宽度满足作为主要组成部分的条件，但是面积不满足作为主要组成部分的条件时，可以从主要组成部分中排除相应组成部分。当宽度、面积和位置满足作为主要组成部分的条件，但是类型没有配置为主要组成部分的类型时，可以从主要组成部分中排除相应组成部分。当类型配置为主要组成部分的类型时，即使宽度、面积和位置不满足作为主要组成部分的条件，也可以将相应组成部分确定为主要组成部分。
根据本公开的各种实施例，可以基于相应组成部分的显示属性来确定所述组成部分是否可以包括在主要部分中。例如，可以将具有“绝对”的显示属性的组成部分确定为与“主要组成部分”相区分(或者相独立)。可以将这种组成部分确定为另一个主要组成部分。替代地，可以在分离处理(例如，去除组成部分之间的空白区)之后，将组成部分确定为另一个主要组成部分。可以将具有“固定的”显示属性的组成部分确定为与“主要组成部分”无关。当任意组成部分的属性是“动画”时，可以将相应组成部分确定为主要组成部分。相反地，可以从主要组成部分中排除具有“动画”属性的组成部分。
根据本公开的各种实施例，可以根据每一个层来划分内容的组成部分。例如，与所述主要组成部分临近存在的组成部分的层与主要组成部分的层不同，可以从主要组成部分中排除相应组成部分。当与主要组成部分临近存在的组成部分的层与主要组成部分的层相同时，控制器150可以在操作中确定相应组成部分的属性是否满足预设条件(例如，尺寸、位置、类型、显示属性等)。当满足条件时，可以将相应组成部分确定为另一个主要组成部分。
图7A和7B示出了根据本公开实施例的用于描述版面重新配置方法的屏幕。
参考图7A，可以在屏幕上显示网页720，例如浏览器窗口710。网页720可以包括页眉721、页脚722和组成部分723。可以在浏览器窗口710的上部分上显示页眉721，可以在浏览器窗口710的下部分上显示页脚722，并且可以在页眉721和页脚722之间显示组成部分723的一部分723a。同时，可以显示页眉721和页脚722，使得页眉721和页脚722的宽度适合浏览器窗口710的宽度。因为组成部分723的宽度窄于浏览器窗口710的宽度，可以临近组成部分723产生空白区。
参考图7B，控制器150可以基于屏幕的宽度重新配置网页720的版面。例如，当屏幕710的逻辑尺寸是1280x800时，网页的版面宽度根据屏幕尺寸可以是1280。随后，控制器150可以确定组成部分723作为主要组成部分。当主要组成部分723的宽度是1000时，控制器150可以将版面宽度从1280改变为1000。控制器150可以根据改变后的宽度来控制页眉721和页脚722的每一个的宽度。例如，控制器150可以将页眉721的元素721a和721b之间的间隔控制为从“d1”至“d2(d2＜d1)”。随后，控制器150可以扩大网页720以适合已经重新配置了版面的屏幕宽度，并且控制显示单元110显示扩大的网页720。
图8A和8B示出了根据本公开实施例的用于描述放大网页中的主要组成部分的方法的屏幕。
参考图8A，可以显示网页820的一部分(包括如图8A所示的主要组成部分821的一部分)以适合屏幕810的宽度。控制器150可以通过触摸板111识别缩小手势(例如，用户的两个手指触摸在屏幕上并且然后使它们靠近一起(也就是说合拢)的动作)。
参考图8B，控制器150可以响应于缩小手势来减小网页820，并且控制显示单元110在屏幕上显示减小的网页的一部分(包括如图8B所示的减小的主要组成部分821的一部分)。随后，当识别放大手势(例如，用户的两个手指触摸在屏幕上并且然后移动它们分开(也就是说打开)的动作)时，控制器150可以扩大网页820以适合如图8A所示的屏幕820的宽度，并且控制显示单元110显示扩大的网页820的一部分。
当存在由于内容的版面宽度窄于屏幕宽度而导致的空白区时，内容版面可以重新配置以去除空白区(参见图7A和7B及其相关描述)，或者可以扩大主要组成部分以适合屏幕宽度(参见图8A和8B及其相关描述)。然而根据本公开的各种实施例，可以向空白区添加一些信息，而无须重新配置版面或者即使执行了版面的重新配置也无需放大手势。
图9A至9D示出了根据本公开实施例的用于描述在网页中临近主要组成部分存在的空白区中显示附加信息的方法的屏幕。
参考图9A，可以在屏幕上显示网页的一部分(例如，页眉910和主要组成部分的一部分920)。当屏幕宽度比主要组成部分的宽度相对较宽时，可以临近主要组成部分的该部分920出现空白区921和922。
控制器150可以控制主要组成部分的该部分920的位置。例如参考图9B，控制器150可以控制显示单元110在屏幕的最左侧上显示主要组成部分的该部分920。
参考图9C，控制器150可以在空白区923中设置附加信息。例如，在空白区923中，可以设置相应网页的小地图930、相应网页的一些组成部分940(例如文章)和快速访问信息950(例如，应用程序列表)。
当在重新配置内容版面之后存在空白区时，控制器150可以将附加信息重新设置在空白区中。例如，参考图9D，控制器150可以重新配置页眉910的元素以将所述元素设置在空白区923的上部分上，并且将附加信息(例如，小地图930和一些组成部分940)设置在所述元素的下面。
同时，附加信息可以是书签、历史(例如，访问网页的列表)、与当前显示的网页相关的网站列表、与当前显示的文章相关的文章列表、与当前显示的网页的主要组成部分相关的信息或搜索结果以及上述信息。
图10是示出了根据本公开各种实施例的移动内容的方法的流程图。
参考图10，在操作1010中，控制器150可以控制显示单元110在屏幕上至少显示内容的组成部分中的主要组成部分。
在操作1020中，控制器150可以通过触摸板111识别输入体的移动(例如手指或笔)及其移动方向。
在操作1030中，控制器150可以响应于所述移动，在使得主要组成部分的左右边界不超过屏幕的左右边界的同时，沿所识别的方向(或者校正的方向)移动所述内容。将通过下面描述的图11和12提供操作1030的示例。
图11A至11C示出了根据本公开实施例的在主要组成部分的边界没有脱离屏幕的同时移动内容的方法的示例。
参考图11A，内容1110包括主要组成部分1120。主要组成部分1120包括确定主要组成部分1120的宽度的左侧1121和右侧1122以及确定主要组成部分1120的高度的上侧1123和下侧1124。可以将所述侧边限定为用于与其他组成部分相区分的边界。可以在屏幕1130上显示包括左侧1121的一部分和右侧1122的一部分在内的主要组成部分1120的一部分。
响应于输入体的移动，控制器150可以获取对移动的方向1140加以表示的值。例如，控制器150从触摸板111接收与所述移动相对应的事件。所述事件可以包括沿x轴方向的移动值“x”以及沿y轴方向的移动值“y”。控制器150可以根据“x”和“y”来计算对移动的方向1140加以表示的值(例如角度(θ1))。当确定主要组成部分1120的边界没有脱离屏幕1130时，控制器150可以沿所述方向1140移动内容1110。
参考图11B，在x＜y的情况下(也就是说，当沿所述移动的方向1140，垂直分量大于水平分量时)，如果内容1110沿方向1140移动，控制器150可以确定主要组成部分1120的边界是否脱离屏幕1130。当确定所述边界脱离屏幕1130时，控制器150可以校正所述方向1140。例如，控制器150可以对所述方向1140进行校正。例如，控制器150可以将x校正为x’(也就是说，减小水平分量的值)，并且根据x’和y来计算“θ2”(是对校正的方向1150加以表示的值)。控制器150可以沿所校正的方向1150移动内容1110。
参考图11C，控制器150可以确定主要组成部分1120的边界是否靠近屏幕的边界。当两个边界彼此靠近时(例如，当两个边界之间的间隔小于预设阈值间隔时)，控制器150可以沿垂直方向1160移动内容1110(也就是说，去除了水平分量的校正方向)。
图12A至12B示出了根据本公开实施例的在主要组成部分的边界没有脱离所述屏幕的同时移动内容的方法的另一个示例。
参考图12A和12B，可以显示内容1210的主要组成部分1220以适合屏幕1230的宽度。控制器150可以获取对移动的方向1240加以表示的值(例如，角度(θ))。当方向1240的垂直分量大于方向1240的水平分量时，控制器150可以沿垂直方向1250移动内容1210。
图13是示出了根据本公开各种实施例的扩大主要组成部分以适合屏幕的方法的流程图。
参考图13，在操作1310中，控制器150可以控制显示单元110在屏幕上至少显示内容的组成部分中的主要组成部分。
在操作1320中，控制器150可以通过触摸板111识别输入体(例如，手势或笔)在屏幕上的放大手势。
在操作1330中，当控制器150可以识别将要放大的目标为主要组成部分。例如，1)当在主要组成部分内产生多触摸时，2)当在主要组成部分内产生多触摸中的至少一个触摸时，或者3)当多触摸的至少一个触摸非常靠近主要组成部分的边界时(例如，当触摸坐标和边界之间的间隔小于预设的阈值间隔时)，可以将要放大的目标识别为所述内容的主要组成部分。
在操作1340中，控制器150可以扩大所述主要组成部分，使得所述主要组成部分的宽度适合屏幕宽度，并且控制显示单元110显示扩大的主要组成部分。将通过下面描述的图14来提供操作1340的示例。
图14A和14B示出了根据本公开各种实施例的自动控制内容的主要组成部分以适合屏幕的方法的示例。
参考图14A，内容1410包括主要组成部分1420。可以在屏幕1430上显示包括左侧1421的一部分和右侧1422的一部分在内的主要组成部分1420的一部分。控制器150可以识别放大手势1440的产生，并且识别所述放大手势1440的目标是主要组成部分1420。参考图14B，当要放大的目标是主要组成部分1420时，控制器150可以放大内容1410，使得主要组成部分1420适合屏幕1430的宽度。
如在本公开的各种实施例中所使用的，术语“模块”可以指例如包括硬件、软件和固件之一或者两个或多个的组合在内的“单元”。“模块”可以与诸如单元、逻辑、逻辑块、组件或电路之类的术语互换。“模块”可以是集成组件的最小单元或一部分。“模块”可以是用于执行一个或多个功能的最小单元或最小单元的一部分。“模块”可以机械地或者电学地实现。例如，根据本公开各种实施例的“模块”可以包括专用集成电路(ASIC)芯片、现场可编程门阵列(FPGA)和用于执行已知或者将来开发的某些功能的可编程逻辑器件中的至少一个。
根据本公开各种实施例的装置(例如，其模块或功能)或方法(例如，操作)的至少一部分可以通过以程序模块的形式存储在计算机可读存储介质中的命令来实现。当通过处理器执行所述命令时，所述处理器可以执行与所述命令相对应的功能。例如，所述非瞬时计算机可读存储介质可以是存储单元130的存储器。可以通过处理器来实现(例如执行)程序模块的至少一部分。程序模块的至少一部分可以包括例如用于执行一个或多个功能的模块、程序、常规程序、指令集和/或过程。
非瞬时计算机可读记录介质可以包括磁介质(诸如硬盘、软盘或磁带)、光学介质(诸如紧凑盘只读存储器(CD-ROM)或数字通用盘(DVD))、磁光介质(诸如光磁软盘)以及硬件装置(诸如专门配置为存储和执行程序命令的ROM、RAM和闪存)。此外，程序指令可以包括通过编译器创建的机器语言代码和可由计算机使用解释器执行的高级语言代码。上述硬件装置可以配置为作为一个或多个软件模块操作以便执行本公开各种实施例的操作，反之亦然。
根据本公开各种实施例的模块或编程模块可以包括上述部件中的一个或多个，可以省略它们中的一些或者还可以包括附加的其他部件。由根据本公开各种实施例的模块、编程模块或其他部件执行的操作可以按照顺序、并行、重复或探索的方式执行。此外，可以基于不同的顺序执行一些操作，可以省略一些操作，或者可以包括附加的不同操作。
尽管已经参考本公开的各种实施例示出和描述了本公开，但本领域普通技术人员应当理解，在不脱离所附权利要求及其等价物所限定的本公开的精神和范围的情况下，可以进行形式和细节上的多种改变。