[TIMOB-25730] Android: Allow SearchBar "color" and "hintTextColor" properties to be set dynamically
GitHub Issue | n/a |
---|---|
Type | Improvement |
Priority | Low |
Status | Closed |
Resolution | Fixed |
Resolution Date | 2018-01-27T09:12:02.000+0000 |
Affected Version/s | n/a |
Fix Version/s | Release 7.1.0 |
Components | Android |
Labels | SearchBar, android |
Reporter | Joshua Quick |
Assignee | Joshua Quick |
Created | 2018-01-26T23:15:17.000+0000 |
Updated | 2018-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();
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.
PR (master): https://github.com/appcelerator/titanium_mobile/pull/9775
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