Ao desenvolver diariamente para Windows Phone por vezes deparo-me com situações em que nem tudo o que parece, realmente o é… esta é uma dessas situações!
Cenário inicial: numa PhoneApplicationPage vazia, adicionamos o seguinte bloco de XAML ao conteúdo da Grid ContentPanel:
<ListBox ItemsSource="{Binding Items}">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding}" Style="{StaticResource PhoneTextTitle2Style}" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Como podem aqui ver, estamos a criar uma ListBox com um template muito simples (para cada item, apresentar um TextBlock usando o próprio item como texto).
Do lado do código temos uma propriedade Items que tem apenas e só 3 items e que vão servir para alimentar a propriedades ItemsSource da nossa ListBox.
Até aqui tudo bem, ao executar a aplicação o resultado deverá ser este:
Digamos que agora pretendemos alinhar o texto de cada item à direita; normalmente, a seguinte alteração seria suficiente:
<TextBlock Text="{Binding}" HorizontalAlignment="Right" Style="{StaticResource PhoneTextTitle2Style}" />
Ao executar novamente a aplicação, poderemos ver que o resultado se mantém inalterado!
Nesta altura, começamos a testar as propriedades da própria ListBox, ao ponto de fazer algo deste tipo:
<ListBox HorizontalContentAlignment="Right">
E mais uma vez, ao executar poderemos reparar que nada mudou!!!
O que se passa é que cada item da ListBox é instanciado dentro de um ListBoxItem, e este controlo ignora por completo a propriedade HorizontalContentAlignment colocada na própria ListBox.
Para resolver este problema, temos que definir a propriedade ListBox.ItemContainerStyle e ai sim colocar o ListBoxItem.HorizontalAlignment pretendido.
O código corrigido ficará estão da seguinte forma:
<ListBox ItemsSource="{Binding Items}">
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Setter Property="HorizontalAlignment" Value="Right"/>
</Style>
</ListBox.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding}" Style="{StaticResource PhoneTextTitle2Style}" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
E aqui temos o resultado final:
Pessoalmente, coloco sempre o ListBoxItem.HorizontalAlignment com o valor HorizontalAlignment.Stretch, e depois controlo o alinhamento do item propriamente dito dentro do template; com esta segunda abordagem tenho a garantia de que o item dispõe realmente da largura total da ListBox para apresentar resultados!
No passado sábado estive em Coimbra para mais um evento do 