rich_editor

Rich_editor

Editor Wysiwyg para Flutter com um rico conjunto de opções de formatação suportada.

Baseado em https://github.com/dankito/richtextedEditor, mas para o Flutter.

Características

• Ousado, itálico, sublinhado, atacando, subscrito, sobrescrito
• Título 1 - 6, corpo de texto, pré -formatado, citação de bloco
• Fonte (lê todas as fontes do sistema) (somente Android)
• Tamanho da fonte
• Cor de texto
• Texto cor de fundo
• Destaque o texto
• Justifique a esquerda, centro, direita, BlockQuote
• Recuo, externo
• Desfazer, refazer
• Lista não ordenada (balas)
• Lista ordenada (números)
• Insira a imagem local ou remota
• Insira o link
• Insira a caixa de seleção
• Procurar
• Indicadores de ícone

? Capturas de tela

Uso

      // Insert widget into tree
      RichEditor (
        key : keyEditor,
        value : 'initial html here' ,
        editorOptions : RichEditorOptions (
          placeholder : 'Start typing' ,
          // backgroundColor: Colors.blueGrey, // Editor's bg color
          // baseTextColor: Colors.white,
          // editor padding
          padding : EdgeInsets . symmetric (horizontal : 5.0 ),
          // font name
          baseFontFamily : 'sans-serif' ,
          // Position of the editing bar (BarPosition.TOP or BarPosition.BOTTOM)
          barPosition : BarPosition . TOP ,
        ),
        // You can return a Link (maybe you need to upload the image to your
        // storage before displaying in the editor or you can also use base64
        getImageUrl : (image) {
          String link = 'https://avatars.githubusercontent.com/u/24323581?v=4' ;
          String base64 = base64Encode (image. readAsBytesSync ());
          String base64String = 'data:image/png;base64, $ base64 ' ;
          return base64String;
        },
      )

Obtenha HTML atual do editor

 String ? html = await keyEditor.currentState ? . getHtml ();
print (html);

Defina o foco e o foco

 await keyEditor.currentState ? . focus ();
await keyEditor.currentState ? . unFocus ();

Conteúdo do editor claro

 await keyEditor.currentState ? . clear ();

Barra de ferramentas personalizada

Se você estiver interessado em criar sua própria barra de ferramentas, verifique o custom_toolbar_demo.dart no exemplo

Licença

 Copyright 2021 JideGuru

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

   http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.