Titanium JIRA Archive
Titanium SDK/CLI (TIMOB)

[TIMOB-25730] Android: Allow SearchBar "color" and "hintTextColor" properties to be set dynamically

GitHub Issuen/a
TypeImprovement
PriorityLow
StatusClosed
ResolutionFixed
Resolution Date2018-01-27T09:12:02.000+0000
Affected Version/sn/a
Fix Version/sRelease 7.1.0
ComponentsAndroid
LabelsSearchBar, android
ReporterJoshua Quick
AssigneeJoshua Quick
Created2018-01-26T23:15:17.000+0000
Updated2018-03-02T00:00:43.000+0000

Description

*Summary:* Add the ability to set the text color and hint text color of a "Ti.UI.SearchBar" on Android The Android "Ti.UI.SearchBar" supports undocumented properties "color" and "hintTextColor" for changing its text field colors. However, these properties can only be set upon creation. We should allow these properties to be set dynamically. This is especially needed for parity since we're adding this feature on iOS via [TIMOB-10368]. *Note:* We plan on adding a similar feature to Android's "SearchView" in 7.1.0. See: [TIMOB-25668] *Test Code:* Once this feature has been implemented, verify that the SearchBar's hint text color is "blue" and the entered text is "red".
var window = Ti.UI.createWindow();
var searchBar = Ti.UI.createSearchBar(
{
	barColor: "white",
	hintText: "Hint Text...",
});
window.addEventListener("open", function(e) {
	var dialog = Ti.UI.createAlertDialog(
	{
		message: "Show SearchBar in...",
		buttonNames: ["Window", "ListView", "TableView"],
	});
	dialog.addEventListener("click", function(e) {
		searchBar.color = "red";
		searchBar.hintTextColor = "blue";
		switch (e.index) {
			case 0:
				searchBar.top = 0;
				searchBar.left = 0;
				searchBar.width = Ti.UI.FILL;
				searchBar.height = "50dp";
				window.add(searchBar);
				window.add(Ti.UI.createLabel({ text: "Window" }));
				break;
			case 1:
				var listView = Ti.UI.createListView(
				{
					searchView: searchBar,
					sections: [Ti.UI.createListSection({ headerTitle: "ListView" })],
					width: Ti.UI.FILL,
					height: Ti.UI.FILL,
				});
				window.add(listView);
				break;
			case 2:
				var tableView = Ti.UI.createTableView(
				{
					search: searchBar,
					data: [Ti.UI.createTableViewRow({ title: "TableView" })],
					width: Ti.UI.FILL,
					height: Ti.UI.FILL,
				});
				window.add(tableView);
				break;
		}
	});
	dialog.show();
});
window.open();

Comments

  1. Joshua Quick 2018-01-27

    It turns out this feature was already inadvertently implemented on Android. It just wasn't documented. Titanium's SearchBar on Android inherits the features supported by TextField as can be seen in the link below. Note that "TiUISearchBar" inherits from "TiUIText". https://github.com/appcelerator/titanium_mobile/blob/master/android/modules/ui/src/java/ti/modules/titanium/ui/widget/searchbar/TiUISearchBar.java#L33 However, these 2 properties cannot be set dynamically. They can only be set upon creation. I'm changing this JIRA case to reflect this.
  2. Joshua Quick 2018-01-27

    PR (master): https://github.com/appcelerator/titanium_mobile/pull/9775
  3. Lokesh Choudhary 2018-03-02

    Verified the fix in SDK 7.1.0.v20180301114750 & 7.2.0.v20180301081409. Closing. Studio Ver: 5.0.0.201712081732 OS Ver: 10.13.2 Xcode Ver: Xcode 9.2 Appc NPM: 4.2.12 Appc CLI: 7.0.2 Daemon Ver: 1.0.1 Ti CLI Ver: 5.0.14 Alloy Ver: 1.11.0 Node Ver: 8.9.1 NPM Ver: 5.5.1 Java Ver: 1.8.0_101 Devices: ⇨ google Nexus 6P — Android 8.0.0 ⇨ google Nexus 5 — Android 6.0.1

JSON Source