Curso Windows Phone – Exemplo de Maskedit em C#

Olá pessoal, tudo bom?

Para responder à dúvida de um leitor do Blog, resolvi escrever esse post que demonstra um exemplo de como implementar um “maskedit” em C#. Nesse caso fiz um método que recebe por parâmetro o TextBox onde se deseja aplicar a máscara e formata os números digitados com duas casas decimais conforme o usuário os for digitando.

Como é possível observar na figura de exemplo ao lado, dentro do TextBox (txtValor) os números digitados vão sendo exibidos conforme a máscara aplicada “#,99” e no TextBlock (txtNumerosDigitados) exibo os números digitados sem a formatação aplicada pelo “maskedit”.

Toda ação de máscara ocorre no evento KeyDown do TextBox, onde verifico em primeiro lugar se a tecla pressionada é um número ou o BackSpace, caso contrário, quaisquer outras teclas serão desprezadas, ou seja, para essa máscara apenas números e BackSpace são aceitos.

Confira abaixo o código XAML utilizado para montar a interface do exemplo:

...
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
  <TextBlock Text="BLOG DO EDUARDO H. RIZO" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
  <TextBlock Text="maskedit c#" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>

<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
  <TextBlock HorizontalAlignment="Left" Margin="10,0,0,0" TextWrapping="Wrap" Text="Informe um valor:" VerticalAlignment="Top"/>
  <TextBox x:Name="txtValor" HorizontalAlignment="Left" Height="72" TextWrapping="Wrap" InputScope="Number" Text="" VerticalAlignment="Top" Width="456" TextAlignment="Right" KeyDown="txtValor_KeyDown" Margin="0,24,0,0" />
  <TextBlock x:Name="txbNumerosDigitados" HorizontalAlignment="Right" Margin="0,96,15,0" TextWrapping="Wrap" Text="..." VerticalAlignment="Top"/>
</Grid>
...

Para completar o exemplo, o código C# associado à implementação XAML demonstrada acima:

...
public partial class MainPage : PhoneApplicationPage
{
  // Constructor
  public MainPage()
  {
    InitializeComponent();
    // Sample code to localize the ApplicationBar
    //BuildLocalizedApplicationBar();
  }

  string numero = "";

  private void MaskeditNumererico_DuasCasasDecimais(TextBox txt, KeyEventArgs e)
  {
  //Verifica de a tecla digitada foi algo diferente de números ou BackSpace
  if (e.Key != Key.Back && (e.Key < Key.D0 || e.Key > Key.D9))
  {
    e.Handled = true;
  }
  else
  {
    if (e.Key == Key.Back && numero.Length > 0) //Se digitou BackSpace então retiramos o último número digitado
      numero = numero.Substring(0, numero.Length - 1);
    else
      numero += Convert.ToChar(e.PlatformKeyCode).ToString(); //Concatenamos o número digitado aos já existentes

    //Verificações para realizar o maskedit em C#. Nesse caso o formato são números com 2 casas decimais
    if (numero.Length == 0)
      txt.Text = "";
    else if (numero.Length < 2)
      txt.Text = "0,0" + numero;
    else if (numero.Length == 2)
      txt.Text = "0," + numero;
    else
      txt.Text = numero.Substring(0, numero.Length - 2) + "," + numero.Substring(numero.Length - 2, 2);
    }
  }

  private void txtValor_KeyDown(object sender, KeyEventArgs e)
  {
    MaskeditNumererico_DuasCasasDecimais(txtValor, e);

    //TextBlock que exibe os números digitados sem a formatação do "maskedit"
    txbNumerosDigitados.Text = numero;
  }

...

Fica a dica !

Grande abraço,

Eduardo Henrique Rizo

Post Relacionado: 

• Curso Windows Phone gratuito

[twitter-follow screen_name=’eduardorizo’ show_count=’yes’]