Se esta querendo aprender ou iniciar novos projetos em Flex, clique aqui

Hoje passeando pelo grupo Flex-Brasil, encontrei um post de uma dúvida sobre o RichTextEditor. Bom este é uma dúvida comum entre todos os iniciantes do Flex. Como recuperar o texto formatado do RichTextEditor?

Então vamos a um exemplo simples, adaptado de um exemplo disponibilizado pela própria Adobe na descrição do RichTextEditor.

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
                layout="absolute"
                backgroundColor="#f6f6f6"
                backgroundGradientColors="[#f6f6f6, #bbbbbb]"
                viewSourceURL="29/index.html">

    <mx:Label x="10" y="10" text="Trabalhando com RichTextEditor"
              fontSize="20" fontWeight="bold"/>
    <mx:HRule x="10" y="49" width="80%"/>             

    <mx:RichTextEditor id="editor" title="RichTextEditor"
                       text="Texto formatado" x="10" y="71"/>
    <mx:Button label="Visualizar o código HTML"
               click="visualizacao.text = editor.htmlText;" x="10" y="379"/>
    <mx:Button label="Vesualizar o texto puro"
               click="visualizacao.text = editor.text;"  x="177" y="379"/>
    <mx:TextArea id="visualizacao"  x="10" y="409" width="325" height="135"/>
</mx:Application>

Veja agora o resultado desta aplicação:

Para retornar somente o texto é chamado editor.text e editor.htmlText retorna o código HTML do editor. veja aqui o código completo.

Agora veja a utilização deste exemplo com chamados HTTPService, seguindo o exemplo utilizado em um Post anterior que trata sobre este assunto.

Este segundo exemplo submete o dado do RichTextEditor para o servidor que oi responde. Neste caso o servidor poderá salvar em um banco de dados para posterior utilização.

Mais se os arquivos estiverem salvos no servidor, você os carrega através do HTTPService, conforme exemplo abaixo.

Este ultimo exemplo carrega arquivos que estão a disposição no servidor.

O código completo poderá ser acessado aqui.

Gostou? Não esqueça de curtir!

Ou compartilhe o link com seus amigos

11 comentários

Deixe uma resposta

  1. Boa tarde Eduardo,
    cara ve só, to com problemas na exibição do html

    eu pego o texto através da propriedade htmltext (texto = editor.htmltext)
    e salvo no banco. Ele salva normal o texto em html

    quando eu trago de volta o texto, que ainda continua em html, e coloco no editor ele nao exibe o texto, ou seja

    editor.htmlText = texto;

    ele nao exibe o texto no rich text :S

    voce sabe porque isso acontece ? abraço

     
  2. A variável texto possui valor? Se não possuir não irá apresentar valor algum.

     
  3. Ótimo post... parabéns.
    Uma dúvida: tenho um button que deve inserir um texto fixo (por exemplo: |nome|) na posição do cursor. Vc poderia me ajudar, por favor?

    Obrigado

     
  4. @Benito Não vi nenhum personaliuzado na Web com Imagem. Mais poderás abrir o fonte e desenvolver esta funcionalidade.

     
  5. Olá Eduardo, gostei muito de sua explicação, mas tenho uma dúvida, há algum componente de imagem no RichTextEditor assim como á para link, ou para fonte por exemplo. Se há qual é, se não como resolver essa questã? Grato.

     
  6. Cara boa noite, postei uma msg no fórum pq estou com um problema e testei aqui no seu exemplo e deu o mesmo problema...

    se eu inserir um texto longo que tenham em alguns lugares links para sites por exemplo e quiser mudar a cor deles para vermelho ele só aceita o primeiro... porque isso acontece é pau do flex?

    Ex. copia o texto acima e tenta colocar em vermelho as palavras problema e exemplo

    me ajuda com esse problema por favor... obrigado!

     
  7. Muito bacana esse tutorial sobre RichTextEditor.

    Valeu

     
  8. Bom, Procurei, pesquisei, e a única solução que encontrei para a lista de fontes foi reescrever a biblioteca do RichTextEditor.

    Não é muito difícil, pois é escrita em MXML e o fonte pode ser encontrado em “[PastaAdobeFlex]\sdks\3.0.0\frameworks\projects\framework\src\mx\controls\RichTextEditor.mxml”.

    Qualquer coisa posta aqui!!!!

     
  9. Estou tentando usar esse exemplo para editar textos externos usados em um site em flash. Existe a possibilidade de carregar um txt externo como texto do editor rich text? Outra dúvida seria quantos as fontes desse editor, teria como alterar as fontes que tem no combo box? Obrigado pela ajuda, ótimo tutorial.

     
  10. Fico feliz de ter uma dúvida minha transformada em post!