https://github.com/p4ymak/egui_code_editor

egui Code Editor widget with numbered lines and syntax highlighting..
https://github.com/p4ymak/egui_code_editor

Last synced: 5 days ago
JSON representation

egui Code Editor widget with numbered lines and syntax highlighting..

• Host: GitHub
• URL: https://github.com/p4ymak/egui_code_editor
• Owner: p4ymak
• Created: 2023-07-17T11:54:22.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-09-27T09:54:00.000Z (about 1 month ago)
• Last Synced: 2024-10-31T12:15:47.608Z (9 days ago)
• Language: Rust
• Homepage: https://www.donationalerts.com/r/p4ymak
• Size: 457 KB
• Stars: 46
• Watchers: 2
• Forks: 16
• Open Issues: 2
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-egui - egui code editor widget

README

        
# Egui Code Editor

Text Editor Widget for [egui](https://github.com/emilk/egui) with numbered lines and simple syntax highlighting based on keywords sets.

## Usage with egui

```rust

use egui_code_editor::{CodeEditor, ColorTheme, Syntax};

CodeEditor::default()

  .id_source("code editor")

  .with_rows(12)

  .with_fontsize(14.0)

  .with_theme(ColorTheme::GRUVBOX)

  .with_syntax(Syntax::rust())

  .with_numlines(true)

  .show(ui, &mut self.code);

```

## Usage as lexer without egui

**Cargo.toml**

```toml

[dependencies]

egui_code_editor = { version = "0.2" , default-features = false }

colorful = "0.2.2"

```

**main.rs**

```rust

use colorful::{Color, Colorful};

use egui_code_editor::{Syntax, Token, TokenType};

fn color(token: TokenType) -> Color {

    match token {

        TokenType::Comment(_) => Color::Grey37,

        TokenType::Function => Color::Yellow3b,

        TokenType::Keyword => Color::IndianRed1c,

        TokenType::Literal => Color::NavajoWhite1,

        TokenType::Numeric(_) => Color::MediumPurple,

        TokenType::Punctuation(_) => Color::Orange3,

        TokenType::Special => Color::Cyan,

        TokenType::Str(_) => Color::Green,

        TokenType::Type => Color::GreenYellow,

        TokenType::Whitespace(_) => Color::White,

        TokenType::Unknown => Color::Pink1,

    }

}

fn main() {

    let text = r#"// Code Editor

CodeEditor::default()

    .id_source("code editor")

    .with_rows(12)

    .with_fontsize(14.0)

    .with_theme(self.theme)

    .with_syntax(self.syntax.to_owned())

    .with_numlines(true)

    .vscroll(true)

    .show(ui, &mut self.code);

    "#;

    let syntax = Syntax::rust();

    for token in Token::default().tokens(&syntax, text) {

        print!("{}", token.buffer().color(color(token.ty())));

    }

}

```

## Themes

Based on themes in [Helix Editor](https://github.com/helix-editor/helix).

Font used in examples is [Comic Code](https://tosche.net/fonts/comic-code) by Toshi Omagari.

### Ayu

![Ayu](screenshots/ayu.png)

### Ayu Dark

![Ayu Dark](screenshots/ayu_dark.png)

### Ayu Mirage

![Ayu Mirage](screenshots/ayu_mirage.png)

### Github Dark

![Github Dark](screenshots/github_dark.png)

### Github Light

![Github Light](screenshots/github_light.png)

### Gruvbox

![Gruvbox](screenshots/gruvbox.png)

### Gruvbox Light

![Gruvbox Light](screenshots/gruvbox_light.png)

### Sonokai

![Sonokai](screenshots/sonokai.png)