feat(android): listView padding and clipping

[m1ga]

Allows the user to add a padding e.g. top/bottom and disable the clipping so it will move outside of the top.

Example:
Here the listview will start behind the camera/statusbar because it is a no_limits window. With the padding it is pushed down but when you scroll it will still scoll up all the way and not just cut off below the camera:

const win = Ti.UI.createWindow({
	extendSafeArea: true,
	theme: "Theme.AppCompat.NoTitleBar",
	windowFlags: Ti.UI.Android.FLAG_LAYOUT_NO_LIMITS,
});
var listView = Ti.UI.createListView({
	clipViews: false,
	padding: {
		top: 100,
		left: 0,
		right: 0,
		bottom: 100
	}
});
var sections = [];

var fruitDataSet = [
    {properties: { title: 'Apple'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
    {properties: { title: 'Banana'}},
];
var fruitSection = Ti.UI.createListSection({ headerTitle: 'Fruits', items: fruitDataSet});
sections.push(fruitSection);

var vegDataSet = [
    {properties: { title: 'Carrots'}},
    {properties: { title: 'Potatoes'}},
];
var vegSection = Ti.UI.createListSection({ headerTitle: 'Vegetables', items: vegDataSet});
sections.push(vegSection);

listView.sections = sections;
win.add(listView);
win.open();

var fishDataSet = [
    {properties: { title: 'Cod'}},
    {properties: { title: 'Haddock'}},
];
var fishSection = Ti.UI.createListSection({ headerTitle: 'Fish', items: fishDataSet});
listView.appendSection(fishSection);

Bildschirmaufnahme_20250523_105546.webm

[prashantsaini1]

iOS itself handles it using the window safe-area paddings. It'd be cool if Titanium does it for Android also when extendSafeArea: true. This way we will have a parity and probably won't need to manually set paddings for Android in that case.

[m1ga]

I think this is just a workaround for the real edge-to-edge design as we need to implement that for it (had no success yet).
After seeing how edge-to-edge looks like I think we won't need this one once we have edge-to-edge

[prashantsaini1]

@m1ga I believe a better approach would be to add support for padding in all Titanium views (in base TiUIView class), with the SDK further handles it accordingly for scrollable UI like ListView/ScrollView/TableView. Though it's possible even now by using the top/left/right/bottom props or sometimes via an extra view, but having it controlled via the padding property is much flexible. (low prio though)