Skip to content

Commit 5150865

Browse files
ErjanGavaljiErjanGavalji
committed
Merge pull request NativeScript#204 from Nathanaela/search-bar-hint-color2
Search bar hint color
2 parents 20fb94e + b259cde commit 5150865

File tree

9 files changed

+135
-1
lines changed

9 files changed

+135
-1
lines changed

‎apps/tests/testRunner.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -70,6 +70,7 @@ allTests["TIME-PICKER"] = require("./ui/time-picker/time-picker-tests");
7070
allTests["WEB-VIEW"] = require("./ui/web-view/web-view-tests");
7171
allTests["WEAK-EVENTS"] = require("./weak-event-listener-tests");
7272
allTests["REPEATER"] = require("./ui/repeater/repeater-tests");
73+
allTests["SEARCH-BAR"] = require('./ui/search-bar/search-bar-tests');
7374

7475
if (!isRunningOnEmulator()) {
7576
allTests["LOCATION"] = require("./location-tests");

‎apps/tests/ui/search-bar/search-bar-tests-native.android.ts‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
import colorModule = require("color");
2+
import searchBarModule = require("ui/search-bar");
3+
4+
function getTextView(bar: android.widget.SearchView): android.widget.TextView {
5+
if (bar) {
6+
var id = bar.getContext().getResources().getIdentifier("android:id/search_src_text", null, null);
7+
if (id) {
8+
return <android.widget.TextView> bar.findViewById(id);
9+
}
10+
}
11+
12+
return undefined;
13+
}
14+
15+
export function getNativeHintColor(searchBar: searchBarModule.SearchBar): colorModule.Color {
16+
var textView = getTextView(searchBar.android);
17+
18+
if (textView) {
19+
return new colorModule.Color(textView.getHintTextColors().getDefaultColor());
20+
}
21+
return undefined;
22+
}

‎apps/tests/ui/search-bar/search-bar-tests-native.d.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
//@private
2+
import searchBarModule = require("ui/search-bar");
3+
import colorModule = require("color");
4+
5+
export declare function getNativeHintColor(textView: searchBarModule.SearchBar): colorModule.Color;

‎apps/tests/ui/search-bar/search-bar-tests-native.ios.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import colorModule = require("color");
2+
import searchBarModule = require("ui/search-bar");
3+
4+
export function getNativeHintColor(searchBar: searchBarModule.SearchBar): colorModule.Color {
5+
// TODO: This test needs to be created
6+
return undefined;
7+
}

‎apps/tests/ui/search-bar/search-bar-tests.ts‎

Lines changed: 44 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,9 @@
1-
import observable = require("data/observable");
1+
import TKUnit = require("../../TKUnit");
2+
import helper = require("../helper");
3+
import viewModule = require("ui/core/view");
4+
import searchBarTestsNative = require("./search-bar-tests-native");
5+
import colorModule = require("color");
6+
import observable = require("data/observable");
27
// <snippet module="ui/search-bar" title="search-bar">
38
// # SearchBar
49
// Using the SearchBar requires the "ui/search-bar" module.
@@ -15,6 +20,44 @@ import searchBarModule = require("ui/search-bar");
1520
//```
1621
// </snippet>
1722

23+
var _createSearchBarFunc = function (): searchBarModule.SearchBar {
24+
// <snippet module="ui/search-bar" title="SearchBar">
25+
// ### Creating a SearchBar
26+
// ``` JavaScript
27+
var searchBar = new searchBarModule.SearchBar();
28+
// ```
29+
// </snippet>
30+
searchBar.text = "searchBar";
31+
return searchBar;
32+
};
33+
34+
export var testSearchBarHintColorAndroid = function () {
35+
helper.buildUIAndRunTest(_createSearchBarFunc(), function (views: Array<viewModule.View>) {
36+
var searchBar = <searchBarModule.SearchBar>views[0];
37+
38+
// TODO: create IOS test once IOS support is working
39+
if (!searchBar.android) {
40+
return;
41+
}
42+
43+
searchBar.text = "";
44+
searchBar.hint = "hint color test";
45+
46+
var expectedValue;
47+
var actualValue;
48+
49+
searchBar.textFieldHintColor = new colorModule.Color("blue");
50+
expectedValue = "#ff0000ff"; // blue
51+
actualValue = searchBarTestsNative.getNativeHintColor(searchBar).hex;
52+
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
53+
54+
searchBar.textFieldHintColor = new colorModule.Color("red");
55+
expectedValue = "#ffff0000"; // Red
56+
actualValue = searchBarTestsNative.getNativeHintColor(searchBar).hex;
57+
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
58+
});
59+
};
60+
1861
export function test_DummyTestForSnippetOnly() {
1962
// <snippet module="ui/search-bar" title="search-bar">
2063
// ### Searching

‎ui/search-bar/search-bar-common.ts‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,9 @@ export class SearchBar extends view.View implements definition.SearchBar {
99
public static clearEvent = "clear";
1010

1111
public static textFieldBackgroundColorProperty = new dependencyObservable.Property("textFieldBackgroundColor", "SearchBar", new proxy.PropertyMetadata(undefined))
12+
13+
public static textFieldHintColorProperty = new dependencyObservable.Property("textFieldHintColor", "SearchBar", new proxy.PropertyMetadata(undefined))
14+
1215
public static hintProperty = new dependencyObservable.Property("hint", "SearchBar", new proxy.PropertyMetadata(""))
1316

1417
public static textProperty = new dependencyObservable.Property(
@@ -38,4 +41,13 @@ export class SearchBar extends view.View implements definition.SearchBar {
3841
this._setValue(SearchBar.textFieldBackgroundColorProperty,
3942
value instanceof color.Color ? value : new color.Color(<any>value));
4043
}
44+
45+
get textFieldHintColor(): color.Color {
46+
return this._getValue(SearchBar.textFieldHintColorProperty);
47+
}
48+
set textFieldHintColor(value: color.Color) {
49+
this._setValue(SearchBar.textFieldHintColorProperty,
50+
value instanceof color.Color ? value : new color.Color(<any>value));
51+
}
52+
4153
}

‎ui/search-bar/search-bar.android.ts‎

Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,6 +34,20 @@ function onTextFieldBackgroundColorPropertyChanged(data: dependencyObservable.Pr
3434
// register the setNativeValue callbacks
3535
(<proxy.PropertyMetadata>common.SearchBar.textFieldBackgroundColorProperty.metadata).onSetNativeValue = onTextFieldBackgroundColorPropertyChanged;
3636

37+
function onTextFieldHintColorPropertyChanged(data: dependencyObservable.PropertyChangeData) {
38+
var bar = <SearchBar>data.object;
39+
if (!bar.android) {
40+
return;
41+
}
42+
43+
if (data.newValue instanceof color.Color) {
44+
_changeSearchViewHintColor(bar.android, (<color.Color>data.newValue).android);
45+
}
46+
}
47+
48+
// register the setNativeValue callbacks
49+
(<proxy.PropertyMetadata>common.SearchBar.textFieldHintColorProperty.metadata).onSetNativeValue = onTextFieldHintColorPropertyChanged;
50+
3751
function onHintPropertyChanged(data: dependencyObservable.PropertyChangeData) {
3852
var bar = <SearchBar>data.object;
3953
if (!bar.android) {
@@ -68,6 +82,14 @@ function _changeSearchViewBackgroundColor(bar: android.widget.SearchView, color:
6882
}
6983
}
7084

85+
function _changeSearchViewHintColor(bar: android.widget.SearchView, color: number) {
86+
var textView = getTextView(bar);
87+
88+
if (textView) {
89+
textView.setHintTextColor(color);
90+
}
91+
}
92+
7193
// merge the exports of the common file with the exports of this file
7294
declare var exports;
7395
require("utils/module-merge").merge(common, exports);
@@ -128,6 +150,9 @@ export class SearchBar extends common.SearchBar {
128150
if (this.textFieldBackgroundColor instanceof color.Color) {
129151
_changeSearchViewBackgroundColor(this._android, this.textFieldBackgroundColor.android);
130152
}
153+
if (this.textFieldHintColor instanceof color.Color) {
154+
_changeSearchViewHintColor(this._android, this.textFieldHintColor.android);
155+
}
131156
}
132157

133158
get android(): android.widget.SearchView {

‎ui/search-bar/search-bar.d.ts‎

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -56,6 +56,11 @@ declare module "ui/search-bar" {
5656
*/
5757
textFieldBackgroundColor: color.Color;
5858

59+
/**
60+
* Gets or sets the TextField Hint color of the SearchBar component.
61+
*/
62+
textFieldHintColor: color.Color;
63+
5964
/**
6065
* A basic method signature to hook an event listener (shortcut alias to the addEventListener method).
6166
* @param eventNames - String corresponding to events (e.g. "propertyChange"). Optionally could be used more events separated by `,` (e.g. "propertyChange", "change").

‎ui/search-bar/search-bar.ios.ts‎

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,20 @@ function onTextFieldBackgroundColorPropertyChanged(data: dependencyObservable.Pr
2323

2424
(<proxy.PropertyMetadata>common.SearchBar.textFieldBackgroundColorProperty.metadata).onSetNativeValue = onTextFieldBackgroundColorPropertyChanged;
2525

26+
function onTextFieldHintColorPropertyChanged(data: dependencyObservable.PropertyChangeData) {
27+
// This should be in a Try Catch in case Apple eliminates which ever method in the future;
28+
try {
29+
// TODO; convert this code into NativeScript Code
30+
/* if ([textField respondsToSelector:@selector(setAttributedPlaceholder:)]) {
31+
textField.attributedPlaceholder = [[NSAttributedString alloc] initWithString:textField.placeholder attributes:@{NSForegroundColorAttributeName: [UIColor whiteColor]}];
32+
} */
33+
} catch (Err) {
34+
// Do Nothing
35+
}
36+
}
37+
38+
(<proxy.PropertyMetadata>common.SearchBar.textFieldHintColorProperty.metadata).onSetNativeValue = onTextFieldHintColorPropertyChanged;
39+
2640
function onHintPropertyChanged(data: dependencyObservable.PropertyChangeData) {
2741
var bar = <SearchBar>data.object;
2842
if (!bar.ios) {

0 commit comments

Comments
 (0)