From a97b5105f5c2d17208ab0d7006da17f501db63da Mon Sep 17 00:00:00 2001 From: Summer Kiflain Date: Mon, 13 Jan 2020 14:58:35 +0500 Subject: [PATCH 1/3] Added search input text font option --- src/SearchBar.ios.js | 7 +++++-- src/SearchBar.js | 3 +++ src/SearchLayout.js | 1 + 3 files changed, 9 insertions(+), 2 deletions(-) diff --git a/src/SearchBar.ios.js b/src/SearchBar.ios.js index 13472a4..91450dc 100644 --- a/src/SearchBar.ios.js +++ b/src/SearchBar.ios.js @@ -112,6 +112,9 @@ export default class SearchBar extends React.PureComponent { if (this.props.textColor) { searchInputStyle.color = this.props.textColor; } + if (this.props.textFont) { + searchInputStyle.fontFamily = this.props.textFont; + } return ( @@ -151,10 +154,10 @@ export default class SearchBar extends React.PureComponent { onLayout={this._handleLayoutCancelButton} onPress={this._handlePressCancelButton}> + }, this.props.textFont ? { fontFamily: this.props.textFont } : null]}> {this.props.cancelButtonText || 'Cancel'} diff --git a/src/SearchBar.js b/src/SearchBar.js index 23d049f..11813b6 100644 --- a/src/SearchBar.js +++ b/src/SearchBar.js @@ -21,6 +21,9 @@ export default class SearchBar extends React.PureComponent { if (this.props.textColor) { searchInputStyle.color = this.props.textColor; } + if (this.props.textFont) { + searchInputStyle.fontFamily = this.props.textFont; + } return ( diff --git a/src/SearchLayout.js b/src/SearchLayout.js index 3e3d988..8515553 100644 --- a/src/SearchLayout.js +++ b/src/SearchLayout.js @@ -43,6 +43,7 @@ export default class SearchLayout extends React.Component { onSubmit={this._handleSubmit} placeholderTextColor={this.props.searchInputPlaceholderTextColor} textColor={this.props.searchInputTextColor} + textFont={this.props.searchInputTextFont} selectionColor={this.props.searchInputSelectionColor} underlineColorAndroid={ this.props.searchInputUnderlineColorAndroid || From bf7cb7ae25f349c8e013360352bb58834bbb85c5 Mon Sep 17 00:00:00 2001 From: Summer Kiflain Date: Thu, 17 Dec 2020 17:23:31 +0500 Subject: [PATCH 2/3] Changed textFont to textFontFamily --- src/SearchBar.ios.js | 16 ++++++++++------ src/SearchBar.js | 4 ++-- src/SearchLayout.js | 2 +- 3 files changed, 13 insertions(+), 9 deletions(-) diff --git a/src/SearchBar.ios.js b/src/SearchBar.ios.js index 91450dc..337fb5b 100644 --- a/src/SearchBar.ios.js +++ b/src/SearchBar.ios.js @@ -112,8 +112,8 @@ export default class SearchBar extends React.PureComponent { if (this.props.textColor) { searchInputStyle.color = this.props.textColor; } - if (this.props.textFont) { - searchInputStyle.fontFamily = this.props.textFont; + if (this.props.textFontFamily) { + searchInputStyle.fontFamily = this.props.textFontFamily; } return ( @@ -154,10 +154,14 @@ export default class SearchBar extends React.PureComponent { onLayout={this._handleLayoutCancelButton} onPress={this._handlePressCancelButton}> + style={[ + { + fontSize: 17, + color: this.props.tintColor || '#007AFF', + }, + this.props.textFontFamily ? { fontFamily: this.props.textFontFamily } : null + ]} + > {this.props.cancelButtonText || 'Cancel'} diff --git a/src/SearchBar.js b/src/SearchBar.js index 11813b6..dd97d5a 100644 --- a/src/SearchBar.js +++ b/src/SearchBar.js @@ -21,8 +21,8 @@ export default class SearchBar extends React.PureComponent { if (this.props.textColor) { searchInputStyle.color = this.props.textColor; } - if (this.props.textFont) { - searchInputStyle.fontFamily = this.props.textFont; + if (this.props.textFontFamily) { + searchInputStyle.fontFamily = this.props.textFontFamily; } return ( diff --git a/src/SearchLayout.js b/src/SearchLayout.js index 8515553..e614cea 100644 --- a/src/SearchLayout.js +++ b/src/SearchLayout.js @@ -43,7 +43,7 @@ export default class SearchLayout extends React.Component { onSubmit={this._handleSubmit} placeholderTextColor={this.props.searchInputPlaceholderTextColor} textColor={this.props.searchInputTextColor} - textFont={this.props.searchInputTextFont} + textFontFamily={this.props.searchInputTextFontFamily} selectionColor={this.props.searchInputSelectionColor} underlineColorAndroid={ this.props.searchInputUnderlineColorAndroid || From 6d910c6f122a6d41a877aa7243af3f94850e5c56 Mon Sep 17 00:00:00 2001 From: Summer Kiflain Date: Mon, 21 Dec 2020 14:58:10 +0500 Subject: [PATCH 3/3] Incorporated PR feedback --- react-navigation-addon-search-layout.d.ts | 3 +++ src/SearchBar.ios.js | 13 +++++-------- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/react-navigation-addon-search-layout.d.ts b/react-navigation-addon-search-layout.d.ts index 0ac234a..5ead71d 100644 --- a/react-navigation-addon-search-layout.d.ts +++ b/react-navigation-addon-search-layout.d.ts @@ -20,6 +20,9 @@ declare module 'react-navigation-addon-search-layout' { /** Color of text that the user enters into the search box **/ textColor?: string; + /** FontFamily of text that the user enters into the search box and for the text shown as cancel button **/ + textFontFamily?: string; + /** Underline color of the text input on Android **/ searchInputUnderlineColorAndroid?: string; diff --git a/src/SearchBar.ios.js b/src/SearchBar.ios.js index 337fb5b..36b097c 100644 --- a/src/SearchBar.ios.js +++ b/src/SearchBar.ios.js @@ -154,14 +154,11 @@ export default class SearchBar extends React.PureComponent { onLayout={this._handleLayoutCancelButton} onPress={this._handlePressCancelButton}> + style={{ + fontSize: 17, + color: this.props.tintColor || '#007AFF', + ...(this.props.textFontFamily && { fontFamily: this.props.textFontFamily }), + }}> {this.props.cancelButtonText || 'Cancel'}