diff --git a/apps/TelerikNEXT/main-page.xml b/apps/TelerikNEXT/main-page.xml index 46498d55c..609b2f9cf 100644 --- a/apps/TelerikNEXT/main-page.xml +++ b/apps/TelerikNEXT/main-page.xml @@ -43,7 +43,7 @@ - + diff --git a/ui/search-bar/search-bar-common.ts b/ui/search-bar/search-bar-common.ts index fcb1f4404..ea1ab350d 100644 --- a/ui/search-bar/search-bar-common.ts +++ b/ui/search-bar/search-bar-common.ts @@ -11,6 +11,7 @@ export module knownEvents { export class SearchBar extends view.View implements definition.SearchBar { public static textFieldBackgroundColorProperty = new dependencyObservable.Property("textFieldBackgroundColor", "SearchBar", new proxy.PropertyMetadata(undefined)) + public static hintProperty = new dependencyObservable.Property("hint", "SearchBar", new proxy.PropertyMetadata("")) public static textProperty = new dependencyObservable.Property( "text", @@ -25,6 +26,13 @@ export class SearchBar extends view.View implements definition.SearchBar { this._setValue(SearchBar.textProperty, value); } + get hint(): string { + return this._getValue(SearchBar.hintProperty); + } + set hint(value: string) { + this._setValue(SearchBar.hintProperty, value); + } + get textFieldBackgroundColor(): color.Color { return this._getValue(SearchBar.textFieldBackgroundColorProperty); } diff --git a/ui/search-bar/search-bar.android.ts b/ui/search-bar/search-bar.android.ts index 3508ddb03..0e358c953 100644 --- a/ui/search-bar/search-bar.android.ts +++ b/ui/search-bar/search-bar.android.ts @@ -2,6 +2,7 @@ import dependencyObservable = require("ui/core/dependency-observable"); import proxy = require("ui/core/proxy"); import color = require("color"); +import types = require("utils/types"); var SEARCHTEXT = "searchText"; var QUERY = "query"; @@ -33,10 +34,38 @@ function onTextFieldBackgroundColorPropertyChanged(data: dependencyObservable.Pr // register the setNativeValue callbacks (common.SearchBar.textFieldBackgroundColorProperty.metadata).onSetNativeValue = onTextFieldBackgroundColorPropertyChanged; +function onHintPropertyChanged(data: dependencyObservable.PropertyChangeData) { + var bar = data.object; + if (!bar.android) { + return; + } + + var newValue = data.newValue; + + if (types.isString(newValue)) { + bar.android.setQueryHint(newValue); + } +} + +(common.SearchBar.hintProperty.metadata).onSetNativeValue = onHintPropertyChanged; + +function getTextView(bar: android.widget.SearchView): android.widget.TextView { + if (bar) { + var id = bar.getContext().getResources().getIdentifier("android:id/search_src_text", null, null); + if (id) { + return bar.findViewById(id); + } + } + + return undefined; +} + function _changeSearchViewBackgroundColor(bar: android.widget.SearchView, color: number) { - var id = bar.getContext().getResources().getIdentifier("android:id/search_src_text", null, null); - var textView = bar.findViewById(id); - textView.setBackgroundColor(color); + var textView = getTextView(bar); + + if (textView) { + textView.setBackgroundColor(color); + } } // merge the exports of the common file with the exports of this file diff --git a/ui/search-bar/search-bar.d.ts b/ui/search-bar/search-bar.d.ts index 350b8bbbf..faebfe103 100644 --- a/ui/search-bar/search-bar.d.ts +++ b/ui/search-bar/search-bar.d.ts @@ -51,6 +51,11 @@ declare module "ui/search-bar" { */ text: string; + /** + * Gets or sets the text of the search bar text field hint/placeholder. + */ + hint: string; + /** * Gets or sets the TextField background color of the SearchBar component. */ diff --git a/ui/search-bar/search-bar.ios.ts b/ui/search-bar/search-bar.ios.ts index 451cf6752..336f11aff 100644 --- a/ui/search-bar/search-bar.ios.ts +++ b/ui/search-bar/search-bar.ios.ts @@ -2,25 +2,50 @@ import dependencyObservable = require("ui/core/dependency-observable"); import proxy = require("ui/core/proxy"); import color = require("color"); +import types = require("utils/types"); function onTextPropertyChanged(data: dependencyObservable.PropertyChangeData) { var bar = data.object; bar.ios.text = data.newValue; } -// register the setNativeValue callbacks (common.SearchBar.textProperty.metadata).onSetNativeValue = onTextPropertyChanged; function onTextFieldBackgroundColorPropertyChanged(data: dependencyObservable.PropertyChangeData) { var bar = data.object; if (data.newValue instanceof color.Color) { - (bar.ios.valueForKey("_searchField")).backgroundColor = data.newValue.ios; + var tf = getUITextField(bar.ios); + if (tf) { + tf.backgroundColor = data.newValue.ios; + } } } -// register the setNativeValue callbacks (common.SearchBar.textFieldBackgroundColorProperty.metadata).onSetNativeValue = onTextFieldBackgroundColorPropertyChanged; +function onHintPropertyChanged(data: dependencyObservable.PropertyChangeData) { + var bar = data.object; + if (!bar.ios) { + return; + } + + var newValue = data.newValue; + + if (types.isString(newValue)) { + bar.ios.placeholder = newValue; + } +} + +(common.SearchBar.hintProperty.metadata).onSetNativeValue = onHintPropertyChanged; + +function getUITextField(bar: UISearchBar): UITextField { + if (bar) { + return bar.valueForKey("_searchField"); + } + + return undefined; +} + // merge the exports of the common file with the exports of this file declare var exports; require("utils/module-merge").merge(common, exports); @@ -69,7 +94,7 @@ export class SearchBar extends common.SearchBar { constructor() { super(); this._ios = new UISearchBar(); - + this._delegate = UISearchBarDelegateImpl.new().initWithOwner(this); this._ios.delegate = this._delegate; }