feat: update README.md

Author: duom青源

README.md

@@ -1,24 +1,31 @@
 # react-native-variable-text-input
 
-my variable textInput
+custom emoji textInput mentions which works both ios and Android
+
+## Demonstration
+
+<img src="./gifs/demo.gif?raw=true" width="60%">
+
+## Key features
+
+-Support for customized emoji
+-Support for inserting tags (@ && #)
 
 ## Installation
 
+Install `react-native-variable-text-input` package from npm:
+
 ```sh
 yarn add react-native-variable-text-input
-```
-```ios
+# or
+# npm install react-native-variable-text-input --save
 cd ios
 pod install
-## Usage
-
-```js
-import { VariableTextInputView } from "react-native-variable-text-input";
+```
 
-// ...
+## Documentation
 
-<VariableTextInputView  style = {{flex:1,height:20,width:'100%'}}/>
-```
+//todo
 
 ## Contributing
 

example/src/App.tsx

@@ -16,14 +16,15 @@ import VariableTextInputView, {
 export const App = () => {
   const inPutRef = React.createRef<IATTextViewBase>();
   const onChangeText = (text: string) => {
+    console.log('输入框数据====>', text);
     const triggerRegEx = /({([^{^}]*)}\[([^[]*)]\(([^(^)]*)\))/gi;
     const singleGroupTriggerRegEx = /({[^{^}]*}\[[^[]*]\([^(^)]*\))/gi;
     const matchStr = text.match(triggerRegEx);
     if (matchStr !== null) {
       const subStrArr = text.split(triggerRegEx);
       subStrArr.forEach((item) => {
         const arr = item.match(singleGroupTriggerRegEx);
-        console.log('====>', arr);
+        console.log('==处理后的数据==>', arr);
       });
     }
   };
@@ -42,9 +43,9 @@ export const App = () => {
   };
   const insertMonthons = () => {
     inPutRef.current?.insertMentions({
-      tag: '#',
-      name: '测试tag',
-      color: 'red',
+      tag: '@',
+      name: 'James Harden',
+      color: '#CEDA39',
       id: '123344',
       type: ITextType.tagText,
     });
@@ -57,14 +58,24 @@ export const App = () => {
     const tagData: IInserTextAttachmentItem = {
       tag: '#',
       name: '测试tag',
-      color: 'red',
+      color: '#CEDA39',
       id: '123344',
       type: ITextType.tagText,
     };
     inPutRef.current?.changeAttributedText([
       { type: 0, text: '普通字符' },
       { type: 1, ...emojiData },
       tagData,
+      { type: 0, text: '普通字符' },
+      tagData,
+      { type: 1, ...emojiData },
+      { type: 0, text: '普通字符' },
+      tagData,
+      { type: 0, text: '普通字符' },
+      tagData,
+      { type: 1, ...emojiData },
+      { type: 1, ...emojiData },
+      { type: 1, ...emojiData },
     ]);
   };
   const focus = () => {
@@ -120,7 +131,7 @@ const styles = StyleSheet.create({
     justifyContent: 'center',
   },
   box: {
-    backgroundColor: 'blue',
+    backgroundColor: '#000',
     color: '#fff',
     fontSize: 14,
     width: '100%',