editor4cj:HarmonyOS多语言代码编辑库,支持高亮、自动补全与主题切换

Editor是一个多语言代码编辑器

分支16Tags11
文件最后提交记录最后更新时间
2 年前
8 个月前
8 个月前
8 个月前
8 个月前
8 个月前
1 年前
1 年前
2 年前
8 个月前
8 个月前
2 年前
8 个月前
2 年前
8 个月前
8 个月前

介绍

EditorKit 是 HarmonyOS 的多语言代码编辑库。用户通过定义EditorKit类对象,实现对语言(language)、字体大小(fontSize)、主题(theme)、编辑器文本(text)、代码编辑器高度(height)、代码编辑器宽度(width)、自动缩进(tabLen)的设置,进而实现代码高亮、滚动条、行号显示、自动补全等功能,当前只支持utf8编码。

注意:当前代码编辑器仅支持输入语法正确的场景进行关键字的高亮显色,如果输入的语法不正确,代码编辑器中的代码可能高亮显色异常。

特性

  • 支持代码编辑功能
  • 支持代码高亮功能,当前支持C、Cangjie、Go、Java、Kotlin、Swift、Python、Python3、Rust、JavaScript、TypeScript、C#、C++、PHP、Ruby、SQL、Dart、Scala、Erlang、Elixir、Lua、Racket、Objective-C、Objective-C++、Haskell、Bash、HTML、Perl、R语言
  • 支持代码滚动功能
  • 支持行号显示功能
  • 支持自动补全功能
  • 支持自动缩进功能
  • 支持语言切换、模板代码显示功能
  • 支持文本设置功能
  • 支持光标处文本插入功能
  • 支持字体大小设置
  • 支持高亮主题切换
  • 支持代码编辑器高度、代码编辑器宽度的设置

软件架构

架构

test

源码目录

├── README.md                                # 整体介绍
├── build.py                                 # editorkit编译产物打包脚本
├── doc                                      # 文档目录,包括设计文档,API接口文档等
│   └── editkit_api.md                       # API接口文档
├── editorkit                                # editorkit 三方库目录
│   └─src
│      └─main
│          ├─cangjie                         # 源码目录
│          │  ├─src
│          │  │  ├─editor_kit                # 支持多语言的代码编辑库,为开发者提供便携代码的界面
│          │  │  ├─language_base             # 语言词法高亮基类
│          │  │  ├─language_bash             # Bash语言词法高亮归类
│          │  │  ├─language_c                # C语言词法高亮归类
│          │  │  ├─language_cj               # Cangjie语言词法高亮归类
│          │  │  ├─language_cpp              # C++语言词法高亮归类
│          │  │  ├─language_csharp           # C#语言词法高亮归类
│          │  │  ├─language_dart             # Dart语言词法高亮归类
│          │  │  ├─language_elixir           # Elixir语言词法高亮归类
│          │  │  ├─language_erlang           # Erlang语言词法高亮归类
│          │  │  ├─language_go               # Go语言词法高亮归类
│          │  │  ├─language_haskell          # Haskell语言词法高亮归类
│          │  │  ├─language_html             # HTML语言词法高亮归类
│          │  │  ├─language_java             # Java语言词法高亮归类
│          │  │  ├─language_javascript       # JavaScript语言词法高亮归类
│          │  │  ├─language_kotlin           # Kotlin语言词法高亮归类
│          │  │  ├─language_lua              # Lua语言词法高亮归类
│          │  │  ├─language_objc             # Objective-C语言词法高亮归类
│          │  │  ├─language_objcpp           # Objective-C++语言词法高亮归类
│          │  │  ├─language_perl             # Perl语言词法高亮归类
│          │  │  ├─language_php              # Php语言词法高亮归类
│          │  │  ├─language_python           # Python语言词法高亮归类
│          │  │  ├─language_r                # R语言词法高亮归类
│          │  │  ├─language_racket           # Racket语言词法高亮归类
│          │  │  ├─language_ruby             # Ruby语言词法高亮归类
│          │  │  ├─language_rust             # Rust语言词法高亮归类
│          │  │  ├─language_scala            # Scala语言词法高亮归类
│          │  │  ├─language_sql              # Sql语言词法高亮归类
│          │  │  ├─language_swift            # Swift语言词法高亮归类
│          │  │  ├─language_typescript       # Typescript语言词法高亮归类
│          │  │  └─treesitter                # 语言词法解析库封装
│   └─third_party                            # 词法解析三方库封装
├── entry
│   └─src
│      └─main
│          ├─cangjie
│          │  ├─src
│          │  │  └─index.cj                  # 默认页面
│          │  │  └─main_ability.cj           # 页面主入口
│          │  │  └─ability_stage.cj          # ability实体

接口说明

主要类和函数接口说明详见 API

使用说明

编译构建

  1. 使用cjpm进行构建
cjpm build --target=aarch64-linux-ohos
  1. 使用cangjie studio构建

执行命令 build / Build Hap(s)/APP(s) / Build Hap(s)

三方库导入与使用

导入

  1. 请确保当前环境安装了python3,在Cangjie-EditorKit文件文件夹下执行命令,生成Cangjie-EditorKit\editorkit 文件夹
    python build.py
    
    # or
    
    python3 build.py
    
  2. 将 editorkit 文件夹放在工程目录"{cangjie_project_name}\entry\libs"
  3. 配置打包文件路径:{cangjie_project_name}\entry\src\main\cangjie\module.json 文件中 pakage_requires/path_option 添加 editorkit 文件夹路径

使用

from editorkit import editor_kit.*

功能示例

editorKit库UI交互

用户通过定义EditorKit类对象,实现对语言(language)、字体大小(fontSize)、主题名称(theme)、缩进长度(tabLen)、文本(text)、代码编辑器高度(height)、代码编辑器宽度(width)、光标位置文本插入(text)的设置,进而实现代码高亮、滚动条等功能。

定义示例代码如下:

package ohos_app_cangjie_entry

import ohos.base.*
import ohos.component.*
import ohos.state_manage.*
import ohos.state_macro_manage.*
import std.collection.*
import editorkit.editor_kit.*
import editorkit.editor_kit.editorKitUtils.*
import editorkit.editor_kit.utils.*

@Entry
@Component
class MyView {
    var height: Float64 = 300.0

    var width: Float64 = 380.0

    var language: LANGUAGETYPE = LANGUAGETYPE.C

    var fontSize: Int64 = 13

    var themeName: THEMENAMETYPE = THEMENAMETYPE.DARCULA

    var tabLen: Int64 = 4

    var text: String = """
/**
 * Note: The returned array must be malloced, assume caller calls free().
 */
int* twoSum(int* nums, int numsSize, int target, int* returnSize) {

}"""

   var editorKitController: EditorKitController = EditorKitController(width: width, height: height, language: language, text: text)

    func build() {
        Column() {
            EditorKit(
                editorKitController: editorKitController,
            )
        }
    }
}

上面代码中通过设置变量实现相关功能,使用方法如下:

editorKitController.setWidth(width)
editorKitController.setHeight(height)
editorKitController.setLanguageAndText(language, text)
editorKitController.setText(text)
editorKitController.insertTextOnCursor(text, offset)
editorKitController.setFontSize(fontSize)
editorKitController.setTabLen(tabLen)
editorKitController.setThemeName(theme)

上面代码中通过使用方法获取 editorKit 中文本,使用方法如下:

editorKitController.getText()

当前默认语言为C语言,字体大小为13,主题为DARCULA,缩进值为4,编辑器高度为300.0,编辑器宽度为380.0,代码编辑器内容实时更新

约束与限制

当前基于 OpenHarmony Cangjie Mobile1.1.0.B100版本实现的

开源协议

Apache-2.0 license,具体细节请参照License文件

参与贡献

欢迎给我们提交PR,欢迎给我们提交Issue,欢迎参与任何形式的贡献。

项目介绍

Editor是一个多语言代码编辑器

定制我的领域