Ordem de propriedades na margem

218

Se eu tiver essa string no XAML:

Storyboard.TargetProperty="Margin" From="1,2,3,4" To="0,0,0,0"

O que é superior e inferior direito e esquerdo? 1- direita 2- superior 3- esquerda 4 - inferior

Isso está certo?

Papa John
fonte
1
Segundo resultado ao procurar o pedido de margem do WPF, stackoverflow.com/questions/520422/… . esquerdo superior direito inferior
Lukazoid
@PapaJohn Para ser mais específico ao link @amit jhafornecido, consulte a seção intitulada XAML Valuespara a margem nesse link.
nam

Respostas:

403
Margin="1,2,3,4"
  1. Esquerda,
  2. Topo,
  3. Certo,
  4. Inferior

Também é possível especificar apenas dois tamanhos como este:

Margin="1,2"
  1. Esquerda e direita
  2. Cabeçalho e rodapé

Finalmente, você pode especificar um único tamanho:

Margin="1"
  1. usado para todos os lados

A ordem é a mesma do WinForms.

ER não
fonte
5
LTRB é a notação curta a ser lembrada facilmente.
Sai
44
Nota: esta é uma ordem diferente da ordem CSS do html, que é superior, direita, inferior, esquerda.
Ruskin
7
Alguém tem alguma idéia de por que eles decidiram usar algo diferente do CSS?
Charles Clayton
5
@crclayton - Como escrevi; a ordem é a mesma do WinForms. O WinForms é o antecessor natural do WPF para que os softwares (desenvolvedores) atualizem do WinForms para o WPF.
Erno
30
E se. O WPF começa no oeste. Netscape começa no norte? E obviamente no sentido horário para ambos.
Martin Capodici
33

Existem três situações únicas:

  • 4 números , por exemplo Margin="a,b,c,d".
  • 2 números , por exemplo Margin="a,b".
  • 1 número , por exemplo Margin="a".

4 Números

Se existem 4 números , então o seu left, top, right, bottom(um círculo no sentido horário a partir da margem esquerda do meio). O primeiro número é sempre o "oeste", como "WPF":

<object Margin="left,top,right,bottom"/>

Exemplo: se o usarmos Margin="10,20,30,40", gera:

insira a descrição da imagem aqui

2 Números

Se houver 2 números , o primeiro será a espessura da margem esquerda e direita, o segundo será a espessura da margem superior e inferior. O primeiro número é sempre o "oeste", como "WPF":

<object Margin="a,b"/> // Equivalent to Margin="a,b,a,b".

Exemplo: se usarmos Margin="10,30", as margens esquerda e direita são 10 e as partes superior e inferior são 30.

insira a descrição da imagem aqui

1 número

Se houver 1 número , o número será repetido (é essencialmente uma espessura da borda).

<object Margin="a"/> // Equivalent to Margin="a,a,a,a".

Exemplo: se o usarmos Margin="20", gera:

insira a descrição da imagem aqui

Atualização 2020-05-27

Trabalham em um aplicativo WPF em larga escala nos últimos 5 anos, com mais de 100 telas. Parte de uma equipe de 5 desenvolvedores WPF / C # / Java. Finalmente decidimos usar 1 número (para espessura da borda) ou 4 números. Nós nunca usamos 2. É consistente e parece ser uma boa maneira de reduzir a carga cognitiva durante o desenvolvimento.


A regra:

Todos os números de largura começam à esquerda (o "Oeste", como "WPF") e vão no sentido horário (se dois números, apenas vão no sentido horário duas vezes e espelham o resto).

Contango
fonte
1
"Se houver 2 números, o primeiro será a espessura da margem esquerda e direita". Mas, no exemplo, o primeiro número é 30 e acaba sendo a margem superior e inferior.
Peter Bruins
21

Só porque o comentário de @MartinCapodici é incrível, escrevo aqui como resposta para dar visibilidade.

Tudo no sentido horário:

  • W PF inicia W est (esquerda-> superior-> direita-> inferior)
  • N etscape (ou seja, CSS) inicia N orth (superior-> direita-> inferior-> esquerda)
Askolein
fonte
7
<object Margin="left,top,right,bottom"/>
- or - 
<object Margin="left,top"/>
- or - 
<object Margin="thicknessReference"/>

Consulte aqui: http://msdn.microsoft.com/en-us/library/system.windows.frameworkelement.margin.aspx

chopikadze
fonte
3
Para o segundo exemplo, "esquerda, superior", na verdade é repetido: o primeiro número se refere à esquerda e à direita, o segundo à parte superior e inferior, veja minha resposta abaixo.
Contango 27/06