domingo, 12 de abril de 2009

NumericInput

Estou disponibilizando um novo controle: NumericInput.
Este controle serve para a entrada de dados numéricos formatando-os conforme o locale: pt_BR ou en_US.

Criei este controle inspirado no controle do Fernando Incerti.

Características:
O NumericInput possue as propriedades: precision, useNegativeSign e useThousandsSeparator que são utilizadas para setar as propriedades homônimas do NumberFormatter que utilizo para formatar o valor digitado. Este NumberFormatter deixei public e bindable, caso seja necessário formatar um outro componente com as mesmas características do NumericInput. Qualquer alteração nestas propriedades dispara um evento.

Existe também a propriedade value que devolve um Number do valor digitado que também dispara um evento.

Deixei o método toNumber como público. Este recebe um Object e devolve um Number do Object.toString() com a mesma precision do NumericInput. Este método é um utilitário não alterando o valor do NumericInput.

A alteração do locale ou de qualquer uma das propriedades em runtime provoca a reformatação do valor atual.

Espero que seja útil para os amigos.
O código fonte com exemplo pode ser baixado aqui. O fonte também se encontra na seção de arquivos da Lista Flex-Brasil, só que é disponível somente para os membros da lista.

17 comentários:

  1. concerteza é útil ;) Obrigado Fabio!

    ResponderExcluir
  2. Fábio, não consigo baixar o fonte. Poderia verificar? Ou enviar para alessandro.moreira@gmail.com?

    Lhe agredeço muito!

    ResponderExcluir
  3. como faço pra pegar o locale do brasil direito? q parametro configuro? obrigada; parabens

    ResponderExcluir
  4. Obrigado.
    Vc precisa informar ao compilador quais os locales q vc irá utilizar para isso vc vai no menu Project > Properties > Flex Compiler e na linha Additional compiler arguments vc coloca:
    -locale=en_US,pt_BR

    Por default o sistema entra com o primeiro informado no caso en_US.

    E no fonte para selecionar o locale vc faz:
    this.resourceManager.localeChain = ['pt_BR'];

    []s

    ResponderExcluir
  5. Estou com uma dificuldade , mesmo colocando no padrao brasil, meu flex está usando . ao invés de , acho que pode ser algum bug no locale pt_BR, ONDE posso localzar a versao do pt_BR para donwload ?

    ResponderExcluir
  6. Siga os passos q descrevi na resposta do dia 05/02 devido este bug q relatei: https://bugs.adobe.com/jira/browse/FB-16828

    Vc pode editar os arquivos de locale tranquilamente.

    Os locales ficam em
    C:\Program Files\Adobe\Flex Builder 3 Plug-in\sdks\3.4.0\frameworks\locale
    Nela vc terá uma pasta para cada locale: en_US, ja_JP, pt_BR

    Vc pode encontrar eles aqui:
    http://groups.google.com.br/group/flexdev/files arquivo pt_BR.zip
    ou via SVN
    http://opensource.adobe.com/svn/opensource/flex/sdk/trunk/frameworks/projects/framework/bundles/pt_BR/

    []s

    ResponderExcluir
  7. Para baixar o locale pt_BR utilize os links deste post: http://fabiophx.blogspot.com/2010/06/locale-ptbr.html

    ResponderExcluir
  8. Fabio,

    Não sou cadastrado e por isso não consegui baixar o decimalinput. Estou desenvolvendo uma aplicação em flex / java e gostaria de usar este componente. Voce poderia me enviar.
    gelson.stoduto@ig.com.br.

    Obrigado!

    ResponderExcluir
  9. Vinícius Hoffmann Fontoura20 de junho de 2011 às 21:59

    Olá Fabio!

    Em primeiro lugar gostaria de agradecer por vc liberar este componente!!

    Gostaria de saber se existe algum meio de digitar o valor da esquerda para a direita, ao inves de da direita para a esquerda.

    Obrigado, e um grande abraçco!

    ResponderExcluir
  10. Vinicius,
    Tudo bem?
    Sim é possível alinhar a esquerda, logo no construtor deste componente coloco setStyle("textAlign", "right"); vc pode colocar para left, mas tereia q fazer um refactoring no componente pois ele está orientado sempre a direita.

    []s
    Qq coisa estamos aí.

    ResponderExcluir
  11. Paulo da Silva Rocha
    Oi Fabio.
    Primeiramente gostaria de dar os parabéns pelo codigo.
    Estou com uma duvida, como faço para armazenar no banco de dados no formato que esta no componente ? Estou pesquisando pela internet e vejo que tenho que tirar a formatação para armazenar no banco de dados . E isso ou tem outra maneira ?

    ResponderExcluir
  12. Paulo da Silva Rocha
    Oi Fabio.
    Resolvi, era problema meu. Minha query estava errada

    ResponderExcluir
  13. Olá Paulo, Obrigado por compartilhar o codigo
    Comecei a utilizalo e estou tendo o seguinte problema
    quando atribuo os valores para as minhas variavel

    this._avaliacaoFisica.peso= Number(txtPeso.value); this._avaliacaoFisica.altura= Number(txtAltura.value); this._avaliacaoFisica.bracoD= Number(txtBracoD.value); this._avaliacaoFisica.bracoE= Number(txtBracoE.value);
    this._avaliacaoFisica.anteBracoD=Number(txtAntebracoD.value); this._avaliacaoFisica.anteBracoE=Number(txtAntebracoE.value);

    quando o degug para nessas linhas, antes do debug passar elas estão com os valores corretos, mas depois que começo a debugar as linhas seguintes, o valor do primeiro e segundo campo são replicados para os demais
    como faço p/ resolver isso ?

    ResponderExcluir
    Respostas
    1. William, bom saber q o componente está sendo útil.
      Tente:
      this._avaliacaoFisica.peso= txtPeso.value as Number;

      Já vi isso acontecer, isso é, um cast não conseguir converter e o outro tipo sim.

      []s

      Excluir
    2. Olá Paulo, me desculpe
      a sua classe está certinha
      o erro foi meu.

      Obrigado

      Excluir
  14. Olá, primeiramente obrigada pelo componente, estamos usando na nossa aplicação Flex há bastante tempo. Se possível, poderia me esclarecer uma dúvida a respeito da formatação? Eu tenho campos numéricos que podem ser habilitados/desabilitados de acordo com um checkbox. É possível deixar o texto do campo vazio, quando estiver desabilitado? Tentei resetar o atributo value, mas ele ainda mostra "0,00". Obrigada,

    ResponderExcluir
  15. Que legal, fico feliz q esteja sendo útil.

    O q recomendo é criar um atributo boolean showEmptyWhenZero, e qd for atribuir o texto formatado ao atributo text e este atributo for true e o valor = zero bota string vazia, caso contrário formata como já faz hoje, com esse atributo vc não quebra o comportamento nas demais parte da tua aplicação q está usando o componente.

    []s
    qq coisa estamos aí

    ResponderExcluir