Sintaxe de comandos de movimentação e desenho
Saiba mais sobre os comandos de mover e desenhar (uma minilinguagem) que você pode usar para especificar geometrias de caminho como um valor de atributo XAML. Os comandos de movimentação e desenho são usados por muitas ferramentas de design e gráficos que podem gerar um gráfico vetorial ou forma, como um formato de serialização e intercâmbio.
Propriedades que usam cadeias de caracteres de comando de movimentação e desenho
A sintaxe do comando mover e desenhar é compatível com um conversor de tipo interno para XAML, que analisa os comandos e produz uma representação gráfica em tempo de execução. Esta representação é basicamente um conjunto acabado de vetores que está pronto para apresentação. Os vetores em si não completam os detalhes da apresentação; Você ainda precisará definir outros valores nos elementos. Para um objeto Path, você também precisa de valores para Fill, Stroke e outras propriedades e, em seguida, esse Path deve ser conectado à árvore visual de alguma forma. Para um objeto PathIcon, defina a propriedade Foreground.
Há duas propriedades no Tempo de Execução do Windows que podem usar uma cadeia de caracteres que representa comandos de movimentação e desenho: Path.Data e PathIcon.Data. Se você definir uma dessas propriedades especificando comandos de movimentação e desenho, normalmente a definirá como um valor de atributo XAML junto com outros atributos necessários desse elemento. Sem entrar em detalhes, aqui está o que parece:
<Path x:Name="Arrow" Fill="White" Height="11" Width="9.67"
Data="M4.12,0 L9.67,5.47 L4.12,10.94 L0,10.88 L5.56,5.47 L0,0.06" />
Usando comandos de mover e desenhar versus usar um PathGeometry
Para XAML do Tempo de Execução do Windows, os comandos mover e desenhar produzem um PathGeometry com um único objeto PathFigure com um valor de propriedade Figures. Cada comando de desenho produz uma classe derivada de PathSegment na coleção Segments desse único PathFigure, o comando move altera o StartPoint e a existência de um comando close define IsClosed como true. Você pode navegar por essa estrutura como um modelo de objeto se examinar os valores de dados em tempo de execução.
A sintaxe básica
A sintaxe dos comandos mover e desenhar pode ser resumida assim:
- Comece com uma regra de preenchimento opcional. Normalmente, você especifica isso somente se não quiser o padrão EvenOdd . (Mais sobre EvenOdd mais tarde.)
- Especifique exatamente um comando de movimentação.
- Especifique um ou mais comandos de desenho.
- Especifique um comando de fechamento. Você pode omitir um comando de fechamento, mas isso deixaria sua figura aberta (isso é incomum).
As regras gerais dessa sintaxe são:
- Cada comando é representado por exatamente uma letra.
- Essa letra pode ser maiúscula ou minúscula. O caso é importante, como descreveremos.
- Cada comando, exceto o comando close, normalmente é seguido por um ou mais números.
- Se houver mais de um número para um comando, separe com uma vírgula ou espaço.
[fillRule] moveCommand drawCommand [drawCommand*] [closeCommand]
Muitos dos comandos de desenho usam pontos, onde você fornece um valor x,y . Sempre que você vir um espaço reservado *points , você pode assumir que está fornecendo dois valores decimais para o valor x,y de um ponto.
O espaço em branco geralmente pode ser omitido quando o resultado não é ambíguo. Na verdade, você pode omitir todo o espaço em branco se usar vírgulas como separador para todos os conjuntos de números (pontos e tamanho). Por exemplo, este uso é legal: F1M0,58L2,56L6,60L13,51L15,53L6,64z. Mas é mais comum incluir espaço em branco entre os comandos para maior clareza.
Não use vírgulas como ponto decimal para números decimais; a cadeia de caracteres de comando é interpretada por XAML e não leva em conta as convenções de formatação de número específicas da cultura que diferem daquelas usadas na localidade en-us .
Especificidades da sintaxe
Regra de preenchimento
Há dois valores possíveis para a regra de preenchimento opcional: F0 ou F1. (O F é sempre maiúsculo.) F0 é o valor padrão; ele produz o comportamento de preenchimento ParÍmpar , portanto, você normalmente não o especifica. Use F1 para obter o comportamento de preenchimento diferente de zero . Esses valores de preenchimento se alinham com os valores da enumeração FillRule .
Comando Mover
Especifica o ponto de início de uma nova figura.
| Sintaxe |
|---|
M startPoint - ou - mstartPoint |
| Termo | Descrição |
|---|---|
| startPoint | Ponto O ponto inicial da nova figura. |
Um M maiúsculo indica que startPoint é uma coordenada absoluta; um m minúsculo indica que startPoint é um deslocamento para o ponto anterior, ou (0,0) se não houver ponto anterior.
Observação É legal especificar vários pontos após o comando move. Uma linha é desenhada para esses pontos como se você tivesse especificado o comando de linha. No entanto, esse não é um estilo recomendado; Em vez disso, use o comando de linha dedicada.
Comandos de desenho
Um comando de desenho pode consistir em vários comandos de forma: linha, linha horizontal, linha vertical, curva de Bézier cúbica, curva de Bézier quadrática, curva de Bézier cúbica suave, curva de Bézier quadrática suave e arco elíptico.
Para todos os comandos de desenho, o caso é importante. As letras maiúsculas denotam coordenadas absolutas e as letras minúsculas denotam coordenadas relativas ao comando anterior.
Os pontos de controle de um segmento são relativos ao ponto final do segmento anterior. Ao inserir sequencialmente mais de um comando do mesmo tipo, você pode omitir a entrada de comando duplicada. Por exemplo, L 100,200 300,400 é equivalente a L 100,200 L 300,400.
Comando de linha
Cria uma linha reta entre o ponto atual e o ponto final especificado. l 20 30 e L 20,30 são exemplos de comandos de linha válidos. Define o equivalente a um objeto LineGeometry.
| Sintaxe |
|---|
LExtremidade - ou - lExtremidade |
| Termo | Descrição |
|---|---|
| endPoint | Ponto O ponto de extremidade da linha. |
Comando de linha horizontal
Cria uma linha horizontal entre o ponto atual e a coordenada X especificada. H 90 é um exemplo de um comando de linha horizontal válido.
| Sintaxe |
|---|
H x -ou- h x |
| Termo | Descrição |
|---|---|
| x | Double A coordenada X do ponto final da linha. |
Comando de linha vertical
Cria uma linha vertical entre o ponto atual e a coordenada y especificada. v 90 é um exemplo de um comando de linha vertical válido.
| Sintaxe |
|---|
V y -ou- v y |
| Termo | Descrição |
|---|---|
| y | Double A coordenada y do ponto final da linha. |
Comando Curva de Bézier cúbica
Cria uma curva de Bézier cúbica entre o ponto atual e o ponto final especificado usando os dois pontos de controle especificados (controlPoint1 e controlPoint2). C 100,200 200,400 300,200 é um exemplo de um comando de curva válido. Define o equivalente de um objeto PathGeometry com um objeto BezierSegment.
| Sintaxe |
|---|
C Ponto de controle1 controlPoint2 endPoint -ou- c Ponto de controle1 controlPoint2 endPoint |
| Termo | Descrição |
|---|---|
| Ponto de controle1 | Ponto O primeiro ponto de controle da curva, que determina o início da tangente da curva. |
| Ponto de controle2 | Ponto O segundo ponto de controle da curva, que determina o final da tangente da curva. |
| endPoint | Ponto O ponto em que a curva é desenhada. |
Comando de curva de Bézier quadrática
Cria uma curva de Bézier quadrática entre o ponto atual e o ponto final especificado usando o ponto de controle especificado (controlPoint). q 100,200 300,200 é um exemplo de um comando de curva de Bézier quadrática válido. Define o equivalente de um PathGeometry com um QuadraticBezierSegment.
| Sintaxe |
|---|
Q Ponto final do ponto de controle -ou- q Ponto final do ponto de controle |
| Termo | Descrição |
|---|---|
| Ponto de controle | Ponto O ponto de controle da curva, que determina o início e final da tangente da curva. |
| endPoint | Ponto O ponto em que a curva é desenhada. |
Comando de curva de Bézier cúbica suave
Cria uma curva de Bézier cúbica entre o ponto atual e o ponto final especificado. O primeiro ponto de controle é assumido ser a reflexão do segundo ponto de controle do comando anterior relativo ao ponto atual. Se não houver nenhum comando anterior ou se o comando anterior não for um comando de curva de Bézier cúbica ou um comando de curva de Bézier cúbica suave, suponha que o primeiro ponto de controle seja coincidente com o ponto atual. O segundo ponto de controle, o ponto de controle para o final da curva, é especificado por controlPoint2. Por exemplo, S 100,200 200,300 é um comando de curva de Bézier cúbico suave válido. Este comando define o equivalente a um PathGeometry com um BezierSegment onde havia um segmento de curva anterior.
| Sintaxe |
|---|
SPonto de controle2 Extremidade -ou- scontrolPoint2 endPoint |
| Termo | Descrição |
|---|---|
| Ponto de controle2 | Ponto O ponto de controle da curva, que determina o final da tangente da curva. |
| endPoint | Ponto O ponto em que a curva é desenhada. |
Comando de curva de Bézier quadrática suave
Cria uma curva de Bézier quadrática entre o ponto atual e o ponto final especificado. O ponto de controle é assumido ser a reflexão do ponto de controle do comando anterior relativo ao ponto atual. Se não houver nenhum comando anterior ou se o comando anterior não for um comando de curva de Bézier quadrática ou um comando de curva de Bézier quadrática suave, o ponto de controle é coincidente com o ponto atual. Esse comando define o equivalente de um PathGeometry com um QuadraticBezierSegment em que havia um segmento de curva anterior.
| Sintaxe |
|---|
TPonto de controleExtremidade -ou- tPonto de controleExtremidade |
| Termo | Descrição |
|---|---|
| Ponto de controle | Ponto O ponto de controle da curva, que determina o início e tangente da curva. |
| endPoint | Ponto O ponto em que a curva é desenhada. |
Comando de arco elíptico
Cria um arco elíptico entre o ponto atual e o ponto final especificado. Define o equivalente de um PathGeometry com um ArcSegment.
| Sintaxe |
|---|
A tamanho rotationAngle isLargeArcFlag sweepDirectionFlag endPoint -ou- a tamanho rotationAngle isLargeArcFlag sweepDirectionFlag endPoint |
| Termo | Descrição |
|---|---|
| size | Tamanho O raio x e o raio y do arco. |
| de rotaçãoÂngulo | Double A rotação da elipse, em graus. |
| isLargeArcFlag | Definido como 1 se o ângulo do arco deva ser 180 graus ou maior. Caso contrário, defina como 0. |
| sweepDirectionFlag | Definido como 1 se o arco é desenhado na direção ângulo-positiva. Caso contrário, defina como 0. |
| endPoint | Ponto O ponto em que o arco é desenhado. |
Comando Fechar
Termina a figura atual e cria uma linha que conecta o ponto atual ao ponto de partida da figura. Este comando cria uma linha-junção (canto) entre o último segmento e o primeiro segmento da figura.
| Sintaxe |
|---|
Z -ou- z |
Sintaxe de ponto
Descreve a coordenada x e a coordenada y de um ponto. Veja também Ponto.
| Sintaxe |
|---|
| x,y -ou- xy |
| Termo | Descrição |
|---|---|
| x | Double A coordenada X do ponto. |
| y | Double A coordenada Y do ponto. |
Observações adicionais
Em vez de um valor numérico padrão, você também pode usar os seguintes valores especiais. Esses valores diferenciam maiúsculas de minúsculas.
- Infinito: Representa PositiveInfinity.
- -Infinito: Representa NegativoInfinito.
- NaN: Representa NaN.
Em vez de usar decimais ou inteiros, você pode usar notação científica. Por exemplo, +1.e17 é um valor válido.
Ferramentas de design que produzem comandos de movimentação e desenho
O uso da ferramenta Caneta e outras ferramentas de desenho no Blend para Microsoft Visual Studio 2015 geralmente produzirá um objeto Path, com comandos de movimentação e desenho.
Você pode ver dados de comando de movimentação e desenho existentes em algumas das partes de controle definidas nos modelos padrão XAML do Tempo de Execução do Windows para controles. Por exemplo, alguns controles usam um PathIcon que tem os dados definidos como comandos de movimentação e desenho.
Há exportadores ou plug-ins disponíveis para outras ferramentas de design de gráficos vetoriais comumente usadas que podem gerar o vetor no formato XAML. Eles geralmente criam objetos Path em um contêiner de layout, com comandos de movimentação e desenho para Path.Data. Pode haver vários elementos Path no XAML para que diferentes pincéis possam ser aplicados. Muitos desses exportadores ou plug-ins foram originalmente escritos para XAML ou Silverlight do Windows Presentation Foundation (WPF), mas a sintaxe do caminho XAML é idêntica ao XAML do Windows Runtime. Normalmente, você pode usar partes de XAML de um exportador e colá-las diretamente em uma página XAML do Tempo de Execução do Windows. (No entanto, você não poderá usar um RadialGradientBrush, se isso fizer parte do XAML convertido, porque o XAML do Tempo de Execução do Windows não dá suporte a esse pincel.)