Resumo do Capítulo 14. Layout absoluto
Observação
Este livro foi publicado na primavera de 2016, e não foi atualizado desde então. Há muito no livro que permanece valioso, mas parte do material está desatualizado, e alguns tópicos não estão mais totalmente corretos ou completos.
Como StackLayout, AbsoluteLayout deriva Layout<View> e herda uma Children propriedade. AbsoluteLayout Implementa um sistema de layout que exige que o programador especifique as posições de seus filhos e, opcionalmente, seu tamanho. A posição é especificada pelo canto superior esquerdo da criança em relação ao canto superior esquerdo das AbsoluteLayout unidades independentes do dispositivo. AbsoluteLayout também implementa um recurso de posicionamento e dimensionamento proporcionais.
AbsoluteLayout deve ser considerado como um sistema de layout de propósito especial a ser usado apenas quando o programador pode impor um tamanho às crianças (por exemplo, BoxView elementos) ou quando o tamanho do elemento não afeta o posicionamento de outras crianças. As HorizontalOptions propriedades e VerticalOptions não têm efeito sobre os filhos de um AbsoluteLayout.
Este capítulo também apresenta o recurso importante das propriedades vinculáveis anexadas que permitem que as propriedades definidas em uma classe (neste caso AbsoluteLayout) sejam anexadas a outra classe (um filho do AbsoluteLayout).
AbsoluteLayout no código
Você pode adicionar um filho à Children coleção de um AbsoluteLayout usando o método padrão Add , mas AbsoluteLayout também fornece um método estendido Add que permite especificar um Rectanglearquivo . Outro Add método requer apenas um Point, caso em que a criança é irrestrita e dimensiona-se.
Você pode criar um Rectangle valor com um construtor que requer quatro valores — os dois primeiros indicando a posição do canto superior esquerdo da criança em relação ao pai e os dois segundos indicando o tamanho da criança. Ou você pode usar um construtor que requer um Point e um Size valor.
Esses Add métodos são demonstrados em AbsoluteDemo, que posiciona BoxView elementos usando Rectangle valores e um Label elemento usando apenas um Point valor.
O exemplo ChessboardFixed usa 32 BoxView elementos para criar o padrão do tabuleiro de xadrez. O programa dá aos BoxView elementos um tamanho codificado de 35 unidades quadradas. O AbsoluteLayout tem seu HorizontalOptions e VerticalOptions definido como LayoutOptions.Center, o que faz com que o AbsoluteLayout tenha um tamanho total de 280 unidades quadradas.
Propriedades vinculáveis anexadas
Também é possível definir a posição e, opcionalmente, o tamanho de um filho de um AbsoluteLayout depois que ele foi adicionado à coleção usando o Children método AbsoluteLayout.SetLayoutBoundsestático . O primeiro argumento é a criança; o segundo é um Rectangle objeto. Você pode especificar que o filho se dimensione horizontalmente e/ou verticalmente definindo os valores de largura e altura para a AbsoluteLayout.AutoSize constante.
O exemplo ChessboardDynamic coloca o AbsoluteLayout manipulador em um ContentView com um SizeChanged manipulador para chamar AbsoluteLayout.SetLayoutBounds todas as crianças para torná-las o maior possível.
A propriedade vinculável anexada que AbsoluteLayout define é o campo estático somente leitura do tipo BindableProperty chamado AbsoluteLayout.LayoutBoundsProperty. O método estático AbsoluteLayout.SetLayoutBounds é implementado chamando SetValue a criança com o AbsoluteLayout.LayoutBoundsProperty. O filho contém um dicionário no qual a propriedade vinculável anexada e seu valor são armazenados. Durante o layout, o AbsoluteLayout pode obter esse valor chamando AbsoluteLayout.GetLayoutBounds, que é implementado com uma GetValue chamada.
Dimensionamento e posicionamento proporcionais
AbsoluteLayout implementa um recurso de dimensionamento e posicionamento proporcionais. A classe define uma segunda propriedade vinculável anexada, LayoutFlagsProperty, com os métodos AbsoluteLayout.SetLayoutFlags estáticos relacionados e AbsoluteLayout.GetLayoutFlags.
O argumento para AbsoluteLayout.SetLayoutFlags e o valor de retorno de AbsoluteLayout.GetLayoutFlags é um valor do tipo AbsoluteLayoutFlags, uma enumeração com os seguintes membros:
None(igual a 0)XProportional(1)YProportional(2)PositionProportional(3)WidthProportional(4)HeightProportional(8)SizeProportional(12)All(\xFFFFFFFF)
Você pode combiná-los com o operador OR bit a bit do C#.
Com esses sinalizadores definidos, certas propriedades da estrutura de limites de Rectangle layout usada para posicionar e dimensionar o filho são interpretadas proporcionalmente.
Quando o WidthProportional sinalizador é definido, um Width valor de 1 significa que o filho tem a mesma largura que o AbsoluteLayout. Uma abordagem semelhante é usada para a altura.
O posicionamento proporcional leva em conta o tamanho. Quando o XProportional sinalizador é definido, a X propriedade dos limites de Rectangle layout é proporcional. Um valor de 0 significa que a borda esquerda da criança está posicionada na borda esquerda do AbsoluteLayout, mas uma posição de 1 significa que a borda direita da criança está posicionada na borda direita do AbsoluteLayout, não além da borda direita do AbsoluteLayout , como você poderia esperar. Uma X propriedade de 0,5 centraliza AbsoluteLayouta criança horizontalmente no .
A amostra ChessboardProportional demonstra o uso de dimensionamento e posicionamento proporcionais.
Trabalhando com coordenadas proporcionais
Às vezes, é mais fácil pensar em posicionamento proporcional de forma diferente de como ele é implementado no AbsoluteLayout. Talvez você prefira trabalhar com coordenadas proporcionais em que uma X propriedade de 1 posiciona a borda esquerda da criança (em vez da borda direita) contra a borda direita do AbsoluteLayout.
Esse esquema de posicionamento alternativo pode ser chamado de "coordenadas fracionárias da criança". Você pode converter de coordenadas filho fracionárias para os limites de layout necessários para AbsoluteLayout usar as seguintes fórmulas:
layoutBounds.X = (fractionalChildCoordinate.X / (1 - layoutBounds.Width))
layoutBounds.Y = (fractionalChildCoordinate.Y / (1 - layoutBounds.Height))
O exemplo ProportionalCoordinateCalc demonstra isso.
AbsoluteLayout e XAML
Você pode usar um AbsoluteLayout em XAML e definir as propriedades vinculáveis anexadas nos filhos de um AbsoluteLayout usando valores de atributo de AbsoluteLayout.LayoutBounds e AbsoluteLayout.LayoutFlags. Isso é demonstrado nos exemplos AbsoluteXamlDemo e ChessboardXaml. O último programa contém 32 BoxView elementos, mas usa um implícito Style que inclui a AbsoluteLayout.LayoutFlags propriedade para manter a marcação reduzida a um mínimo.
Um atributo em XAML que consiste em um nome de classe, um ponto e um nome de propriedade é sempre uma propriedade vinculável anexada.
Sobreposições
Você pode usar AbsoluteLayout para construir uma sobreposição, que cobre a página com outros controles, talvez para proteger o usuário de interagir com os controles normais na página.
O exemplo SimpleOverlay demonstra essa técnica e também demonstra o ProgressBar, que exibe a extensão em que um programa concluiu uma tarefa.
Um pouco de diversão
O exemplo DotMatrixClock exibe a hora atual com uma exibição de matriz de pontos 5x7 simulada. Cada ponto é um BoxView (são 228) dimensionado e posicionado AbsoluteLayoutno .
O programa BouncingText anima dois Label objetos para saltar horizontal e verticalmente pela tela.