Skip to content

README.es.md

Latest commit

 

History

History
304 lines (238 loc) · 9.32 KB

README.es.md

File metadata and controls

304 lines (238 loc) · 9.32 KB
Raw

Idioma: English | 简体中文 | Español

CodeForge

Un widget de editor de codigo potente y completo.

Lleva una experiencia de edicion tipo VS Code a tus apps Flutter

Pub Version License GitHub Stars Platform

CodeForge Demo
Edicion fluida en archivos de mas de 1M lineas, probado en un PC antiguo de bajos recursos.

CodeForge Demo
Resaltado inteligente y diferido con LSP en archivos de 100k+ lineas

Demo de funciones: CodeForge Features Showcase

Por que CodeForge?

CodeForge es un widget de editor de codigo de nueva generacion para desarrolladores exigentes. Ya sea que construyas un IDE, un visor de snippets o una plataforma educativa, CodeForge ofrece herramientas avanzadas.

Funcion CodeForge Otros
Resaltado de sintaxis 180+ lenguajes ✅
Plegado de codigo Deteccion inteligente Limitado
Integracion LSP Soporte completo ❌
Autocompletado con IA Multi-modelo ❌
Tokens semanticos En tiempo real ❌
Diagnosticos Errores inline ❌
Deshacer/Rehacer Agrupacion inteligente Basico
Temas Totalmente personalizable Limitado

Que hace diferente a CodeForge

  • Usa estructura de datos rope para manejar texto grande con mejor rendimiento.
  • Renderiza con RenderBox y ParagraphBuilder en lugar de TextField.
  • Incluye cliente integrado de Language Server Protocol.
  • Soporta autocompletado de codigo con IA.

Instalacion

  1. Agrega CodeForge a pubspec.yaml:
dependencies:
  code_forge: ^11.3.0
  1. Luego ejecuta:
flutter pub get

Inicio rapido

import 'package:flutter/material.dart';
import 'package:code_forge/code_forge.dart';
import 'package:re_highlight/languages/python.dart';
import 'package:re_highlight/styles/atom-one-dark.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: CodeForge(
          language: langPython,
          editorTheme: atomOneDarkTheme,
        ),
      ),
    );
  }
}

Ejemplo con controlador

class _EditorState extends State<Editor> {
  final _controller = CodeForgeController();
  final _undoController = UndoRedoController();

  @override
  Widget build(BuildContext context) {
    return CodeForge(
      controller: _controller,
      undoController: _undoController,
    );
  }
}

Novedades de la version 11.0.0

  • Se elimino Rust y sus dependencias FFI; ahora el editor usa implementaciones Dart puras.
  • Se agrego soporte web directo, sin necesidad del paquete code_forge_web.
  • Se mejoro el rendimiento y se redujo el tiempo de compilacion.

Instalacion

Agrega CodeForge a pubspec.yaml y ejecuta flutter pub get:

dependencies:
  code_forge: ^11.4.0

Uso rapido

import 'package:flutter/material.dart';
import 'package:code_forge/code_forge.dart';
import 'package:re_highlight/languages/python.dart';
import 'package:re_highlight/styles/atom-one-dark.dart';

void main() => runApp(const MyApp());

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: CodeForge(
          language: langPython,
          editorTheme: atomOneDarkTheme,
        ),
      ),
    );
  }
}

Compilaciones web

En el navegador no existe acceso a rutas del sistema de archivos. Usa fileUrl para cargar el contenido remoto; filePath no esta disponible en compilaciones web:

CodeForge(
  fileUrl: 'https://example.com/files/main.dart',
  controller: controller,
)

Para habilitar LSP en web, usa LspSocketConfig y un servidor LSP expuesto mediante WebSocket. Proporciona un URI virtual con fileUri (o configura el URI en el servidor) para que el servidor pueda identificar el documento:

final controller = CodeForgeController(
  lspConfig: LspSocketConfig(
    workspacePath: 'file:///workspace',
    languageId: 'dart',
    serverUrl: 'ws://localhost:9000',
  ),
);

CodeForge(
  controller: controller,
  fileUrl: 'https://raw.githubusercontent.com/heckmon/code_forge/main/lib/code_forge/controller.dart',
  fileUri: 'file:///workspace/controller.dart',
)

Un proceso LSP no puede iniciarse con stdio desde el navegador. Puedes usar lsp-ws-proxy:

./lsp-ws-proxy --listen 0.0.0.0:9000 -- dart language-server --protocol=lsp

Para obtener un mejor rendimiento, compila con flutter build web --wasm.

Integracion LSP

CodeForge incluye un cliente LSP con autocompletado, documentacion al pasar el raton, diagnosticos, resaltado semantico, acciones de codigo, ayuda de firma, pistas en linea, ir a definicion y renombrado. Admite LspSocketConfig para WebSocket y LspStdioConfig.start para aplicaciones de escritorio.

final lspConfig = LspSocketConfig(
  workspacePath: '/ruta/al/proyecto',
  languageId: 'python',
  serverUrl: 'ws://localhost:5656',
);

final controller = CodeForgeController(lspConfig: lspConfig);

CodeForge(
  controller: controller,
  filePath: '/ruta/al/proyecto/main.py',
)

En aplicaciones nativas, filePath identifica el archivo real. En web, combina fileUrl para descargar el contenido con fileUri para el documento virtual del servidor.

Personalizacion

Todos los elementos principales se pueden personalizar mediante temas, GutterStyle, CodeSelectionStyle, SuggestionStyle, HoverDetailsStyle y MatchHighlightStyle. Tambien puedes proporcionar un finderBuilder, snippets, elementos de menu contextual y controladores de desplazamiento.

Constructor de sugerencias LSP

lspSuggestionBuilder permite reemplazar el contenido de cada fila de autocompletado LSP y elegir tus propios iconos:

CodeForge(
  lspSuggestionBuilder: (context, suggestion, isSelected) {
    return Row(
      children: [
        Icon(Icons.code, color: isSelected ? Colors.white : Colors.amber),
        const SizedBox(width: 8),
        Expanded(child: Text(suggestion.label)),
      ],
    );
  },
)

suggestion.itemType indica el tipo LSP (method, class_, variable, keyword, etc.) y suggestion.completionItem contiene los datos originales del servidor. Si el builder es null, se mantiene la fila predeterminada y los iconos TTF declarados en pubspec.yaml. El editor conserva la seleccion, el hover y el comportamiento de toque alrededor del contenido personalizado.

Referencia de API

Propiedades importantes de CodeForge: controller, editorTheme, language, textStyle, innerPadding, selectionStyle, gutterStyle, suggestionStyle, lspSuggestionBuilder, hoverDetailsStyle, matchHighlightStyle, filePath, fileUri, fileUrl, initialText, readOnly, lineWrap, autoFocus, enableFolding, enableGuideLines, enableGutter, enableSuggestions, enableKeyboardSuggestions, customCodeSnippets, customContextMenuItems, finderBuilder y deleteFoldRangeOnDeletingFirstLine.

El CodeForgeController permite editar texto y selecciones, deshacer y rehacer, buscar, desplazarse, plegar codigo, gestionar varios cursores, usar ghost text y ejecutar las funciones LSP. Consulta la documentacion completa de la API para ver todos los metodos y tipos.

Atajos de teclado

CodeForge incluye atajos para editar, navegar, cambiar la sangria, seleccionar texto, mostrar sugerencias LSP y solicitar ayuda de firma. Se pueden personalizar mediante CodeForgeKeyboardShortcuts.

Busqueda, licencia y ejemplos

El editor incluye busqueda y reemplazo, resaltado de coincidencias, plegado, diagnosticos y soporte RTL. Consulta el README en ingles y la demostracion de funciones para ver ejemplos completos. CodeForge se distribuye bajo la licencia MIT.