RichEditor
1.0.0
풍부한 텍스트 편집기
풍부한 텍스트 편집은 긴 텍스트 유형을 지원해야한다는 점을 고려할 때 대부분의 풍부한 텍스트는 사용자 정의 단일 edittext를 사용하여보기를 재사용 할 수 없습니다. 따라서 RecycleView를 기반으로 구현 된 풍부한 텍스트 편집기는 현재 개발 과정에 있습니다.
풍부한 텍스트 편집기를 구현하기 위해 구현 된 편집기가 지원 해야하는 몇 가지 필요한 기능을 확실히 생각할 것입니다.
1. 많은 텍스트, 그림 및 텍스트 스타일의 디스플레이 및 편집이 포함됩니다.
2. 매우 복잡한 사용자 상호 작용을 포함합니다.
GitHub에서 내가 알고있는 풍부한 텍스트 편집기는 기본적으로 두 가지 유형을 기반으로 구현됩니다.
이 두 솔루션에 대한 개인적인 의견은 다음과 같습니다.
우선, WebView의 렌더링 성능의 한 가지 단점은 다음과 같습니다. 둘째, 매우 복잡한 인간 컴퓨터 상호 작용이 포함되면 WebView를 구현하기가 더 어려울 것입니다. 또 다른 요점은 WebView의 호환성이 고려해야 할 사항이라는 것입니다.
단일 edittext를 다시 작성하려면 실제로 상호 작용, 텍스트 렌더링 및 스타일 지원이 매우 확장 가능합니다. 그러나 많은 그림이 있다는 점을 고려할 때 여기에서 메모리 상황을 고려해야합니다. editText의 경우, 뷰 재사용은 확실히 없습니다. 기본적으로 그림이있는만큼 메모리가 필요합니다. 반면에, Native TextView는 항상 많은 양의 텍스트를 렌더링하는 것으로 비판을 받았으며 TextView의 성능을 최적화하기위한 많은 솔루션이 있습니다.
그래서 나는 리치 텍스트 편집기를 구현하기위한 구현 솔루션으로 RecyclerView를 사용하기로 결정했습니다. 함정이 있지만 실현 가능한 솔루션이기도합니다. (Douban의 편집자는 RecyclerView를 사용하여 구현됩니다)
장점 : 우선, 기본 구성 요소로서 Recyclervie는 다수의 UI 구성 요소를 표시하기에 매우 우수한 성능을 가지고 있습니다. 둘째, RecyclerView의 멀티플렉싱 메커니즘은 메모리 소비 제어를 잘 지원합니다.
단점 :: 물론, 이것은 풍부한 텍스트 편집기를 구현하기위한 첫 번째 선택이 아닙니다. 구현 과정에서 많은 큰 함정을 만났습니다. 다음은 다음과 같습니다.
1. 포커스 컨트롤
2. 데이터 스 플라이 싱
3 스타일 스토리지
4. 커서의 위치
그리고 훨씬 더 ...
다행히이 솔루션은 결국이 구현 솔루션을 공유하고 도움이 필요한 사람들을위한 구현 솔루션을 제공하겠습니다.
1. 굵은, 이탤릭체, 밑줄, 미드 스코어, 스트라이크 로우, 하이퍼 링크, 참조 스타일, H1, H2, H3, H4 텍스트.
2. 그림을 삽입하고 삭제하십시오
3. 실시간으로 스타일을 변경하려면 텍스트를 선택하십시오
4. 스타일을 어디서나 래핑하십시오.
5. 스타일을 유지하기 위해 두 줄을 한 줄로 삭제하십시오.
6. 제어판의 커서를 사용하여 텍스트 스타일을 실시간으로 표시합니다.
7. 모든 위치에 스타일을 삽입하십시오
8. 최종 편집 텍스트는 Markdown으로 전송됩니다 (버그 ~ ...)
기다리다. . .
RecyclerView 구현의 경우, 캐리지 리턴의 해당 작업은 모델을 추가하는 것이므로 캐리지 리턴 라인 래핑 및 삭제에는 많은 논리적 처리가 필요하며 스타일 인덱스의 스 플라이 싱 및 분할도 포함됩니다. 요컨대, 그것은 큰 구덩이입니다.
선택한 후 커서, 스타일을 지정하고 스타일을 지우고 나누고 스타일을 재현하고 할당해야합니다. 큰 구덩이, 큰 구덩이.
커서가 해당 스타일의 문자열에 해당하면 아래 패널은 현재 스타일을 실시간으로 변경합니다. 커서와 스타일 간격에 대한 논리적 판단을하기 위해 간격의 논리적 판단을 사용해야하며 점점 더 많은 함정이 있습니다. . .
여기에 표시되지 않은 복잡한 대화식 처리가 많이 있습니다. 자세한 내용은 소스 코드를 확인할 수 있습니다.
부유 한
이 프로젝트는 여기에 Jitpack에 게시되지 않았습니다. 풍부한 텍스트 편집기로서 모든 사람은 고유 한 요구와 상호 작용 방법을 가지고 있으며 모든 요구를 충족시킬 수있는 풍부한 텍스트를 달성 할 수있는 방법이 없기 때문입니다. 풍부한 텍스트 편집기의 상호 작용 논리는 실제로 복잡하기 때문에 모든 상호 작용과 상황과의 호환성을 보장하는 것은 불가능하므로 여기서는 상호 작용 상황을 구현하기 위해 최선을 다합니다.
1. Editor 's Lib를 Project 2.XML에 소개하여 편집기를 추가하십시오.
<com.study.xuan.editor.widget.Editor
android:id="@+id/editor"
android:layout_width="match_parent"
android:layout_height="match_parent"/>
정상적으로 사용됩니다.
너무 간단하여 캡슐화되어 Richhelper를 사용하는 데 사용됩니다.
//绑定xml中的Editor
public void attach(Editor editor);
//new 一个Editor
public Editor buildEditor(Context context)
//部分事件回调
public void setCallBack(onEditorEventListener callBack)
//操作面板右侧空白增加自定义布局
public void setMoreOperateLayout(View view)
//异步转义MarkDown
public void toMarkDown()
public interface onEditorCallback {
//行数量变化时
void onLineNumChange(List<RichModel> data);
//点击操作面板的图片添加图片，可以使用自己项目中的图片框架，选中后对应调用editor.addPhoto(List<String> data);方法即可
void onPhotoEvent();
//转义MarkDown的进度回调
void onMarkDownTaskDoing(int progress, int max);
//转义MarkDown成功
void onMarkDownTaskFinished(String markdown);
}
기본 아키텍처 인 Global Singleton은 Richeditor의 전반적인 기능을 구현하는 데 도움이됩니다.
구현 클래스 패널 빌더에는 두 개의 구현 클래스가 포함되어 있습니다. fontparambuilder는 문자 유형의 스타일을 나타내고 단락 부는 단락 유형의 스타일을 나타냅니다. Panle과 편집자 간의 커뮤니케이션 방법은 기본 Richbuilder Singleton의 Ipanel을 통해입니다.
외부 레이어에서 스팬 유형을 만드는 데 사용되는 초록 엔지니어링 클래스. 그중에서도 추상 공장은 ICHARACTERSTYLEFACTORY, IPARAGRAPHFACTORY 및 IUPDATEAPPEARANCEFACTORY의 세 가지 스팬 공장으로 나뉘어져 있습니다.
검색 전략은 특정 단락에서 스팬 스타일을 가로 지르고 처리하는 데 사용됩니다. Normalsearch는 isearchstrategy를 구현하고 정기적 인 트래버스 처리를 사용합니다 (빠른 정렬 또는 기타 효율적인 정렬 방법을 처리 할 수 있습니다)
매개 변수 관리 인터페이스는 클래스에 해당하는 Parammanager를 구현하며 현재 스타일과 사전 입력 스타일을 비교하고 처리하는 데 사용됩니다.
RecyclerView에서 상속 된 편집기 구현 클래스, 어댑터는 Richadapter에 해당하며 모델은 RichModel에 해당합니다.
입력 및 삭제시 스타일 처리를위한 입력 필터.
spanstep1filter
첫 번째 레벨 필터는 스타일을 처리하고 혼란을 처리 할 때 SPAN_EXCLUSIVE_INCLUSIVE 및 SPAN_EXCLUSIVE_EXCLUSIVE 의 처리를 처리하는 데 사용됩니다.
spanstep2filter
두 번째 레벨 필터는 스타일의 생성 및 유지 보수를 처리하고 현재 텍스트의 모든 스타일 세트를 얻고 스타일의 해당 인덱스를 기록하고 해당 RichModel에서 유지하는 데 사용됩니다.
데이터를 해당 변환 유형으로 처리하는 데 사용되는 비동기 처리.
구문 분석
인터페이스 변환
Markdownparse
정규 표현식을 사용하여 Markdown 구문으로 변환되었습니다.
데이터 처리 클래스, 병합 스타일, 처리 스타일 등과 관련된 데이터 처리를 사용합니다.
패널은 작동 패널을 나타내고 패널은 기본적으로 editorPanelalpha를 사용합니다. 패널은 RichBuilder의 Ipanel을 통해 구현되어 편집기를 연결합니다.
[2018.3.17] : 텍스트 줄 내에서 풍부한 텍스트 편집.
[2018.3.19] : 여러 줄의 텍스트 삭제를 완료하고 한 줄을 추가 한 다음 다음 줄을 이전 줄로 삭제하십시오. 그리고 스타일을 유지하십시오.
[2018.3.20] : 첫 번째 삭제 줄과 인라인 입력을 포함하여 여러 줄의 텍스트 라인을 삭제하고 추가하여 풍부한 텍스트 스타일을 단락과 함께 움직입니다.
[2018.3.24] : 클릭 후 작동 막대의 동기화를 완료하여 현재 텍스트 스타일과 작동 막대 스타일을 통합합니다.
[2018.3.29] : 새로운 스타일을 삽입하는 기능을 완성하고 처음에는 편집의 기본 기능을 완료합니다.
[2018.4.09] : 완전한 단락 스타일 기능.
[2018.4.11] : Markdown 구문 탈출의 예비 완료.
Copyright 2017 [DrownCoder]
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.
