开源项目920富文本编辑器

TextEditor文本编辑器

前言

该富文本编辑器: 内核使用的是ace(https://githup.com/ajaxorg/ace) , 所以编译该项目需要先编辑ace内核。

前提: 先安装 node node.js npm

方法:

cd tools/assets/ace/

node ./Makefile.dryice.js

常出现的问题:

会出现一些问题: 比如Modules　thow error . 可以查看(https://github.com/nodejs/help/issues/663) 进行解决。

整体结构

服务器代码位置: origin git://192.168.0.185/TextEditor.git

项目工程(app)

ui包

编辑器的主要界面的搭建。

file_explore

文件浏览module用于打开/另存为/保存时，文件存储位置的浏览.

common

styles

这两个module主要是一些辅助。

核心代码

assets资源文件夹

ace文件夹

ace内核

这里都是js的文件

css

文本编辑区的样式

这部分核心编辑区的开发需要web的知识。

功能需求

这个主要还是原项目的内容

原项目: https://github.com/jecelyin/920-text-editor-v2

项目逻辑代码分析

EditAreaView.java

富文本编辑器的实现都是通过extends　WebView.

基础配置如下:

WebSettings ws = getSettings();
ws.setDefaultZoom(WebSettings.ZoomDensity.FAR);
ws.setAllowContentAccess(true);
ws.setAllowFileAccess(true);
ws.setBuiltInZoomControls(false);
ws.setDefaultTextEncodingName("utf-8");
ws.setDisplayZoomControls(false);
ws.setSupportZoom(false);
ws.setLoadWithOverviewMode(false);

ws.setJavaScriptEnabled(true);
ws.setAppCacheEnabled(false);
ws.setDomStorageEnabled(true);
ws.setAppCacheMaxSize(1024 * 1024 * 80);
ws.setAppCachePath(context.getCacheDir().getPath());
//ws.setAllowFileAccess(true);
ws.setCacheMode(WebSettings.LOAD_DEFAULT);

addJavascriptInterface(new JavascriptApi(), "AndroidEditor");//交互接口AndroidEditor

setWebViewClient(new EditorViewClient());
setWebChromeClient(new EditorViewChromeClient());

InputConnectionHacker.java

该类 implements InputConnection

InputConnection.java- 用于文本输入的接口

openthos 系统中在InputConnection中添加了 isLauncherFocus(boolean isFocus)方法

在InputConnectionHacker中也需要实现该方法；

MenuDialog.java

顶部菜单的dialog实现

TabManager.java

implements TabViewPager.OnPageChangeListener

对编辑栏的增加

TabAdapter.java

extends RecyclerView.Adapter

实现布局的

针对js和java之间的调用

bridge.js

AndroidEditor.onScrollStart();

EditAreaView.java

@JavascriptInterface

public void onScrollStart() {

……

}

函数名一致进行 transmit.