CN114489636A - 用于将效果应用于设计元素的系统和方法 - Google Patents

用于将效果应用于设计元素的系统和方法 Download PDF

Info

Publication number
CN114489636A
CN114489636A CN202111228090.6A CN202111228090A CN114489636A CN 114489636 A CN114489636 A CN 114489636A CN 202111228090 A CN202111228090 A CN 202111228090A CN 114489636 A CN114489636 A CN 114489636A
Authority
CN
China
Prior art keywords
text string
selected text
design
computer
curved
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Pending
Application number
CN202111228090.6A
Other languages
English (en)
Inventor
D·R·冯
M·D·安德森
J·J·沃克尔
M·希布伦
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Canva Pty Ltd
Original Assignee
Canva Pty Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Canva Pty Ltd filed Critical Canva Pty Ltd
Publication of CN114489636A publication Critical patent/CN114489636A/zh
Pending legal-status Critical Current

Links

Images

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/103—Formatting, i.e. changing of presentation of documents
    • G06F40/109—Font handling; Temporal or kinetic typography
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
    • G06T11/00—2D [Two Dimensional] image generation
    • G06T11/20—Drawing from basic elements, e.g. lines or circles
    • G06T11/203—Drawing of straight lines or curves
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/38—Creation or generation of source code for implementing user interfaces
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/04847—Interaction techniques to control parameter settings, e.g. interaction with sliders or dials
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F3/00—Input arrangements for transferring data to be processed into a form capable of being handled by the computer; Output arrangements for transferring data from processing unit to output unit, e.g. interface arrangements
    • G06F3/01—Input arrangements or combined input and output arrangements for interaction between user and computer
    • G06F3/048—Interaction techniques based on graphical user interfaces [GUI]
    • G06F3/0484—Interaction techniques based on graphical user interfaces [GUI] for the control of specific functions or operations, e.g. selecting or manipulating an object, an image or a displayed text element, setting a parameter value or selecting a range
    • G06F3/0486—Drag-and-drop
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/103—Formatting, i.e. changing of presentation of documents
    • G06F40/106—Display of layout of documents; Previewing
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/12—Use of codes for handling textual entities
    • G06F40/151—Transformation
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/20—Software design

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • General Physics & Mathematics (AREA)
  • Software Systems (AREA)
  • Health & Medical Sciences (AREA)
  • Artificial Intelligence (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Computational Linguistics (AREA)
  • General Health & Medical Sciences (AREA)
  • Human Computer Interaction (AREA)
  • User Interface Of Digital Computer (AREA)

Abstract

本文描述的是一种计算机实现的方法。所述方法包括检测关于设计的选定文本串的弯曲文本效果的启动；确定半径；处理所述选定文本串以将所述选定文本串拆分成一个或多个文本串元素，每个文本串元素与字形相关联；为每个文本串元素计算包括元素旋转数据和元素位置数据的元素变换，所述元素变换基于所述半径；以及对于给定文本串元素，通过基于为所述给定文本串元素计算的所述元素变换来呈现所述给定文本串元素所相关联的所述字形，来呈现每个文本串元素。

Description

用于将效果应用于设计元素的系统和方法
技术领域
本公开涉及用于将效果应用于设计元素的系统和方法。
背景技术
存在用于创建并发布设计或其它视觉内容的各种计算机实现的工具。一般来说，这样的工具允许用户创建(例如)页面，然后向该页面添加设计元素。
典型地，给定设计工具提供大量不同类型的设计元素，这些元素可以或者通过由用户从头开始创建或者通过从元素库(例如，形状库或其它图形库)中访问而添加到页面中。此外，对于任何给定元素，通常会有许多属性和参数可以调整，以便以某种方式改变元素的外观。
提供大量的元素类型，并且对于每种元素类型，各种可调整参数在许多情况下是有利的，因为这允许用户创建复杂且精巧的设计。然而，它也可能引入不利因素。例如，在存在大量可用的元素类型以及大量用于操作这些元素的选项的情况下，用户可能不知道通过创建特定效果是可能的。即使用户知道(或怀疑)创建特定效果是可能的，他们也可能无法创建这样的效果，更不用说以有效的方式这样做了。
本说明书中描述的背景技术信息是发明人已知的背景技术信息。将此信息称为背景技术信息并不意味着承认或表明此背景技术信息为现有技术或者为本领域普通技术人员公知的常识。
发明内容
本文描述了一种计算机实现的方法，包括：检测关于设计的选定文本串的弯曲文本效果的启动；确定半径；处理所述选定文本串以将所述选定文本串拆分成一个或多个文本串元素，每个文本串元素与字形相关联；为每个文本串元素计算包括元素旋转数据和元素位置数据的元素变换，所述元素变换基于所述半径；以及对于给定文本串元素，通过基于为所述给定文本串元素计算的所述元素变换来呈现所述给定文本串元素所相关联的所述字形，来呈现每个文本串元素。
本文还描述了一种计算机处理系统，包括：处理单元；显示器；以及存储指令的非暂时性计算机可读存储介质，所述指令由所述处理单元执行，使得所述处理单元：检测关于设计的选定文本串的弯曲文本效果的启动；确定半径；处理所述选定文本串以将所述选定文本串拆分成一个或多个文本串元素，每个文本串元素与字形相关联；为每个文本串元素计算包括元素旋转数据和元素位置数据的元素变换，所述元素变换基于所述半径；以及对于给定文本串元素，通过基于为所述给定文本串元素所计算的所述元素变换来呈现所述给定文本串元素所相关联的所述字形，来在所述显示器上呈现每个文本串元素。
附图说明
在附图中：
图1描绘可以实施本公开的特征的示例环境。
图2为能配置成执行本文描述的各种特征的示例计算机处理系统。
图3提供示例设计创建用户界面。
图4提供示例效果控件界面。
图5提供弯曲文本的示例。
图6提供可替换示例效果控件界面。
图7为描绘将弯曲文本效果应用于选定文本串设计元素所涉及的操作的流程图。
图8、图9、图10提供弯曲文本的示例。
图11为描绘计算建议半径所涉及的操作的流程图。
图12和图13提供弯曲文本的示例。
图14提供文本串的示例。
虽然所要求保护的本发明可以有各种修改和可替换形式，但是在附图中以示例的方式示出具体实施例，并且详细描述具体实施例。然而，应当理解，附图和具体实施方式并不意在将本发明限制于所公开的特定形式。意图是覆盖落入由所附权利要求定义的本发明的精神和范围内的所有修改、等同物和替换物。
具体实施方式
在以下描述中，阐述许多具体细节，以便提供对所要求保护的发明的透彻理解。然而，显而易见的是，所要求保护的发明可以在没有这些具体细节的情况下实践。在一些情况下，熟知的结构和装置以框图形式示出，以避免不必要的模糊。
如上所述，存在用于创建并发布视觉内容的许多工具。本公开总体上集中于获取文本串并以弯曲形式呈现它。
首先，提供对文本的简要概述。接下来，将描述可以实施本公开的特征的网络化环境和计算机处理系统。描述用于创建设计的示例用户界面，随后是应用并调整对选定设计元素的效果所涉及的处理。
本公开涉及处理文本串。在计算环境中，文本串可以以各种方式存储、通信并显示。在本公开中，文本串为一个或多个字符集。文本串的每个字符由字符信息定义，在本公开中，字符信息包括字符标识符和文本属性。
字符标识符定义字符是什么，例如，字母“a”、符号“&”、笑脸表情符号
Figure BDA0003314917950000031
或任何其它字符。识别字符的一种常见方式是Unicode标准或Unicode代码空间，例如，Unicode变换格式——8位(UTF-8)编码方案。在此方案中，字符(例如，字母、数字、符号、表意文字、表情符号等)由代码点标识。例如，Unicode代码点“U+0041”为拉丁文大写字母A，Unicode代码点“U+1F600”为笑脸表情符号/表情图标。本文描述的技术可以应用于用于表示文本的可替换方案/机制。
文本属性提供有关如何显示与特定字符对应的字形的信息。这些文本属性可以包括诸如字体类型、字体大小、字体样式(斜体、粗体等)、行高、字母间距和/或其它属性的属性。
一般来说，字符标识符和相关属性允许计算字形显示尺寸，例如，字形宽度和字形高度。使用这样的尺寸，可以计算所显示文本串的总尺寸，例如，线性文本串长度(所有字形宽度的总和)和线性文本串高度(文本串中所有字符的最大字形高度)。
例如，“A”是包含单个字符“A”(代码点U+0041)、Arial、12点的文本串。
Figure BDA0003314917950000041
(见图14的1402)为文本串，其包括：字符“A”(代码点U+0041)，Arial，12点；字符“b”(代码点U+0062)，Arial，12点，粗体；字符“c”(代码点U+0063)，Arial，12点，带下划线；字符“d”(代码点U+0064)，Arial，12点，斜体；字符“”(即空格，代码点U+0020)，Arial，12点；字符
Figure BDA0003314917950000042
(代码点U+1F600)，Arial，12点。
如下所述，在本公开中，生成弯曲文本串涉及将主题文本串拆分成一个或多个文本串元素集(例如，阵列)。
在某些实施例中，文本串元素对应于文本串的单个字符或明确定义字符组(即，通过组合字符明确组合的字符)。在这些实施例中，例如，拆分文本串
Figure BDA0003314917950000043
(1402)可以产生以下文本串元素集：
Figure BDA0003314917950000044
(见1404)
在其它实施例中，单个文本元素可以包括多个字符(无论是否通过组合字符明确连接)。例如，文本元素可以基于连字。例如，在这种情况下，拆分文本串，如图14的1406所示文本串，可以产生1408所示的三个元素。这与将相同的文本串(1406)拆分成单独的字符(这将产生1410所示的元素)形成对比。
在此示例中，元素为连接的连字组，而不是单个(或明确组合的)字符。连接的连字组可以包括多个单独的字符，即使这些字符没有被组合字符明确组合。
转向图1，提供网络化环境100的一个示例，在该网络化环境100中可以执行本文描述的各种操作和技术。
网络化环境100包括通过通信网络120(例如，互联网)互连的服务器系统102和客户端系统110。虽然图解并描述单个客户端系统110，但是服务器系统102典型地将服务于多个客户端系统。
服务器系统102包括一起操作以提供服务器端功能的各种功能部件。
服务器系统102的一个部件是前端服务器应用104。服务器应用104由计算机处理系统执行，以将服务器系统102配置为向一个或多个相应客户端应用(例如，下面描述的客户端应用112)提供服务器端功能。服务器端功能包括诸如用户帐户管理功能、登录功能和内容创建功能(例如，创建、保存、发布和共享内容(例如，设计))的操作。
为了提供服务器端功能，服务器应用104包括一个或多个应用程序、库、API、或其它软件元素。例如，在客户端应用112为网络浏览器的情况下，服务器应用104将为诸如Apache、IIS、nginx、GWS的网络服务器或可替换网络服务器。在客户端应用112为特定应用的情况下，服务器应用104将为被专门配置为与该客户端应用112交互的应用服务器。服务器系统102可以提供有网络服务器模块和应用服务器模块。
在本示例中，服务器系统102还包括用于存储服务器系统102在其操作过程中所需的各种数据的数据存储106。这样的数据可以包括，例如，用户账户数据、设计模板数据、设计元素数据、以及关于用户已经创建设计的数据。虽然描绘一个数据存储106，但是服务器系统102可以包括/利用多个分离的数据存储，例如，(存储用户账户细节的)用户数据存储、(存储诸如用户可以添加到正在创建的设计中的图形的设计元素的)一个或多个设计元素库数据存储、(存储用户可以用来创建设计的模板的)模板数据存储、(存储关于已经创建的设计的数据的)设计数据存储、和/或其它数据存储。
为了向客户端提供服务器端功能，服务器系统102典型地将包括除了图解和描述的功能部件之外的附加功能部件。作为一个示例，服务器系统102典型地将包括一个或多个防火墙(和/或其它网络安全部件)、(用于管理对服务器应用104的访问的)负载平衡器、和/或其它部件。
服务器系统102部件已经描述为功能部件，并且可以由硬件、软件(存储在存储器中并由一个或多个计算机处理系统执行的数据和计算机可读指令)、和/或硬件和软件的组合来实现。
服务器系统102的精确硬件架构将根据实施方式而变化。服务器系统102典型地包括直接或通过一个或多个网络(例如，一个或多个LAN、WAN、或(如果需要，具有诸如VPN的安全逻辑覆盖的)其它网络)相互通信的多个计算机处理系统(例如，服务器计算机)。
例如，服务器应用104可以在单个专用服务器计算机上运行，而数据存储106可以在(访问适当的数据存储资源的)分离的计算机上运行。作为可替换示例，服务器系统102可以为配置为基于用户需求104来投用/解除投用资源(例如，服务器应用104)的可扩展系统。在这种情况下，可能有运行通过负载平衡器为客户端服务的多个服务器应用104的多个服务器计算机(节点)。
在示例环境100中示出单个服务器系统102。在某些实施例中，客户端系统110(和/或服务器系统102)可以访问附加服务器系统，例如，客户端系统和服务器系统可以访问以获得可以添加到设计中的设计元素的第三方内容服务器。
客户端系统110托管客户端应用112，当客户端应用112被客户端系统110执行时，客户端应用112将客户端系统110配置成为服务器系统102的服务器应用104提供客户端功能/与之交互。通过客户端应用112，用户可以与服务器应用104交互，以便执行各种操作，诸如创建、编辑、保存、检索/访问、发布和共享设计。
客户端应用112可以为通过适当的统一资源定位符(URL)访问服务器应用104并通过通用万维网协议(例如，http、https、ftp)与服务器应用104通信的网络浏览器应用(诸如，Chrome、Safari、因特网浏览器、Opera、或可替换的网络浏览器应用)。可替换地，客户端应用112可以为被编程为使用定义的应用编程接口(API)调用与服务器应用104通信的特定应用。
在本示例中，客户端系统102还包括文本拆分模块114和变换模块116。在下面描述的实施例中，文本拆分模块114和变换模块116执行(或将客户端应用112配置为执行)与生成弯曲文本相关联的处理。
文本拆分模块114和/或变换模块116可以为软件模块，诸如与客户端应用112结合操作以扩展其功能的附加组件或插件。在可替换实施例中，模块114和116可以在客户端应用112本地。在又一替代实施例中，模块114和/或116可以为与客户端应用112通信的(在客户端系统110、服务器系统102或可替换服务器系统上运行的)独立应用。
客户端系统110可以为由硬件和/或软件配置(或可配置)以提供客户端功能的任何计算机处理系统。举例来说，客户端系统110可以为台式计算机、膝上型计算机、上网本计算机、平板计算装置、移动/智能电话装置、个人数字助理、或可替换计算机处理系统。
尽管在图1中未图解，但是客户端系统110典型地将具有安装在其上的附加应用，例如，至少一个操作系统应用(例如，移动操作系统(如果客户端系统为移动设备)、桌面操作系统(如果客户端系统110为桌面系统)、或者可替换操作系统)。
以上描述并在图1中图解的架构仅作为示例提供。许多变化都是可能的。
例如，虽然模块114和116已经被描述并图解为客户端系统110的一部分/安装在客户端系统110处，但是模块114和116提供的功能可以可替换地例如作为服务器应用104的附加或扩展、与服务器应用104通信的分离的独立式服务器应用、或服务器应用104的本地部分而由服务器系统102提供。
进一步可替换地，模块114和/或116提供的功能可以由协同操作的客户端应用(例如，112)和服务器应用(例如，104)来执行。
作为进一步的替代，由模块114和/或116提供的功能可以提供为完全分离的服务，例如，在与服务器系统102分离的服务器系统上运行并且根据需要与客户端应用112(和/或服务器系统102)通信以执行本文描述的效果功能。
此外，虽然已经描述了客户端-服务器架构，但是包括模块114和/或116(或者以其它方式配置为执行本文描述的处理)的内容创建系统可以在被安装并仅在诸如110的客户端系统上运行而不需要任何服务器应用的自给式应用中提供。
使用一个或多个计算机处理系统来实现本文描述的特征和技术。
例如，在上述网络化环境100中，客户端系统110为计算机处理系统(例如，个人计算机、平板/电话装置、或其它计算机处理系统)。类似地，使用一个或多个计算机处理系统(例如，服务器计算机或其它计算机处理系统)来实现服务器系统102的各种功能部件。
图2提供能配置成实施本文描述的实施例和/或特征的计算机处理系统200的框图。系统200为通用计算机处理系统。应当理解，图2没有示出计算机处理系统的所有功能或物理部件。例如，没有描绘电源或电源接口，然而系统200将携带电源或配置为连接到电源(或携带电源并且配置为连接到电源)。还将理解，特定类型的计算机处理系统将确定适当的硬件和架构，并且适于实施本公开的特征的可替换计算机处理系统可以具有比所描绘的部件更多、与其不同或比其更少的部件。
计算机处理系统200包括至少一个处理单元202。处理单元202可以为单个计算机处理装置(例如，中央处理单元、图形处理单元、或其它计算装置)，或者可以包括多个计算机处理装置。在计算机处理系统200被描述为执行操作或功能的一些情况下，执行该操作或功能所需的所有处理将由处理单元202来执行。在其它情况下，执行该操作或功能所需的处理也可以由系统200可访问并可使用(以共享或专用方式)的远程处理装置来执行。
通过通信总线204，处理单元202与存储用于控制处理系统200的操作的指令和/或数据的一个或多个机器可读存储(存储器)装置进行数据通信。在此示例中，系统200包括系统存储器206(例如，BIOS)、易失性存储器208(例如，诸如一个或多个DRAM模块的随机存取存储器)、以及非易失性存储器210(例如，一个或多个硬盘或固态驱动器)。
系统200还包括通常用212表示的一个或多个接口，系统200通过该一个或多个接口212与各种装置和/或网络连接。一般来说，其它装置可以与系统200集成，或者可以是分离的。在装置与系统200分离的情况下，装置和系统200之间的连接可以通过有线或无线硬件和通信协议建立，并且可以是直接或间接的(例如，联网的)连接。
与其它装置/网络的有线连接可以通过任何适当的标准的或专有的硬件和连接协议建立。例如，系统200可以配置为通过以下一者或多者与其它装置/通信网络进行有线连接：USB；火线(FireWire)；扩展型串行ATA；雷电接口；以太网；OS/2；并行；串行；HDMI；DVI；VGA；SCSI；音频端口。其它有线连接也是可能的。
与其它装置/网络的无线连接可以类似地通过任何适当的标准的或专有的硬件和通信协议建立。例如，系统200可以配置为使用以下一者或多者与其它装置/通信网络进行无线连接：红外；蓝牙(BlueTooth)；WiFi；近场通信(NFC)；全球移动通信系统(GSM)、增强型数据GSM环境、长期演进(LTE)、宽带码分多址(W-CDMA)、码分多址(CDMA)。其它无线连接也是可能的。
一般来说，并且根据所讨论的特定系统，系统200所连接(无论是通过有线还是无线方式)的装置包括允许数据被输入到系统200/由系统200接收以由处理单元202处理的一个或多个输入装置，以及允许数据被系统200输出的一个或多个输出装置。在本示例中，输入/输出装置通过一个或多个输入/输出装置接口214与系统200通过接口连接。下面描述示例装置，然而，应当理解，不是所有的计算机处理系统都将包括所有提及的装置，并且也可以很好地使用比那些提及的装置更多的装置以及替代那些提及装置的装置。
例如，系统200可以包括或连接到一个或多个输入装置，通过这些输入装置，信息/数据被输入到系统200(由系统200接收)。这样的输入装置可以包括键盘、鼠标、跟踪板、麦克风、加速度计、接近传感器、GPS装置等。系统200还可以包括或连接到由系统200控制的一个或多个输出装置，以输出信息。这样的输出装置可以包括诸如显示器(诸如，CRT、LCD、LED、等离子体、触摸屏、或其它显示器)、扬声器、振动模块、LED/其它灯等装置。系统200还可以包括或连接到既可以作为输入装置又可以作为输出装置的装置，例如，系统200可以从其读取数据和/或向其写入数据的存储器装置(硬盘驱动器、固态驱动器、磁盘驱动器、紧凑型闪存卡、SD卡等)、以及既可以显示(输出)数据又可以接收触摸信号(输入)的触摸屏显示器。
举例来说，在系统200为诸如110的客户端系统的情况下，它可以包括显示器218(其可以为触摸屏显示器)、相机装置220、麦克风装置222(其可以与相机装置集成)、定点装置224(例如，鼠标、轨迹板、或其它定点装置)、键盘226、以及扬声器装置228。
系统200还包括用于与网络(诸如环境100的网络120(和/或服务器系统102内的本地网络))通信的一个或多个通信接口216。通过通信接口216，系统200可以向联网装置传送数据以及从联网装置接收数据，联网装置本身可以是其它计算机处理系统。
系统200可以为任何合适的计算机处理系统，例如，服务器计算机系统、台式计算机、膝上型计算机、上网本计算机、平板计算装置、移动/智能电话、个人数字助理、或可替换计算机处理系统。
系统200存储或访问当由处理单元202执行时将系统200配置为接收、处理和输出数据的计算机应用(也称为软件或程序)，即，计算机可读指令和数据。指令和数据可以存储在系统200可访问的非暂时性机器可读介质上。例如，指令和数据可以存储在非瞬态存储器210上。指令和数据可以通过传输信道中的数据信号传输到系统200/由系统200接收，该传输信道(例如)通过诸如214或216的接口由有线或无线网络连接实现。
如上所述，系统200可访问的应用典型地包括操作系统应用。
系统200还存储或访问当由处理单元202执行时将系统200配置为执行本文描述的各种计算机实现的处理操作的应用。例如，并且参考上面图1的网络环境：客户端系统110包括(具有模块114和116的)将客户端系统110配置为执行本文描述的操作的客户端应用112。
在一些情况下，给定计算机实现的方法的部分或全部将由系统200本身执行，而在其它情况下，处理可以由与系统200进行数据通信的其它装置执行。
如上所述，本公开总体上涉及将弯曲效果应用于设计文本元素。参考图3，这部分总体上概述示例用户界面300，通过该用户界面300，用户可以创建设计、向该设计添加设计元素(诸如文本元素)、使效果应用于设计元素/从设计元素移除、以及调整应用于设计元素的效果。
然而，应该注意的是，创建设计和/或将设计元素添加到设计中的特定方式与本公开并不特定相关，并且存在许多这样做的可替换方式。
用户界面300由客户端系统102在其显示器218上显示(客户端系统102被客户端应用104配置为这样做)。
通过界面300，用户可以创建包括一个或多个页面的设计文档，并且(尤其)向这些页面添加设计元素。示例设计创建界面300包括显示当前正在进行的设计的设计创建窗格302。在本示例中，设计创建窗格302示出设计文档的单个页面304。
设计创建界面300还包括设计元素搜索和选择窗格310，通过该窗格310，用户可以搜索或浏览一个或多个设计元素库，查看设计元素预览314，并选择要包括在设计文档中的设计元素。为此，窗格310包括(允许用户输入搜索文本的)搜索框312和提供设计元素预览图像的设计元素预览314。搜索功能可以使得客户端应用112在客户端系统110的本地存储器中搜索设计元素，在服务器系统120的存储器中搜索设计元素，和/或在第三方服务器系统(未示出)中搜索设计元素。
在搜索和选择窗格310中预览的设计元素可以例如通过拖放、双击、停留或任何其它适当的用户交互而被添加到正在进行的设计中(例如，添加到页面304)。
设计创建界面300还包括为设计创建和编辑提供各种工具的工具条320。在此特定示例中，工具包括：允许用户选择已经添加到页面304的特定设计元素的设计元素选择工具322；允许用户绘制具有几何或其它形状的设计元素的绘图工具324；允许用户添加文本元素的文本工具326；允许用户从另一个源导入设计元素(例如，存储在本地或远程可访问存储器上的设计元素、来自第三方服务器的设计元素等)的导入工具328。
尽管未示出，工具条320通常将为自适应工具条，因为所提供的工具根据用户正在做的事情而改变。例如，如果用户选择文本工具326，则可以显示与文本相关的附加(或可替换)工具：例如，字体选择工具、字体大小工具、字体样式工具、字体颜色工具等。
在本示例中，工具条320还包括效果控件330，效果控件330的激活(在此特定示例中)导致显示效果控件界面。下面参考图4和图5描述示例效果控件界面400。
一般来说，为了创建设计，用户创建页面并向该页面添加设计元素。设计元素可以通过各种方式添加。例如，用户可以与设计元素搜索和选择窗格310交互，以搜索/浏览设计元素，然后将设计元素添加到正在创建的设计中，例如，通过选择设计元素预览314，将其拖动到页面304上的位置，并将其放下。或者，用户可以创建并添加全新的设计元素，例如通过使用诸如绘图工具324的工具绘制设计元素，或者通过文本工具326添加定制文本。进一步可替换地，用户可以通过导入工具328导入设计元素。
在此特定示例中，页面304包括单个设计元素340。示例设计元素340为具有字母T、e、x和t的文本元素。文本元素340可以例如通过用户激活添加文本控件(诸如控件326)、用户选择页面304上的位置(例如，通过点击或接触该位置)以及用户(例如，通过物理或图形用户界面键盘)输入字母“T”、“e”、“x”和“t”来生成。
界面300仅作为示例提供，并且(具有可替换用户界面元素和控件的)可替换用户界面是可能的。
转向图4，将描述示例效果控件界面400。
在一些实施方式中，响应于特定用户界面控件(例如，用户界面300的效果控件330)的激活，将显示诸如400的效果控件界面。在这种情况下，效果控件界面400可以以各种方式显示。
例如，效果控件界面400可以代替用户界面300的搜索和选择窗格310的显示。在这种情况下，设计元素搜索控件的激活将导致重新显示搜索和选择窗格310并且隐藏效果控件界面400。
在可替换实施方式中，诸如400的效果控件界面可以显示为显示在其它用户界面元素之上并且可以由用户四处移动的浮动界面。在这种情况下，效果控件330可以配置为切换控件，连续激活导致效果控件界面被显示以及被隐藏。
在又一可替换实施方式中，诸如400的效果控件界面可以被永久显示(在这种情况下，不需要提供效果控件330)。
本示例的效果控件界面400包括多个效果选择控件，每一者都与特定效果相关联。在这种情况下，显示四个效果控件(402、404、406和408)，但可用的数量可能更少或更多。
通过效果控件界面400，用户可以将特定的效果应用于选定设计元素或设计元素组。例如，用户可以选择已经添加到设计中的一个或多个元素(例如，通过在页面304上点击或接触它们)，然后通过点击或接触(或接近)控件402来激活特定效果选择控件。
相关地，效果控件界面400包括弯曲文本效果控件402。如果用户已经选择设计中的文本元素(例如，元素340)，则用户可以选择/激活弯曲文本效果控件402，以如下所述将弯曲应用于选定文本。
同样如下所述，在某些实施方式中，弯曲文本效果可以与用户可调整参数相关联。在本示例中，弯曲文本效果控件402的选择导致显示针对任何用户可调整参数的参数调整控件410。
在本示例中，为得到弯曲文本效果的用户可调整参数包括曲率(其可以由曲率调整控件410a调整)、角度偏移(其可以由角度偏移调整控件410b调整)和文本翻转(其可以由翻转文本控件418调整)。
在此特定示例中，曲率和角度偏移调整控件410a和410b各自包括具有滑动条412a/412b和操纵块(handle)414a/414b的滑动条控件。用户可以沿着条412滑动操纵块414来调整所讨论的参数。每个调整控件410还包括显示对应于通过滑动条选择数值的数值和/或允许数值直接输入其中的参数值显示416。
在此特定示例中，翻转文本控件418为可以是活动的(例如，选定的)或不活动的(例如，取消选定的或未选定的)复选框。
在本示例中，曲率调整控件410a允许用户定义要应用于选定文本串的曲率的水平。在所描述的实施例中，客户端应用112将曲率调整控件410a配置成允许用户选择-100到100之间的曲率值，然后将所选择的值用于计算半径并创建弯曲，如下所述。在可替换实施例中，曲率调整控件410a可以用于直接定义半径。
在本示例中，角度偏移调整控件410b允许用户定义应用于文本串的弯曲的圆周位置。在本公开中，测量的角度偏移在0度到360度(或0度到+/-180度)之间，尽管也可以使用可替换地定义的偏移单元/位置。在这种情况下，0度的角度偏移(其为默认的角度偏移)定义一圆周位置，在该圆周位置，文本就像围绕圆的顶部中点弯曲(例如，以下504)，并且增加角度偏移使圆周位置围绕圆顺时针方向移动。在此示例中，角度偏移调整控件410b的滑动条412b包括四个预定义角度偏移点，以帮助用户识别/选择常用偏移：顶部(“T”)偏移点(相当于0度的角度偏移)；右(“R”)偏移点(相当于90/-270度的角度偏移)；底部(“B”)偏移点(相当于180/-180度的角度偏移)；和左(“L”)偏移点(相当于270/-90度的角度偏移)。应用112可以配置为初始设置默认角度偏移，例如0度(即，因此文本串的中心在最终由曲率值定义的圆的顶部)。
在本示例中，翻转文本控件118用于翻转文本，其示例如图5所示。
参考图5，提供具有描绘上述角度偏移和翻转参数的文本元素的设计500。设计500包括5个文本元素，每个文本元素具有大约90mm的弯曲半径(由圆502显示，圆502可以在弯曲文本效果的应用/调整期间临时显示，但是随后消失/不形成最终设计的一部分)。设计500包括：角度偏移为0度且未翻转的第一弯曲文本元素504；角度偏移为90度且未翻转的第二弯曲文本元素506；角度偏移为180度且未翻转的第三弯曲文本元素508；角度偏移为180度并翻转的第四弯曲文本元素510；角度偏移为270度且未翻转的第五弯曲文本元素512。
可以提供可替换类型的参数调整控件。例如，参数可以附加地(或者可替换地)通过出现在被调整文本串附近的弹出控件来调整。图13提供这样的控件的示例，示例包括(允许用户旋转弯曲文本并由此调整角度偏移的)角度偏移控件1320和曲率操纵块1322(用户可以通过其扩大或收缩曲率)。
图4描绘效果控件界面400的特定示例。然而，可以提供可替换用户界面元素，以便激活/停用弯曲文本效果和/或调整效果参数。作为可替换示例，图6描绘允许激活/停用效果且允许通过下拉菜单机构来调整参数的用户界面600。
用户界面600包括效果菜单项602。效果菜单项602类似于上述界面300的效果控件330。
效果菜单项的激活导致显示效果子菜单菜单604，效果菜单包括可以被激活的每个效果的效果菜单项606。弯曲文本菜单项606的选择导致显示包括如下的弯曲文本效果子菜单608：切换特定效果的开/关的激活/停用控件610，以及相关参数控件612(在此示例中为调整曲率控件、调整角度偏移控件和翻转文本控件)。选择调整曲率或调整偏移控件可以导致显示进一步的参数调整控件(诸如如上所述的滑动条或可替换控件)。
现在将描述为了将弯曲文本效果应用于选定设计文本元素(即文本串)所涉及的处理。
图7为描绘在选择弯曲文本效果并将其应用于文本串时所涉及的操作的流程图。
在702，客户端应用112确定弯曲文本效果已经启动。在本实施例中，如上所述，客户端应用112基于检测到用户激活弯曲文本效果控件(诸如402或606)来确定弯曲文本效果的启动。
在704，客户端应用112确定弯曲文本效果将要应用到的文本串设计元素。例如，这可以是在激活弯曲文本效果控件之前已经选择的文本串设计元素。可替换地，用户可以在激活弯曲文本效果控件之后立即选择文本串设计元素。
在706，客户端应用112确定弯曲文本参数，例如(并延续上述示例参数)曲率、角度偏移和“翻转”参数。
在某些实施例中，客户端应用112可以配置为在激活弯曲文本效果控件时设置初始参数值。例如，客户端应用112可以设置：默认曲率值为50；默认角度偏移为90度(因此文本围绕圆的顶部弯曲)；默认翻转值为非(因此文本未翻转)。
在某些实施例中，客户端应用112可以配置为基于选定文本串相对于设计中包括的其它设计元素的位置来自动计算(或尝试计算)建议半径值。下面参照图11描述建议半径值的计算。
在708，将文本串拆分为文本串元素。在本实施例中，这由文本拆分模块114处理。每个文本串元素与字形相关联(或具有可用于确定字形的信息)，即，考虑诸如字体类型、字体样式、字体大小等字符属性的显示字符/字符集。
如上所述，在某些实施例中，客户端应用112配置成将文本串中的每个单独的字符或明确组合的字符组确定为截然不同的文本串元素。
在可替换实施例中，客户端应用112配置成处理文本串以确定任何非明确组合的字符是否应被视为单个元素。
在任一情况下，客户端应用112都可以配置为通过调用将文本串作为输入并返回字形索引和位置的文本整形库将文本串拆分成文本串元素。这样的库的示例有HarfBuzz和Allsorts。
在某些实施例中，在708，拆分文本串生成文本串元素集(例如，阵列)，对于每个文本串元素，文本串元素集(例如，阵列)都包括文本串元素的字符的标识符和文本串元素的字形宽度。例如：
[{<Unicode代码点>，<字形宽度>}，{…}，…{…}]
在710，为在708确定的每个文本串元素计算元素变换。在本实施例中，元素变换由变换模块116计算。在这种情况下，元素变换模块被传递关于需要变换的每个元素的元素数据集。传递到变换模块的元素数据集可以包括，例如：
[<曲率>，<字形宽度>，<字形偏移>，<串宽度>，<字体大小>]
在此元素数据集中：曲率为(由应用112或用户设置的)曲率参数；字形宽度为与元素相关的字形的宽度(例如，以像素为单位，其可以通过文本拆分过程来计算或返回)；字形偏移量为文本串中元素的字形开始的x坐标(例如，通过对字符串中前面元素的宽度求和来计算)；串宽度为字符串的总宽度(例如，通过对字符串中所有元素的宽度求和来计算)；字号为字体大小。在角度偏移和/或翻转作为(例如，与最初用默认偏移(诸如，90度)和默认翻转值(诸如，非)创建的所有弯曲文本相对的)参数提供的情况下，元素数据集也可以包括角度偏移和/或翻转参数。
在本实施例中，元素变换由旋转(例如，以度为单位的值)、x坐标(例如，以像素为单位的值)和y坐标(例如，以像素为单位的值)定义。因此，为给定文本串元素计算的变换可以采用诸如如下的形式：
[<旋转>，<x坐标>，<y坐标>]
根据本实施例的旋转值、x坐标值和y坐标值的计算如下。
输入参数为曲率值“c”、字体大小“f”和线性文本宽度“w”。
如上所述，本实施例中的曲率值为-100到100之间的值。在这种情况下，输入曲率值(ci)最初被映射到映射曲率值(cm)(尽管这可以在706或过程中的另一点执行)。执行此映射是为了使曲率滑动条控件的操作对用户来说看起来更加线性。示例中的映射曲率值根据以下公式计算：
cm＝tan(ci)/tan(1)
在可替换实施例中，不执行输入曲率值到映射曲率值的映射。在这种情况下，仍然可以使用以下计算：用对输入曲率参数(ci)的参照替换对映射曲率值(cm)的参照。
还计算角度值变化δA。角度值变化为指示原始线性文本串的角度每水平像素变化的值)。在本实施例中，角度值变化计算如下：
δA＝绝对值(cm*2)*(16/f)
在这个公式中，乘数值2可以设置为不同的值，以改变曲率的程度。发明人已经将乘数2确认为对不同长度和大小的文本串提供美学上令人愉悦的结果的值。
包括(16/f)乘数，以根据字体大小对曲率进行归一化。因此，对于相同的曲率值c，字体大小为(例如)18的文本(参见图8的802)将最终具有与字体大小为(例如)48的文本(参见图8的804)相同的曲率。
利用角度值变化δA，可以计算出周长
周长＝360/δA
由周长可以计算出半径：
r＝周长/(2*π)
由半径可以计算出弧角(弧角为文本串一旦弯曲所占据的角度)：
弧度＝360*(w/周长)
为了图解这些计算，考虑图9中的示例线性文本902(未按比例)：“150px wide”。在此示例中，假设映射曲率cm＝0.3，字体大小f＝16并且文本串宽度w＝150像素。在这种情况下：
δA＝绝对值(0.3*2)*(16/16)＝0.6
周长＝360/0.6＝600像素
半径＝600/(2*π)＝95.48像素
弧度＝360*150/600＝90度
因此，一旦弯曲，线性文本串902将占据圆的90度(或四分之一)(见904)。
如果计算出的弧角大于360度，则客户端应用112确定文本串对于曲率来说太长。客户端应用112可以配置成以各种方式对这个确定进行响应。
例如，在某些实施例中，客户端应用112配置成生成并显示“文本串太长”的错误消息，并停止处理，直到(或者如果)选择新的曲率值。
在可替换实施例中，客户端应用112配置为尝试自动增大曲率值，使得文本串不太长(例如，因此弧度<＝360度)。在这种情况下，客户端应用112还可以生成并显示通知用户这一点的消息，例如“调整曲率以适应文本长度”。
在再另外的实施例中，客户端应用112配置为截断文本串，使得剩余元素不会产生超过360度的弧度。例如，这可能涉及从文本串的末尾移除元素，直到弧度值小于360度。在此实施例的变型中，客户端应用112可以配置为通过移除元素来截断文本串，直到剩余元素加上附加的、自动添加的截断字形(例如，“…”或可替换截断字形)产生小于360度的弧度值。在这种情况下，截断字形向用户显示文本串对于选定的曲率来说太长。图10提供对于所选择的曲率来说太长的线性文本串1002的示例。在这种情况下，已经截断相应的弯曲文本元素1004，并且已经将截断字形“…”添加到剩余文本串的末尾。
处理对于曲率来说太长的文本串的其它替代方式是可能的。例如，客户端应用112可以配置为当文本接近360度时淡出文本，并且不显示将超过360度的任何文本。
上面的值在计算出后用于计算文本串元素的旋转、x坐标和y坐标。
在本示例中，基于元素在线性文本串中的位置(即字形偏移值)、元素的字形宽度以及角度值变化δA来计算给定元素的初始旋转：
初始旋转＝δA*(字形偏移+(元素字形宽度/2))
可以在没有“+(元素字形宽度/2)”项的情况下计算初始旋转，但是在这种情况下，元素的字形将基本上围绕角(左上角)而不是字形的中点旋转。
为了使某个元素所属的文本串看起来就像围绕圆的顶部弯曲(例如，90度的角度偏移)，通过由字符的初始旋转角度减去计算出的弧度值除以2来计算最终旋转。例如，如果根据上面的等式计算的初始旋转为20度，并且弦的总弧度是90度，则将由计算的旋转减去45度(弧度/2)，从而得到-25度的最终旋转。
在角度偏移和/或翻转作为参数提供的情况下，在计算最终旋转时会添加额外的角度偏移。例如，为了使文本看起来就像围绕圆的右手侧弯曲(例如，按照图5的506)，将添加90度。
因此，更一般地，文本串元素的最终旋转可以计算为：
最终旋转＝(δA*(字形偏移+(元素字形宽度/2))–弧度/2+角度偏移
使用元素的最终旋转，可以计算x和y坐标：
x坐标＝半径*cos(元素最终旋转)
y坐标＝半径*sin(元素最终旋转)
在712，一旦已经为所有元素计算元素变换，则客户端应用112就可以呈现弯曲文本串。客户端应用112通过对每个文本串元素基于元素变换呈现该元素定义/关联的字形来呈现弯曲文本串。在本实施例中，并且作为示例，客户端应用112在它自己的HTML<span>容器中呈现每个元素，该容器应用CSS变换，以便根据元素变换的旋转、x坐标和y坐标的需要来定位并旋转由元素定义的字形。
为了应用变换，将元素变换的x坐标添加到选定文本串中点的x坐标。
如果文本要具有正曲率(即看起来就像围绕圆的顶部弯曲)，则将计算出的半径添加到元素变换的y坐标。
如果文本的曲率值为负(例如，看起来就像围绕圆的底部弯曲)，则对变换的y坐标进行另一种调整。具体来说，确定最上面的y坐标(对于负曲率，其将为第一个元素和最后一个元素的y坐标)，并由元素变换的y坐标减去最上面的y坐标。
在712之后，已经将输入文本串呈现为弯曲文本串。此时，用户可以(例如，通过在设计或用户界面控件中选择不同的元素)选择保留弯曲文本串，(例如，通过在选择弯曲文本串的情况下停用弯曲文本效果控件402拒绝弯曲文本串)，或者改变弯曲文本串。
如果对选定文本串、其属性和/或弯曲文本参数进行相关的改变，则可以重新执行上述处理中的一些或全部处理。
在本实施例中，如果(在714)接收到可以影响将文本串拆分成元素的改变，则处理返回到708以重新拆分文本串。这样的改变包括，例如，用户改变原始文本串的字符(例如，添加/移除字符)和/或改变原始文本串的字体。
如果(在716)接收到不影响文本串元素的拆分但可以影响文本串元素的变换(例如，旋转和/或位置)的改变，则处理返回到710以在呈现新的弯曲文本串之前重新计算元素变换。这样的改变可以包括，例如，改变原始文本串的字体大小和/或调整一个或多个弯曲文本参数(例如，曲率、角度偏移、翻转)。
虽然上面已经描述了用于计算字符旋转和位置的特定等式，但是可替换等式也是可能的。
此外，上面给出的等式[δA＝绝对值(cm*2)*(16/f)]通常建立三个变量之间的关系：曲率值(ci或cm)、半径(通过δA)、以及字体大小。这个等式(以及上面描述的其它等式)可以适于提供其它弯曲文本效果。
作为一个示例，可以使“半圆”控件(例如，作为诸如400的效果控件界面中的“半圆”参数控件)对用户可用，如果选择该“半圆”控件，则该“半圆”控件导致应用112以半圆显示选定文本串。为此，应用112可以使用上面的公式并使用选定文本串的宽度、半径(如下所述，基于默认曲率或基于用户选择的曲率自动确定)和180度的固定弧角来计算将导致文本串占据半圆的字体大小。
以类似的方式，可以提供允许其它固定弧角的控件，例如，全圆控件，如果选择该全圆控件，则该全圆控件计算导致选定文本串占据全圆(弧角＝360度)的字体大小。此外，或者可替换地，可以提供弧角选择器控件，其允许用户选择0度到360度之间的任何弧角，从而使得选定文本串占据选定弧度。这样的控件可以为如上所述的滑动条控件。
为了图解过程700的操作，考虑“文本”的选定文本串，曲率值为1，字体大小为16像素。
在708，文本串元素被确定为[“T”、“e”、“x”、“t”]并且被确定为具有[9.9375、8.09375、8.3046875、5.6640625]的对应的宽度。
操作710的输入(其可以由变换模块116执行)可以为诸如如下的数据集：
Figure BDA0003314917950000201
Figure BDA0003314917950000211
在710的处理然后可以生成诸如如下的元素变换：
Figure BDA0003314917950000212
Figure BDA0003314917950000221
Figure BDA0003314917950000231
在712，这些变换可用于生成用于呈现诸如如下(其中已省略与弯曲文本定位无关的属性，诸如颜色等)的HTML元素：
Figure BDA0003314917950000232
如上所述，在某些实施例中，客户端应用112可以配置为基于文本串在设计中相对于其它设计元素的位置来自动计算(或尝试计算)文本串的建议半径值。
图11提供指示建议半径值计算过程1100中所涉及的操作的流程图。过程1100可以例如作为(确定弯曲文本参数的)上述操作706的一部分被调用。
在一些实施例中，建议半径计算可以由用户可配置的应用设置来启用/禁用。如果启用，则自动执行建议半径计算过程1100。否则不自动执行建议半径计算过程1100(尽管仍可以由用户手动触发)。
在1102，确定或访问现有弯曲元素数据。现有弯曲元素数据为关于与选定文本串在同一设计页面上的其它弯曲设计元素的数据。
现有弯曲元素可以为定义类型的元素，例如，作为圆(或近似圆)的元素、作为弧或限定弧(例如，半圆或其它径向截面)的元素。
对于现有弯曲元素，现有弯曲元素数据可以包括位置数据和高度数据。位置数据为允许识别现有弯曲元素的位置的数据。举例来说，现有弯曲元素的位置数据可以为定义现有弯曲元素的原点的x和y坐标。高度数据或者是现有弯曲元素的高度，或者是允许确定现有弯曲元素的高度的数据(例如，半径、直径、元素高度、诸如可以影响高度的扭曲/歪斜的变换、和/或允许确定高度的其它数据)。
现有弯曲元素数据可以以各种方式并且由客户端应用112和/或服务器应用104确定。
在页面包括矢量设计元素的情况下，客户端应用112或服务器应用104可以配置为可以分析页面数据以确定是否有任何矢量元素定义了定义类型的弯曲元素。对于定义弯曲元素的每个矢量元素，则可以基于元素的矢量定义来访问(或计算)相关数据。例如，在SVG格式中，<circle>标签定义圆形矢量元素，并包括(定义原点的x坐标的)“cx”属性、(定义原点的y坐标的)“cy”属性和(定义半径的)“r”属性。
在页面包括光栅设计元素的情况下，客户端应用112或服务器应用104可以处理页面(或其上的光栅元素)以检测现有弯曲元素并提取/计算弯曲元素数据。作为一个示例，为了检测作为圆的现有弯曲元素，可以使用诸如霍夫圆检测算法的圆检测算法。这个算法可以适用于(和/或使用其它算法)检测其它类型(例如，半圆、弧等)的现有弯曲元素。处理栅格数据以检测弯曲元素典型地比处理矢量元素需要更多的处理。因此，如果要处理光栅元素，则客户端应用112可以请求服务器应用(诸如104)执行这个处理并返回相关数据。
在某些实施例中，在1102确定现有弯曲元素数据可以限于仅确定现有弯曲矢量元素数据。在其它实施例中，1102可以包括仅确定现有弯曲光栅元素数据。在其它实施例中，1102可以包括光栅和矢量元素。
当处理设计页面以确定现有弯曲元素时，数据结果可以保存在现有弯曲元素数据集中以供将来访问。但是，如果向页面添加其它元素，则可能需要重新处理(或部分重新处理)页面，以保持数据集为最新状态。
在1104，客户端应用112确定选定文本串是否在空间上与在1102确定的任何现有弯曲元素相关。
在本实施例中，基于对齐标准和分离标准来确定文本串是否在空间上与现有弯曲元素相关。
在此示例中，对齐标准涉及竖直对齐。在这种情况下，客户端应用112基于文本串的水平中点(例如，文本串的中间或近似中间的x坐标)是否与现有弯曲元素的水平中点(例如，原点x坐标)竖直对齐来确定对齐标准。
如果文本串的水平中点(例如，文本串的中间或近似中间的x坐标)与现有弯曲元素的水平中点(例如，原点x坐标)竖直对齐，则客户端应用112确定文本串与现有弯曲元素竖直对齐。在确定竖直对齐时，客户端应用112可以考虑对齐容差——例如，如果文本串的水平中点在现有弯曲元素的水平中点的(+或-)对齐容差之内，则客户端应用112将确定它们是竖直对齐的。
客户端应用112基于文本串和现有元素之间的距离是否在定义分离距离内来确定分离标准。
例如，文本串与现有弯曲元素之间的距离可以计算为文本串的y坐标(例如，文本串的竖直中点或其它y坐标)减去现有元素的y坐标(例如，现有元素原点的y坐标)的绝对值。可替换地，可以基于文本串(例如，文本串的中心)和现有元素(例如，原点)的x和y坐标来计算距离——例如通过使用毕达哥拉斯定理(平方根((文本串x-现有元素x)2+(文本串y-现有元素y)2)。
在本实施例中，客户端应用112基于所讨论的特定现有弯曲元素的大小来确定定义分离距离——例如，使得对于较大的现有元素将确定相对较大的分离距离，而对于较小的现有元素将确定相对较小的分离距离。作为具体示例，客户端应用112可以通过将现有元素的半径(或高度)乘以乘数(例如，1.1、1.2、1.3或可替换乘数)来计算特定现有元素的定义分离距离。
如果文本串在空间上与任何现有弯曲元素无关，则无法计算自动曲率值。在这种情况下，客户端应用112在1106返回默认曲率值。
如果客户端应用112确定文本串在空间上与现有弯曲元素相关(例如，对齐标准和分离标准都满足)，则处理进行到1108。
在1108，客户端应用112计算建议半径。建议半径为文本串与现有弯曲元素之间的距离(如上所述)。客户端应用112还可以将计算出的半径映射回曲率值(例如，在-100到100之间的值)，从而这可以显示在滑动条控件或类似物上。这个计算可以通过颠倒上述计算来执行。
在1110，然后返回建议半径，并且可以如上所述用于计算元素变换。
为了图解建议半径的操作，考虑图12所示的弯曲文本元素和现有圆形元素。
在示例1202中，确定文本串1204(“your paragraph text”)在空间上与现有弯曲元素1206相关。在这种情况下，客户端应用112自动计算建议半径，并显示应用了弯曲效果的文本串(1208)。
在示例1210中，确定文本串1202(“your paragraph text”)在空间上与现有弯曲元素1214不相关。在这种情况下，客户端应用112使用默认曲率(其与现有元素1214无关)来将文本效果应用于文本串(1216)。
建议半径的进一步图解如图13所示。在图13的三个示例中(1302、1304和1306)，选定文本串1308相同，并且现有弯曲元素1310相同。然而，在每个示例中，选定文本串1308相对于现有弯曲元素1310的位置不同(尽管在所有三个示例中，文本串1308被确定为在空间上与现有弯曲元素1310相关)。在示例1302中，将选定文本串1308定位在现有弯曲元素内，因此相对小的半径被建议/用于弯曲效果(见1312)。在示例1304中，将选定文本串1308定位在现有弯曲元素的顶部，并且因此更大的半径被建议/用于弯曲效果(见1314)。在示例1306中，选定文本串1308被定位在现有弯曲元素的顶部之外，并且因此更大的半径被建议/用于弯曲效果(见1316)。
在1104，如果客户端应用112确定文本串在空间上与多个现有弯曲元素相关，则可以采用各种方法。
在一种方法中，客户端应用配置成选择一个这样的现有元素，例如(基于候选元素的深度/z索引)最接近前景的现有元素；(基于距离)文本串最接近的现有元素；和/或基于其它选择标准。
在另一种方法中，客户端应用配置为计算并返回与文本串在空间上相关的所有现有元素的建议半径。在这种情况下，客户端应用112可以通过例如以下方式使用建议半径：将每个曲率显示为捕捉点，使得用户可以容易地选择建议半径中的一者，以查看文本串将如何以该曲率出现；显示应用了建议半径的多个文本串，并允许用户选择弯曲文本串中的一者(或拒绝所有文本串)；或者以可替换的方式。
在进一步的实施例中，应用112可以配置为当用户(例如，通过拖动或其它输入)在设计页面周围移动文本串时，自动确定文本串是否与一个或多个现有弯曲元素呈空间关系。在这种情况下，应用112基于被选择/被移动的文本串的当前位置来动态地确定文本串是否在空间上与任何现有弯曲元素相关(按照1104)。如果当前位置导致文本串在空间上与现有弯曲元素相关，则应用112计算建议半径(按照1108)，并且可以基于计算出的曲率自动显示文本串(或其另一版本，例如，阴影、部分透明或其它的版本)。这允许用户在设计页面周围移动文本串，并看到它“突然移动”到基于设计页面上现有弯曲元素计算的曲率。
附图中图解并在上面描述的流程图以特定顺序定义了操作，以解释各种特征。在一些情况下，所描述并图解的操作可以以不同于所示/所描述的顺序来执行，一个或多个操作可以被组合成单个操作，单个操作可以被分成多个分离操作，和/或由一个或多个所描述/图解的操作实现的功能可以由一个或多个可替换操作来实现。此外，给定流程图操作的功能/处理可以由不同的系统或应用来执行。
除非另有说明，术语“包括”和“包含”(及其变体，诸如“包括着”、“包括了”、“包含着”、“包含了”、“包含过”等)包括在内使用，并且不排除进一步的特征、部件、整体、步骤或元素。
应当理解，在本说明书中公开并限定的实施例延伸到在文本或附图中提到或从文本或附图中显而易见的两个或多个单独特征的可替换组合。所有这些不同的组合构成本公开的可替换实施例。
本说明书参考可能因实施方式而异的许多具体细节描述了各种实施例。权利要求中未明确陈述的任何限制、元素、属性、特征、优点或属性都不应被认为是必需的或必要的特征。因此，说明书和附图应当被认为是说明性的，而非限制性的。

Claims (20)

1.一种计算机实现的方法，包括：
检测关于设计的选定文本串的弯曲文本效果的启动；
确定半径；
处理所述选定文本串以将所述选定文本串拆分成一个或多个文本串元素，每个文本串元素与字形相关联；
为每个文本串元素计算包括元素旋转数据和元素位置数据的元素变换，所述元素变换基于所述半径；以及
对于给定文本串元素，通过基于为所述给定文本串元素计算的所述元素变换来呈现所述给定文本串元素所相关联的所述字形，来呈现每个文本串元素。
2.根据权利要求1所述的计算机实现的方法，其中，确定所述半径包括：
确定曲率值；
基于所述曲率值计算角度值变化，所述角度值变化指示所述选定文本串的角度每水平像素变化；以及
基于所述角度值变化计算所述半径。
3.根据权利要求2所述的计算机实现的方法，其中，所述曲率值为用户定义值。
4.根据权利要求1至3中任一项所述的计算机实现的方法，还包括：基于所述设计的现有弯曲元素自动确定所述半径。
5.根据权利要求4所述的计算机实现的方法，其中，基于所述设计的现有弯曲元素自动确定所述半径包括：
访问关于所述设计中现有弯曲元素的弯曲元素数据；
基于所述弯曲元素数据，确定所述选定文本串是否在空间上与特定现有弯曲元素相关；以及
响应于确定所述选定文本串在空间上与所述特定现有弯曲元素相关，基于与所述特定现有弯曲元素相关联的所述弯曲元素数据计算所述半径。
6.根据权利要求5所述的计算机实现的方法，其中，所述半径是基于所述选定文本串相对于所述特定现有弯曲元素的位置来计算的。
7.根据权利要求5所述的计算机实现的方法，其中，确定所述选定文本串是否在空间上与所述特定现有弯曲元素相关包括：
确定所述选定文本串是否与所述特定现有弯曲元素对齐；以及
确定所述选定文本串是否在所述特定现有弯曲元素的定义分离距离内。
8.根据权利要求5所述的计算机实现的方法，还包括：通过以下生成所述弯曲元素数据：
处理所述设计以识别所述设计包括的任何现有弯曲矢量元素；以及
为识别的每个现有弯曲矢量元素生成弯曲元素数据。
9.根据权利要求5所述的计算机实现的方法，还包括：通过以下生成所述弯曲元素数据：
处理所述设计以识别所述设计中包括的任何现有弯曲光栅元素；以及
为识别的每个现有弯曲光栅元素生成弯曲元素数据。
10.根据权利要求1所述的计算机实现的方法，还包括：确定角度偏移，所述角度偏移定义圆周位置，并且其中为给定文本串元素计算所述元素变换额外地基于所述角度偏移。
11.根据权利要求1所述的计算机实现的方法，其中处理所述选定文本串以将所述选定文本串拆分成一个或多个文本串元素包括处理所述选定文本串，使得每个文本串元素为所述选定文本串的字符或明确定义字符组。
12.根据权利要求1所述的计算机实现的方法，其中：
处理所述选定文本串以将所述选定文本串拆分成一个或多个文本串元素包括使用文本整形库处理所述选定文本串；以及
至少一个文本串元素包括来自所述选定文本串的多个字符，来自所述选定文本串的所述多个字符并非所述选定文本的明确定义字符组。
13.一种计算机处理系统，包括：
处理单元；
显示器；和
存储指令的非暂时性计算机可读存储介质，所述指令由所述处理单元执行，使得所述处理单元：
检测关于设计的选定文本串的弯曲文本效果的启动；
确定半径；
处理所述选定文本串以将所述选定文本串拆分成一个或多个文本串元素，每个文本串元素与字形相关联；
为每个文本串元素计算包括元素旋转数据和元素位置数据的元素变换，所述元素变换基于所述半径；以及
对于给定文本串元素，通过基于为所述给定文本串元素计算的所述元素变换来呈现所述给定文本串元素所相关联的所述字形，来在所述显示器上呈现每个文本串元素。
14.根据权利要求13所述的计算机处理系统，其中，确定所述半径包括：
确定曲率值；
基于所述曲率值计算角度值变化，所述角度值变化指示所述选定文本串的角度每水平像素变化；以及
基于所述角度值变化计算所述半径。
15.根据权利要求13或权利要求14所述的计算机处理系统，其中，所述指令的执行还使得所述处理单元：基于所述设计的现有弯曲元素自动确定所述半径。
16.根据权利要求15所述的计算机处理系统，其中，基于所述设计的现有弯曲元素自动确定所述半径包括：
访问关于所述设计中现有弯曲元素的弯曲元素数据；
基于所述弯曲元素数据，确定所述选定文本串是否在空间上与特定现有弯曲元素相关；以及
响应于确定所述选定文本串在空间上与所述特定现有弯曲元素相关，基于与所述特定现有弯曲元素相关联的所述弯曲元素数据计算所述半径。
17.根据权利要求16所述的计算机处理系统，其中，所述半径是基于所述选定文本串相对于所述特定现有弯曲元素的位置来计算的。
18.根据权利要求16所述的计算机实现的方法，其中，确定所述选定文本串是否在空间上与所述特定现有弯曲元素相关包括：
确定所述选定文本串是否与所述特定现有弯曲元素对齐；以及
确定所述选定文本串是否在所述特定现有弯曲元素的定义分离距离内。
19.根据权利要求13所述的计算机处理系统，其中，所述指令的执行还使得所述处理单元：确定角度偏移，所述角度偏移定义圆周位置，并且其中为给定文本串元素计算所述元素变换额外地基于所述角度偏移。
20.根据权利要求13所述的计算机处理系统，其中：
处理所述选定文本串以将所述选定文本串拆分成一个或多个文本串元素包括使用文本整形库处理所述选定文本串；以及
至少一个文本串元素包括来自所述选定文本串的多个字符，来自所述选定文本串的所述多个字符并非所述选定文本的明确定义字符组。
CN202111228090.6A 2020-10-27 2021-10-21 用于将效果应用于设计元素的系统和方法 Pending CN114489636A (zh)

Applications Claiming Priority (2)

Application Number Priority Date Filing Date Title
US202063106073P 2020-10-27 2020-10-27
US63/106,073 2020-10-27

Publications (1)

Publication Number Publication Date
CN114489636A true CN114489636A (zh) 2022-05-13

Family

ID=78516521

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202111228090.6A Pending CN114489636A (zh) 2020-10-27 2021-10-21 用于将效果应用于设计元素的系统和方法

Country Status (4)

Country Link
US (1) US11727193B2 (zh)
EP (1) EP3992915A1 (zh)
CN (1) CN114489636A (zh)
AU (1) AU2021206860B2 (zh)

Families Citing this family (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
USD951975S1 (en) * 2020-04-17 2022-05-17 Canva Pty Ltd Display screen or portion thereof with animated graphical user interface

Family Cites Families (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
EP0952554A3 (en) * 1998-02-26 2003-01-08 Canon Kabushiki Kaisha Information processing apparatus and information processing method
US7692655B2 (en) * 2007-02-16 2010-04-06 Mitac International Corporation Apparatus and method of generating curved baseline for map labeling
US8633930B2 (en) * 2007-03-26 2014-01-21 Apple Inc. Non-linear text flow
US9001126B2 (en) * 2008-05-30 2015-04-07 Adobe Systems Incorporated Displaying text on path
CN102591577A (zh) * 2011-12-28 2012-07-18 华为技术有限公司 一种弧形菜单索引显示方法及相关装置
WO2017199999A1 (ja) * 2016-05-20 2017-11-23 アイシン・エィ・ダブリュ株式会社 地図表示システムおよび地図表示プログラム

Also Published As

Publication number Publication date
EP3992915A1 (en) 2022-05-04
AU2021206860A1 (en) 2022-05-12
AU2021206860B2 (en) 2022-09-08
US20220129619A1 (en) 2022-04-28
US11727193B2 (en) 2023-08-15

Similar Documents

Publication Publication Date Title
US9619435B2 (en) Methods and apparatus for modifying typographic attributes
US9360992B2 (en) Three dimensional conditional formatting
US20120206471A1 (en) Systems, methods, and computer-readable media for managing layers of graphical object data
US10101891B1 (en) Computer-assisted image cropping
US20160154579A1 (en) Handwriting input apparatus and control method thereof
US20120210261A1 (en) Systems, methods, and computer-readable media for changing graphical object input tools
US11029836B2 (en) Cross-platform interactivity architecture
US20140325418A1 (en) Automatically manipulating visualized data based on interactivity
KR20120009564A (ko) 3차원 마우스 포인터 생성방법 및 생성장치
US11372624B2 (en) System for creating graphical content
US9286657B1 (en) Efficient image processing using dynamically sized tiles
TW201435713A (zh) 在修改期間保留內容區域之佈局
JP7014782B2 (ja) 自動着色方法、自動着色システム及び自動着色装置
US20150113453A1 (en) Methods and devices for simplified graphical object editing
US20220137799A1 (en) System and method for content driven design generation
US11714531B2 (en) Glyph-aware text selection
CN114489636A (zh) 用于将效果应用于设计元素的系统和方法
US20170364248A1 (en) Segment eraser
EP2434456A2 (en) Unified handle approach for moving and extruding objects in a 3-D editor
AU2024202563A1 (en) Systems and methods for applying effects to design elements
US20170315704A1 (en) Application user interfaces with scrollable color palettes
JP6161290B2 (ja) 表示制御装置、表示制御方法及びそのプログラム
CN111199512B (zh) Svg矢量图形的调整方法、装置、存储介质及终端
US11460987B2 (en) Modifying graphical user interface processing based on interpretation of user intent
AU2020260558A1 (en) System and method for content driven design generation

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination