arronhunt / react-native-emoji-selector

βš›οΈπŸ˜Ž Simple, customizable and theme-able Emoji selector for React Native
https://www.npmjs.com/package/react-native-emoji-selector
MIT License
296 stars 111 forks source link

Fix style for android #64

Open congduong97 opened 8 months ago

congduong97 commented 8 months ago

Hi! πŸ‘‹

Firstly, thanks for your work on this project! πŸ™‚

Today I used patch-package to patch react-native-emoji-selector@0.2.0 for the project I'm working on.

Here is the diff that solved my problem:

diff --git a/node_modules/react-native-emoji-selector/index.js b/node_modules/react-native-emoji-selector/index.js
index 0737acd..282de94 100644
--- a/node_modules/react-native-emoji-selector/index.js
+++ b/node_modules/react-native-emoji-selector/index.js
@@ -81,8 +81,8 @@ const TabBar = ({ theme, activeCategory, onPress, width }) => {
           style={{
             flex: 1,
             height: tabSize,
-            borderColor: category === activeCategory ? theme : "#EEEEEE",
-            borderBottomWidth: 2,
+            borderColor:  '#EEEEEE' ,
+            borderBottomWidth: category === activeCategory ? 1:0,
             alignItems: "center",
             justifyContent: "center"
           }}
@@ -91,7 +91,7 @@ const TabBar = ({ theme, activeCategory, onPress, width }) => {
             style={{
               textAlign: "center",
               paddingBottom: 8,
-              fontSize: tabSize - 24
+              fontSize: tabSize - 20
             }}
           >
             {category.symbol}
@@ -180,11 +180,16 @@ export default class EmojiSelector extends Component {
   };

   loadHistoryAsync = async () => {
-    let result = await AsyncStorage.getItem(storage_key);
-    if (result) {
-      let history = JSON.parse(result);
-      this.setState({ history });
+    try {
+      let result = await AsyncStorage.getItem(storage_key);
+      if (result) {
+        let history = JSON.parse(result);
+        this.setState({ history });
+      }
+    } catch (error) {
+      
     }
+   
   };

   //
@@ -295,9 +300,9 @@ export default class EmojiSelector extends Component {
           clearButtonMode="always"
           returnKeyType="done"
           autoCorrect={false}
-          underlineColorAndroid={theme}
           value={searchQuery}
           onChangeText={this.handleSearch}
+          placeholderTextColor={'#D6D6D6'}
         />
       </View>
     );
@@ -381,9 +386,16 @@ const styles = StyleSheet.create({
   searchbar_container: {
     width: "100%",
     zIndex: 1,
-    backgroundColor: "rgba(255,255,255,0.75)"
   },
   search: {
+    backgroundColor: '#424242',
+    padding:0,
+    borderRadius:16,
+    fontSize:12,
+    borderWidth:0,
+    paddingVertical:6,
+    paddingHorizontal:8,
+    color:'#D6D6D6',
     ...Platform.select({
       ios: {
         height: 36,
@@ -393,6 +405,7 @@ const styles = StyleSheet.create({
       }
     }),
     margin: 8
+
   },
   container: {
     flex: 1,

This issue body was partially generated by patch-package.