diff --git a/README.md b/README.md
index d337628..c5ad2d0 100644
--- a/README.md
+++ b/README.md
@@ -93,7 +93,9 @@ import {
| iconSize | number | 25 | set the icon size |
| iconColor | color | #000 | set the icon color |
| onChangeText | function | function | set your own logic for changing text |
+| value | string | undefined | set the value for search box's text input |
| searchBoxText | string | What are you looking for? | set the search box's text |
+| searchBoxTextStyle | style | default | set your own style for text input's style |
| searchBoxOnPress | function | function | set your own logic when tapping the search box itself |
| searchBoxWidth | number | 95% | change the search box's width |
| searchBoxBorderRadius | number | 8 | change the search box's border radius |
diff --git a/example/App.js b/example/App.js
index 3a75353..616b183 100644
--- a/example/App.js
+++ b/example/App.js
@@ -1,16 +1,20 @@
import React from "react";
import { View, StatusBar } from "react-native";
-import {
- HeaderSearchBar,
- HeaderClassicSearchBar
-} from "react-native-header-search-bar";
+import { SafeAreaProvider } from "react-native-safe-area-context";
+// import {
+// HeaderSearchBar,
+// HeaderClassicSearchBar
+// } from "react-native-header-search-bar";
+import HeaderClassicSearchBar from "./lib/src/HeaderClassicSearchBar/HeaderClassicSearchBar";
const App = () => {
return (
-
-
- console.log(text)} />
-
+
+
+
+ console.log(text)} />
+
+
);
};
diff --git a/example/package.json b/example/package.json
index 1921a91..ebfadb6 100644
--- a/example/package.json
+++ b/example/package.json
@@ -3,7 +3,7 @@
"version": "0.0.1",
"private": true,
"scripts": {
- "android": "react-native run-android",
+ "android": "adb reverse tcp:8081 tcp:8081 && npx jetify && react-native bundle --platform android --dev false --entry-file index.js --bundle-output android/app/src/main/assets/index.android.bundle --assets-dest android/app/src/main/res && react-native start --reset-cache",
"ios": "react-native run-ios",
"start": "react-native start",
"test": "jest",
@@ -15,7 +15,7 @@
"react-native": "0.61.2",
"react-native-androw": "0.0.33",
"react-native-dynamic-vector-icons": "^0.2.1",
- "react-native-header-search-bar": "0.1.3",
+ "react-native-header-search-bar": "0.1.7",
"react-native-material-ripple": "^0.9.1",
"react-native-safe-area-context": "^0.6.1",
"react-native-vector-icons": "^6.6.0"
diff --git a/lib/src/components/SearchBox/SearchBox.js b/lib/src/components/SearchBox/SearchBox.js
index 1bc46a2..0aa9f14 100644
--- a/lib/src/components/SearchBox/SearchBox.js
+++ b/lib/src/components/SearchBox/SearchBox.js
@@ -6,6 +6,7 @@ import styles, { searchBoxContainer } from "./SearchBox.style";
const SearchBox = props => {
const {
+ value,
onFocus,
iconName,
iconType,
@@ -17,6 +18,7 @@ const SearchBox = props => {
searchBoxWidth,
searchBoxOnPress,
disableTextInput,
+ searchBoxTextStyle,
searchBoxBorderRadius,
searchBoxBackgroundColor
} = props;
@@ -26,10 +28,11 @@ const SearchBox = props => {
return {searchBoxText};
return (
);
};
diff --git a/lib/src/components/SearchBox/SearchBox.style.js b/lib/src/components/SearchBox/SearchBox.style.js
index fe0125f..360b60c 100644
--- a/lib/src/components/SearchBox/SearchBox.style.js
+++ b/lib/src/components/SearchBox/SearchBox.style.js
@@ -8,7 +8,9 @@ export function searchBoxContainer(
return {
left: 8,
padding: 6,
+ alignItems: "center",
width: searchBoxWidth,
+ justifyContent: "center",
height: isAndroid ? 30 : null,
borderRadius: searchBoxBorderRadius,
backgroundColor: searchBoxBackgroundColor
@@ -23,7 +25,9 @@ export default {
searchBoxTextStyle: {
left: 3,
width: "85%",
- fontSize: 12,
- color: "black"
+ fontSize: 13,
+ color: "#000",
+ height: isAndroid ? 50 : null,
+ backgroundColor: "transparent"
}
};