Textfield styling

[beppo-ivel]

I have several questions with respect to styling text field for android:

1. How to change the cursor color?
2. How to hide the underscore of android text fields or set the underscore in the same color as background to make it invisible?
3. How to set the top- and bottom margin between elements. For example if you add an element then you have to re-define the the top and bottom values of the elements. Maybe that could be avoid by using margin properties which organizes the space between elements?
4. Is it possible to create a border with small description text as you can see here?

[m1ga]

1: guess you have to use a Android theme for that. Never done that but if you search for it you'll find some examples. This might be a starting point: https://www.11zon.com/zon/android/how-to-change-android-edittext-cursor-color.php (its not a theme but the property name might be the same)
2: https://titaniumsdk.com/api/titanium/ui/textfield.html#borderstyle
3: use a class with the top/bottom properties? There was a discussion about some kind of marginbut it is not implemented.
4: https://titaniumsdk.com/api/titanium/ui/textfield.html#hinttype

I recommend checking out kitchensink from https://github.com/appcelerator/kitchensink-v2/ especially the screenshots in tidev/kitchensink-v2#56

[beppo-ivel]

You can build that yourself with labels, views ....

Does the same applies for title of a tab group (actionbar?)? Because I'm not able to change the color of tab group title via *.tss. And I don't understand why I can define a title for each window but when I want to have different titles in each tab I have to set a new tab group title via (or is there also a other possibility?):

$.tabGroup.addEventListener('focus', function(e) {
	        let title = $.tabGroup.activeTab.window.title;
        	$.tabGroup.activity.actionBar.title = title;
	});

@jquick-axway

You're really complaining about Google's UI framework, not Titanium.

Was not my intention to complaining the titanium framework it was only gap of my understanding.

[m1ga]

styling: yes check e.g. https://stackoverflow.com/a/5881739/5193915 (first google hit, didn't want to search longer or in my files 😄 )

[m1ga]

not sure if I got your title question right but:

var window1 = Titanium.UI.createWindow({
	title: 'Tab 1'
});

var window2 = Titanium.UI.createWindow({
	title: 'Tab 2'
});

var window3 = Titanium.UI.createWindow({
	title: 'Tab 3'
});

var tab1 = Ti.UI.createTab({
	title: 'Tab 1',
	window: window1
});

var tab2 = Ti.UI.createTab({
	title: 'Tab 2',
	window: window2
});

var tab3 = Ti.UI.createTab({
	title: 'Tab 3',
	window: window3
});

tab1.addEventListener('selected', function() {
	tabGroup.title = 'Tab 1';
});

tab2.addEventListener('selected', function() {
	tabGroup.title = 'Tab 2';
});

tab3.addEventListener('selected', function() {
	tabGroup.title = 'Tab 3';
});

var tabGroup = Titanium.UI.createTabGroup({
	tabs: [tab1, tab2, tab3],
	swipeable: true,
	exitOnClose: false,
	style: Titanium.UI.Android.TABS_STYLE_BOTTOM_NAVIGATION,
	shiftMode: false
});

tabGroup.open();

changes the tabgroups title

[beppo-ivel]

first google hit,...

ok ok I know but I was confused because I was able to change the color of the actionbar via the window style property barColor but was not able to set the color of the object in *.tss or neither via $.tabGroup.activity.actionBar.color/titleColor. So it's confusing in the beginning where to find the right control.

[m1ga]

yes, can be confusing if you start with app development. Just remember: when it's not in the documentation as a property (and Android only) you might want to search for change component-xyz in theme android. At least that's how I do it 🤣

[jquick-axway]

All the subfolders under your Titanium project's ./platform/android/res folder does what Google documents here...
https://developer.android.com/guide/topics/resources/providing-resources

Follow the kitchensink-v2 example links I posted above. In that example, the app uses a "red" theme, which includes the text field border theme. It's simple. Just try it.

There's also a guide on how to set up themes below.
https://titaniumsdk.com/guide/Titanium_SDK/Titanium_SDK_How-tos/User_Interface_Deep_Dives/Android_UI_Components_and_Conventions/Android_Themes.html