diff --git a/apps/toolbox/src/main.ts b/apps/toolbox/src/main.ts
index a4c5c529a..4e535ec57 100644
--- a/apps/toolbox/src/main.ts
+++ b/apps/toolbox/src/main.ts
@@ -1,3 +1,4 @@
-import { Application } from '@nativescript/core';
-
+import { Application, Trace } from '@nativescript/core';
+Trace.enable();
+Trace.addCategories(Trace.categories.Debug);
 Application.run({ moduleName: 'app-root' });
diff --git a/apps/toolbox/src/pages/list-page-model.ts b/apps/toolbox/src/pages/list-page-model.ts
index 564a67d24..aa7d9646b 100644
--- a/apps/toolbox/src/pages/list-page-model.ts
+++ b/apps/toolbox/src/pages/list-page-model.ts
@@ -1,21 +1,1377 @@
-import { Observable, Dialogs, DialogStrings } from '@nativescript/core';
+import { Observable, Dialogs, DialogStrings, View, EventData } from '@nativescript/core';
 
 export class ListPageModel extends Observable {
 	components: Array<any> = [
-		{ name: 'Button', iconText: 'p' },
-		{ name: 'Image', iconText: 'q' },
-		{ name: 'Label', iconText: 't' },
-		{ name: 'Switch', iconText: 'z' },
-		{ name: 'Slider', iconText: 'v' },
-		{ name: 'TextField', iconText: 'x' },
-		{ name: 'TextView', iconText: 'w' },
-		{ name: 'DatePicker', iconText: 'A' },
-		{ name: 'Chart', iconText: 'B' },
-		{ name: 'ListView', iconText: 'u' },
-		{ name: 'Accelerometer', iconText: 'E' },
-		{ name: 'Location', iconText: 'D' },
-		{ name: 'Camera', iconText: String.fromCharCode(parseInt('e034', 16)) },
-		{ name: 'ImagePicker', iconText: 'q' },
+		{
+			title: 'A',
+			items: [
+				{
+					name: 'Afghanistan',
+					code: '(AF)',
+					flag: '🇦🇫',
+				},
+				{
+					name: 'Albania',
+					code: '(AL)',
+					flag: '🇦🇱',
+				},
+				{
+					name: 'Algeria',
+					code: '(DZ)',
+					flag: '🇩🇿',
+				},
+				{
+					name: 'American Samoa',
+					code: '(AS)',
+					flag: '🇦🇸',
+				},
+				{
+					name: 'Andorra',
+					code: '(AD)',
+					flag: '🇦🇩',
+				},
+				{
+					name: 'Angola',
+					code: '(AO)',
+					flag: '🇦🇴',
+				},
+				{
+					name: 'Anguilla',
+					code: '(AI)',
+					flag: '🇦🇮',
+				},
+				{
+					name: 'Antarctica',
+					code: '(AQ)',
+					flag: '🇦🇶',
+				},
+				{
+					name: 'Antigua and Barbuda',
+					code: '(AG)',
+					flag: '🇦🇬',
+				},
+				{
+					name: 'Argentina',
+					code: '(AR)',
+					flag: '🇦🇷',
+				},
+				{
+					name: 'Armenia',
+					code: '(AM)',
+					flag: '🇦🇲',
+				},
+				{
+					name: 'Aruba',
+					code: '(AW)',
+					flag: '🇦🇼',
+				},
+				{
+					name: 'Australia',
+					code: '(AU)',
+					flag: '🇦🇺',
+				},
+				{
+					name: 'Austria',
+					code: '(AT)',
+					flag: '🇦🇹',
+				},
+				{
+					name: 'Azerbaijan',
+					code: '(AZ)',
+					flag: '🇦🇿',
+				},
+			],
+		},
+		{
+			title: 'B',
+			items: [
+				{
+					name: 'Bahamas',
+					code: '(BS)',
+					flag: '🇧🇸',
+				},
+				{
+					name: 'Bahrain',
+					code: '(BH)',
+					flag: '🇧🇭',
+				},
+				{
+					name: 'Bangladesh',
+					code: '(BD)',
+					flag: '🇧🇩',
+				},
+				{
+					name: 'Barbados',
+					code: '(BB)',
+					flag: '🇧🇧',
+				},
+				{
+					name: 'Belarus',
+					code: '(BY)',
+					flag: '🇧🇾',
+				},
+				{
+					name: 'Belgium',
+					code: '(BE)',
+					flag: '🇧🇪',
+				},
+				{
+					name: 'Belize',
+					code: '(BZ)',
+					flag: '🇧🇿',
+				},
+				{
+					name: 'Benin',
+					code: '(BJ)',
+					flag: '🇧🇯',
+				},
+				{
+					name: 'Bermuda',
+					code: '(BM)',
+					flag: '🇧🇲',
+				},
+				{
+					name: 'Bhutan',
+					code: '(BT)',
+					flag: '🇧🇹',
+				},
+				{
+					name: 'Bolivia',
+					code: '(BO)',
+					flag: '🇧🇴',
+				},
+				{
+					name: 'Bonaire, Sint Eustatius and Saba',
+					code: '(BQ)',
+					flag: '🇧🇶',
+				},
+				{
+					name: 'Bosnia and Herzegovina',
+					code: '(BA)',
+					flag: '🇧🇦',
+				},
+				{
+					name: 'Botswana',
+					code: '(BW)',
+					flag: '🇧🇼',
+				},
+				{
+					name: 'Bouvet Island',
+					code: '(BV)',
+					flag: '🇧🇻',
+				},
+				{
+					name: 'Brazil',
+					code: '(BR)',
+					flag: '🇧🇷',
+				},
+				{
+					name: 'British Indian Ocean Territory',
+					code: '(IO)',
+					flag: '🇮🇴',
+				},
+				{
+					name: 'Brunei Darussalam',
+					code: '(BN)',
+					flag: '🇧🇳',
+				},
+				{
+					name: 'Bulgaria',
+					code: '(BG)',
+					flag: '🇧🇬',
+				},
+				{
+					name: 'Burkina Faso',
+					code: '(BF)',
+					flag: '🇧🇫',
+				},
+				{
+					name: 'Burundi',
+					code: '(BI)',
+					flag: '🇧🇮',
+				},
+			],
+		},
+		{
+			title: 'C',
+			items: [
+				{
+					name: 'Cambodia',
+					code: '(KH)',
+					flag: '🇰🇭',
+				},
+				{
+					name: 'Cameroon',
+					code: '(CM)',
+					flag: '🇨🇲',
+				},
+				{
+					name: 'Canada',
+					code: '(CA)',
+					flag: '🇨🇦',
+				},
+				{
+					name: 'Cape Verde',
+					code: '(CV)',
+					flag: '🇨🇻',
+				},
+				{
+					name: 'Cayman Islands',
+					code: '(KY)',
+					flag: '🇰🇾',
+				},
+				{
+					name: 'Central African Republic',
+					code: '(CF)',
+					flag: '🇨🇫',
+				},
+				{
+					name: 'Chad',
+					code: '(TD)',
+					flag: '🇹🇩',
+				},
+				{
+					name: 'Chile',
+					code: '(CL)',
+					flag: '🇨🇱',
+				},
+				{
+					name: 'Christmas Island',
+					code: '(CX)',
+					flag: '🇨🇽',
+				},
+				{
+					name: 'Cocos (Keeling) Islands',
+					code: '(CC)',
+					flag: '🇨🇨',
+				},
+				{
+					name: 'Colombia',
+					code: '(CO)',
+					flag: '🇨🇴',
+				},
+				{
+					name: 'Comoros',
+					code: '(KM)',
+					flag: '🇰🇲',
+				},
+				{
+					name: 'Cook Islands',
+					code: '(CK)',
+					flag: '🇨🇰',
+				},
+				{
+					name: 'Costa Rica',
+					code: '(CR)',
+					flag: '🇨🇷',
+				},
+				{
+					name: "Cote d'Ivoire",
+					code: '(CI)',
+					flag: '🇨🇮',
+				},
+				{
+					name: 'Croatia',
+					code: '(HR)',
+					flag: '🇭🇷',
+				},
+				{
+					name: 'Cuba',
+					code: '(CU)',
+					flag: '🇨🇺',
+				},
+				{
+					name: 'Curaçao',
+					code: '(CW)',
+					flag: '🇨🇼',
+				},
+				{
+					name: 'Cyprus',
+					code: '(CY)',
+					flag: '🇨🇾',
+				},
+				{
+					name: 'Czech Republic',
+					code: '(CZ)',
+					flag: '🇨🇿',
+				},
+			],
+		},
+		{
+			title: 'D',
+			items: [
+				{
+					name: 'Democratic Republic of the Congo',
+					code: '(CD)',
+					flag: '🇨🇩',
+				},
+				{
+					name: 'Denmark',
+					code: '(DK)',
+					flag: '🇩🇰',
+				},
+				{
+					name: 'Djibouti',
+					code: '(DJ)',
+					flag: '🇩🇯',
+				},
+				{
+					name: 'Dominica',
+					code: '(DM)',
+					flag: '🇩🇲',
+				},
+				{
+					name: 'Dominican Republic',
+					code: '(DO)',
+					flag: '🇩🇴',
+				},
+			],
+		},
+		{
+			title: 'E',
+			items: [
+				{
+					name: 'Ecuador',
+					code: '(EC)',
+					flag: '🇪🇨',
+				},
+				{
+					name: 'Egypt',
+					code: '(EG)',
+					flag: '🇪🇬',
+				},
+				{
+					name: 'El Salvador',
+					code: '(SV)',
+					flag: '🇸🇻',
+				},
+				{
+					name: 'Equatorial Guinea',
+					code: '(GQ)',
+					flag: '🇬🇶',
+				},
+				{
+					name: 'Eritrea',
+					code: '(ER)',
+					flag: '🇪🇷',
+				},
+				{
+					name: 'Estonia',
+					code: '(EE)',
+					flag: '🇪🇪',
+				},
+				{
+					name: 'Eswatini',
+					code: '(SZ)',
+					flag: '🇸🇿',
+				},
+				{
+					name: 'Ethiopia',
+					code: '(ET)',
+					flag: '🇪🇹',
+				},
+			],
+		},
+		{
+			title: 'F',
+			items: [
+				{
+					name: 'Falkland Islands (Malvinas)',
+					code: '(FK)',
+					flag: '🇫🇰',
+				},
+				{
+					name: 'Faroe Islands',
+					code: '(FO)',
+					flag: '🇫🇴',
+				},
+				{
+					name: 'Fiji',
+					code: '(FJ)',
+					flag: '🇫🇯',
+				},
+				{
+					name: 'Finland',
+					code: '(FI)',
+					flag: '🇫🇮',
+				},
+				{
+					name: 'France',
+					code: '(FR)',
+					flag: '🇫🇷',
+				},
+				{
+					name: 'French Guiana',
+					code: '(GF)',
+					flag: '🇬🇫',
+				},
+				{
+					name: 'French Polynesia',
+					code: '(PF)',
+					flag: '🇵🇫',
+				},
+				{
+					name: 'French Southern Territories',
+					code: '(TF)',
+					flag: '🇹🇫',
+				},
+			],
+		},
+		{
+			title: 'G',
+			items: [
+				{
+					name: 'Gabon',
+					code: '(GA)',
+					flag: '🇬🇦',
+				},
+				{
+					name: 'Georgia',
+					code: '(GE)',
+					flag: '🇬🇪',
+				},
+				{
+					name: 'Germany',
+					code: '(DE)',
+					flag: '🇩🇪',
+				},
+				{
+					name: 'Ghana',
+					code: '(GH)',
+					flag: '🇬🇭',
+				},
+				{
+					name: 'Gibraltar',
+					code: '(GI)',
+					flag: '🇬🇮',
+				},
+				{
+					name: 'Greece',
+					code: '(GR)',
+					flag: '🇬🇷',
+				},
+				{
+					name: 'Greenland',
+					code: '(GL)',
+					flag: '🇬🇱',
+				},
+				{
+					name: 'Grenada',
+					code: '(GD)',
+					flag: '🇬🇩',
+				},
+				{
+					name: 'Guadeloupe',
+					code: '(GP)',
+					flag: '🇬🇵',
+				},
+				{
+					name: 'Guam',
+					code: '(GU)',
+					flag: '🇬🇺',
+				},
+				{
+					name: 'Guatemala',
+					code: '(GT)',
+					flag: '🇬🇹',
+				},
+				{
+					name: 'Guernsey',
+					code: '(GG)',
+					flag: '🇬🇬',
+				},
+				{
+					name: 'Guinea',
+					code: '(GN)',
+					flag: '🇬🇳',
+				},
+				{
+					name: 'Guinea-Bissau',
+					code: '(GW)',
+					flag: '🇬🇼',
+				},
+				{
+					name: 'Guyana',
+					code: '(GY)',
+					flag: '🇬🇾',
+				},
+			],
+		},
+		{
+			title: 'H',
+			items: [
+				{
+					name: 'Haiti',
+					code: '(HT)',
+					flag: '🇭🇹',
+				},
+				{
+					name: 'Heard Island and McDonald Islands',
+					code: '(HM)',
+					flag: '🇭🇲',
+				},
+				{
+					name: 'Holy See (Vatican City State)',
+					code: '(VA)',
+					flag: '🇻🇦',
+				},
+				{
+					name: 'Honduras',
+					code: '(HN)',
+					flag: '🇭🇳',
+				},
+				{
+					name: 'Hong Kong',
+					code: '(HK)',
+					flag: '🇭🇰',
+				},
+				{
+					name: 'Hungary',
+					code: '(HU)',
+					flag: '🇭🇺',
+				},
+			],
+		},
+		{
+			title: 'I',
+			items: [
+				{
+					name: 'Iceland',
+					code: '(IS)',
+					flag: '🇮🇸',
+				},
+				{
+					name: 'India',
+					code: '(IN)',
+					flag: '🇮🇳',
+				},
+				{
+					name: 'Indonesia',
+					code: '(ID)',
+					flag: '🇮🇩',
+				},
+				{
+					name: 'Iraq',
+					code: '(IQ)',
+					flag: '🇮🇶',
+				},
+				{
+					name: 'Ireland',
+					code: '(IE)',
+					flag: '🇮🇪',
+				},
+				{
+					name: 'Islamic Republic of Iran',
+					code: '(IR)',
+					flag: '🇮🇷',
+				},
+				{
+					name: 'Isle of Man',
+					code: '(IM)',
+					flag: '🇮🇲',
+				},
+				{
+					name: 'Israel',
+					code: '(IL)',
+					flag: '🇮🇱',
+				},
+				{
+					name: 'Italy',
+					code: '(IT)',
+					flag: '🇮🇹',
+				},
+			],
+		},
+		{
+			title: 'J',
+			items: [
+				{
+					name: 'Jamaica',
+					code: '(JM)',
+					flag: '🇯🇲',
+				},
+				{
+					name: 'Japan',
+					code: '(JP)',
+					flag: '🇯🇵',
+				},
+				{
+					name: 'Jersey',
+					code: '(JE)',
+					flag: '🇯🇪',
+				},
+				{
+					name: 'Jordan',
+					code: '(JO)',
+					flag: '🇯🇴',
+				},
+			],
+		},
+		{
+			title: 'K',
+			items: [
+				{
+					name: 'Kazakhstan',
+					code: '(KZ)',
+					flag: '🇰🇿',
+				},
+				{
+					name: 'Kenya',
+					code: '(KE)',
+					flag: '🇰🇪',
+				},
+				{
+					name: 'Kiribati',
+					code: '(KI)',
+					flag: '🇰🇮',
+				},
+				{
+					name: 'Kosovo',
+					code: '(XK)',
+					flag: '🇽🇰',
+				},
+				{
+					name: 'Kuwait',
+					code: '(KW)',
+					flag: '🇰🇼',
+				},
+				{
+					name: 'Kyrgyzstan',
+					code: '(KG)',
+					flag: '🇰🇬',
+				},
+			],
+		},
+		{
+			title: 'L',
+			items: [
+				{
+					name: "Lao People's Democratic Republic",
+					code: '(LA)',
+					flag: '🇱🇦',
+				},
+				{
+					name: 'Latvia',
+					code: '(LV)',
+					flag: '🇱🇻',
+				},
+				{
+					name: 'Lebanon',
+					code: '(LB)',
+					flag: '🇱🇧',
+				},
+				{
+					name: 'Lesotho',
+					code: '(LS)',
+					flag: '🇱🇸',
+				},
+				{
+					name: 'Liberia',
+					code: '(LR)',
+					flag: '🇱🇷',
+				},
+				{
+					name: 'Libya',
+					code: '(LY)',
+					flag: '🇱🇾',
+				},
+				{
+					name: 'Liechtenstein',
+					code: '(LI)',
+					flag: '🇱🇮',
+				},
+				{
+					name: 'Lithuania',
+					code: '(LT)',
+					flag: '🇱🇹',
+				},
+				{
+					name: 'Luxembourg',
+					code: '(LU)',
+					flag: '🇱🇺',
+				},
+			],
+		},
+		{
+			title: 'M',
+			items: [
+				{
+					name: 'Macao',
+					code: '(MO)',
+					flag: '🇲🇴',
+				},
+				{
+					name: 'Madagascar',
+					code: '(MG)',
+					flag: '🇲🇬',
+				},
+				{
+					name: 'Malawi',
+					code: '(MW)',
+					flag: '🇲🇼',
+				},
+				{
+					name: 'Malaysia',
+					code: '(MY)',
+					flag: '🇲🇾',
+				},
+				{
+					name: 'Maldives',
+					code: '(MV)',
+					flag: '🇲🇻',
+				},
+				{
+					name: 'Mali',
+					code: '(ML)',
+					flag: '🇲🇱',
+				},
+				{
+					name: 'Malta',
+					code: '(MT)',
+					flag: '🇲🇹',
+				},
+				{
+					name: 'Marshall Islands',
+					code: '(MH)',
+					flag: '🇲🇭',
+				},
+				{
+					name: 'Martinique',
+					code: '(MQ)',
+					flag: '🇲🇶',
+				},
+				{
+					name: 'Mauritania',
+					code: '(MR)',
+					flag: '🇲🇷',
+				},
+				{
+					name: 'Mauritius',
+					code: '(MU)',
+					flag: '🇲🇺',
+				},
+				{
+					name: 'Mayotte',
+					code: '(YT)',
+					flag: '🇾🇹',
+				},
+				{
+					name: 'Mexico',
+					code: '(MX)',
+					flag: '🇲🇽',
+				},
+				{
+					name: 'Micronesia, Federated States of',
+					code: '(FM)',
+					flag: '🇫🇲',
+				},
+				{
+					name: 'Moldova, Republic of',
+					code: '(MD)',
+					flag: '🇲🇩',
+				},
+				{
+					name: 'Monaco',
+					code: '(MC)',
+					flag: '🇲🇨',
+				},
+				{
+					name: 'Mongolia',
+					code: '(MN)',
+					flag: '🇲🇳',
+				},
+				{
+					name: 'Montenegro',
+					code: '(ME)',
+					flag: '🇲🇪',
+				},
+				{
+					name: 'Montserrat',
+					code: '(MS)',
+					flag: '🇲🇸',
+				},
+				{
+					name: 'Morocco',
+					code: '(MA)',
+					flag: '🇲🇦',
+				},
+				{
+					name: 'Mozambique',
+					code: '(MZ)',
+					flag: '🇲🇿',
+				},
+				{
+					name: 'Myanmar',
+					code: '(MM)',
+					flag: '🇲🇲',
+				},
+			],
+		},
+		{
+			title: 'N',
+			items: [
+				{
+					name: 'Namibia',
+					code: '(NA)',
+					flag: '🇳🇦',
+				},
+				{
+					name: 'Nauru',
+					code: '(NR)',
+					flag: '🇳🇷',
+				},
+				{
+					name: 'Nepal',
+					code: '(NP)',
+					flag: '🇳🇵',
+				},
+				{
+					name: 'Netherlands',
+					code: '(NL)',
+					flag: '🇳🇱',
+				},
+				{
+					name: 'New Caledonia',
+					code: '(NC)',
+					flag: '🇳🇨',
+				},
+				{
+					name: 'New Zealand',
+					code: '(NZ)',
+					flag: '🇳🇿',
+				},
+				{
+					name: 'Nicaragua',
+					code: '(NI)',
+					flag: '🇳🇮',
+				},
+				{
+					name: 'Niger',
+					code: '(NE)',
+					flag: '🇳🇪',
+				},
+				{
+					name: 'Nigeria',
+					code: '(NG)',
+					flag: '🇳🇬',
+				},
+				{
+					name: 'Niue',
+					code: '(NU)',
+					flag: '🇳🇺',
+				},
+				{
+					name: 'Norfolk Island',
+					code: '(NF)',
+					flag: '🇳🇫',
+				},
+				{
+					name: 'North Korea',
+					code: '(KP)',
+					flag: '🇰🇵',
+				},
+				{
+					name: 'Northern Mariana Islands',
+					code: '(MP)',
+					flag: '🇲🇵',
+				},
+				{
+					name: 'Norway',
+					code: '(NO)',
+					flag: '🇳🇴',
+				},
+			],
+		},
+		{
+			title: 'O',
+			items: [
+				{
+					name: 'Oman',
+					code: '(OM)',
+					flag: '🇴🇲',
+				},
+			],
+		},
+		{
+			title: 'P',
+			items: [
+				{
+					name: 'Pakistan',
+					code: '(PK)',
+					flag: '🇵🇰',
+				},
+				{
+					name: 'Palau',
+					code: '(PW)',
+					flag: '🇵🇼',
+				},
+				{
+					name: 'Panama',
+					code: '(PA)',
+					flag: '🇵🇦',
+				},
+				{
+					name: 'Papua New Guinea',
+					code: '(PG)',
+					flag: '🇵🇬',
+				},
+				{
+					name: 'Paraguay',
+					code: '(PY)',
+					flag: '🇵🇾',
+				},
+				{
+					name: "People's Republic of China",
+					code: '(CN)',
+					flag: '🇨🇳',
+				},
+				{
+					name: 'Peru',
+					code: '(PE)',
+					flag: '🇵🇪',
+				},
+				{
+					name: 'Philippines',
+					code: '(PH)',
+					flag: '🇵🇭',
+				},
+				{
+					name: 'Pitcairn',
+					code: '(PN)',
+					flag: '🇵🇳',
+				},
+				{
+					name: 'Poland',
+					code: '(PL)',
+					flag: '🇵🇱',
+				},
+				{
+					name: 'Portugal',
+					code: '(PT)',
+					flag: '🇵🇹',
+				},
+				{
+					name: 'Puerto Rico',
+					code: '(PR)',
+					flag: '🇵🇷',
+				},
+			],
+		},
+		{
+			title: 'Q',
+			items: [
+				{
+					name: 'Qatar',
+					code: '(QA)',
+					flag: '🇶🇦',
+				},
+			],
+		},
+		{
+			title: 'R',
+			items: [
+				{
+					name: 'Republic of the Congo',
+					code: '(CG)',
+					flag: '🇨🇬',
+				},
+				{
+					name: 'Republic of The Gambia',
+					code: '(GM)',
+					flag: '🇬🇲',
+				},
+				{
+					name: 'Reunion',
+					code: '(RE)',
+					flag: '🇷🇪',
+				},
+				{
+					name: 'Romania',
+					code: '(RO)',
+					flag: '🇷🇴',
+				},
+				{
+					name: 'Russian Federation',
+					code: '(RU)',
+					flag: '🇷🇺',
+				},
+				{
+					name: 'Rwanda',
+					code: '(RW)',
+					flag: '🇷🇼',
+				},
+			],
+		},
+		{
+			title: 'S',
+			items: [
+				{
+					name: 'Saint Barthélemy',
+					code: '(BL)',
+					flag: '🇧🇱',
+				},
+				{
+					name: 'Saint Helena',
+					code: '(SH)',
+					flag: '🇸🇭',
+				},
+				{
+					name: 'Saint Kitts and Nevis',
+					code: '(KN)',
+					flag: '🇰🇳',
+				},
+				{
+					name: 'Saint Lucia',
+					code: '(LC)',
+					flag: '🇱🇨',
+				},
+				{
+					name: 'Saint Martin (French part)',
+					code: '(MF)',
+					flag: '🇲🇫',
+				},
+				{
+					name: 'Saint Pierre and Miquelon',
+					code: '(PM)',
+					flag: '🇵🇲',
+				},
+				{
+					name: 'Saint Vincent and the Grenadines',
+					code: '(VC)',
+					flag: '🇻🇨',
+				},
+				{
+					name: 'Samoa',
+					code: '(WS)',
+					flag: '🇼🇸',
+				},
+				{
+					name: 'San Marino',
+					code: '(SM)',
+					flag: '🇸🇲',
+				},
+				{
+					name: 'Sao Tome and Principe',
+					code: '(ST)',
+					flag: '🇸🇹',
+				},
+				{
+					name: 'Saudi Arabia',
+					code: '(SA)',
+					flag: '🇸🇦',
+				},
+				{
+					name: 'Senegal',
+					code: '(SN)',
+					flag: '🇸🇳',
+				},
+				{
+					name: 'Serbia',
+					code: '(RS)',
+					flag: '🇷🇸',
+				},
+				{
+					name: 'Seychelles',
+					code: '(SC)',
+					flag: '🇸🇨',
+				},
+				{
+					name: 'Sierra Leone',
+					code: '(SL)',
+					flag: '🇸🇱',
+				},
+				{
+					name: 'Singapore',
+					code: '(SG)',
+					flag: '🇸🇬',
+				},
+				{
+					name: 'Sint Maarten (Dutch part)',
+					code: '(SX)',
+					flag: '🇸🇽',
+				},
+				{
+					name: 'Slovakia',
+					code: '(SK)',
+					flag: '🇸🇰',
+				},
+				{
+					name: 'Slovenia',
+					code: '(SI)',
+					flag: '🇸🇮',
+				},
+				{
+					name: 'Solomon Islands',
+					code: '(SB)',
+					flag: '🇸🇧',
+				},
+				{
+					name: 'Somalia',
+					code: '(SO)',
+					flag: '🇸🇴',
+				},
+				{
+					name: 'South Africa',
+					code: '(ZA)',
+					flag: '🇿🇦',
+				},
+				{
+					name: 'South Georgia and the South Sandwich Islands',
+					code: '(GS)',
+					flag: '🇬🇸',
+				},
+				{
+					name: 'South Korea',
+					code: '(KR)',
+					flag: '🇰🇷',
+				},
+				{
+					name: 'South Sudan',
+					code: '(SS)',
+					flag: '🇸🇸',
+				},
+				{
+					name: 'Spain',
+					code: '(ES)',
+					flag: '🇪🇸',
+				},
+				{
+					name: 'Sri Lanka',
+					code: '(LK)',
+					flag: '🇱🇰',
+				},
+				{
+					name: 'State of Palestine',
+					code: '(PS)',
+					flag: '🇵🇸',
+				},
+				{
+					name: 'Sudan',
+					code: '(SD)',
+					flag: '🇸🇩',
+				},
+				{
+					name: 'Suriname',
+					code: '(SR)',
+					flag: '🇸🇷',
+				},
+				{
+					name: 'Svalbard and Jan Mayen',
+					code: '(SJ)',
+					flag: '🇸🇯',
+				},
+				{
+					name: 'Sweden',
+					code: '(SE)',
+					flag: '🇸🇪',
+				},
+				{
+					name: 'Switzerland',
+					code: '(CH)',
+					flag: '🇨🇭',
+				},
+				{
+					name: 'Syrian Arab Republic',
+					code: '(SY)',
+					flag: '🇸🇾',
+				},
+			],
+		},
+		{
+			title: 'T',
+			items: [
+				{
+					name: 'Taiwan, Province of China',
+					code: '(TW)',
+					flag: '🇹🇼',
+				},
+				{
+					name: 'Tajikistan',
+					code: '(TJ)',
+					flag: '🇹🇯',
+				},
+				{
+					name: 'Thailand',
+					code: '(TH)',
+					flag: '🇹🇭',
+				},
+				{
+					name: 'The Republic of North Macedonia',
+					code: '(MK)',
+					flag: '🇲🇰',
+				},
+				{
+					name: 'Timor-Leste',
+					code: '(TL)',
+					flag: '🇹🇱',
+				},
+				{
+					name: 'Togo',
+					code: '(TG)',
+					flag: '🇹🇬',
+				},
+				{
+					name: 'Tokelau',
+					code: '(TK)',
+					flag: '🇹🇰',
+				},
+				{
+					name: 'Tonga',
+					code: '(TO)',
+					flag: '🇹🇴',
+				},
+				{
+					name: 'Trinidad and Tobago',
+					code: '(TT)',
+					flag: '🇹🇹',
+				},
+				{
+					name: 'Tunisia',
+					code: '(TN)',
+					flag: '🇹🇳',
+				},
+				{
+					name: 'Türkiye',
+					code: '(TR)',
+					flag: '🇹🇷',
+				},
+				{
+					name: 'Turkmenistan',
+					code: '(TM)',
+					flag: '🇹🇲',
+				},
+				{
+					name: 'Turks and Caicos Islands',
+					code: '(TC)',
+					flag: '🇹🇨',
+				},
+				{
+					name: 'Tuvalu',
+					code: '(TV)',
+					flag: '🇹🇻',
+				},
+			],
+		},
+		{
+			title: 'U',
+			items: [
+				{
+					name: 'Uganda',
+					code: '(UG)',
+					flag: '🇺🇬',
+				},
+				{
+					name: 'Ukraine',
+					code: '(UA)',
+					flag: '🇺🇦',
+				},
+				{
+					name: 'United Arab Emirates',
+					code: '(AE)',
+					flag: '🇦🇪',
+				},
+				{
+					name: 'United Kingdom',
+					code: '(GB)',
+					flag: '🇬🇧',
+				},
+				{
+					name: 'United Republic of Tanzania',
+					code: '(TZ)',
+					flag: '🇹🇿',
+				},
+				{
+					name: 'United States Minor Outlying Islands',
+					code: '(UM)',
+					flag: '🇺🇲',
+				},
+				{
+					name: 'United States of America',
+					code: '(US)',
+					flag: '🇺🇸',
+				},
+				{
+					name: 'Uruguay',
+					code: '(UY)',
+					flag: '🇺🇾',
+				},
+				{
+					name: 'Uzbekistan',
+					code: '(UZ)',
+					flag: '🇺🇿',
+				},
+			],
+		},
+		{
+			title: 'V',
+			items: [
+				{
+					name: 'Vanuatu',
+					code: '(VU)',
+					flag: '🇻🇺',
+				},
+				{
+					name: 'Venezuela',
+					code: '(VE)',
+					flag: '🇻🇪',
+				},
+				{
+					name: 'Vietnam',
+					code: '(VN)',
+					flag: '🇻🇳',
+				},
+				{
+					name: 'Virgin Islands, British',
+					code: '(VG)',
+					flag: '🇻🇬',
+				},
+				{
+					name: 'Virgin Islands, U.S.',
+					code: '(VI)',
+					flag: '🇻🇮',
+				},
+			],
+		},
+		{
+			title: 'W',
+			items: [
+				{
+					name: 'Wallis and Futuna',
+					code: '(WF)',
+					flag: '🇼🇫',
+				},
+				{
+					name: 'Western Sahara',
+					code: '(EH)',
+					flag: '🇪🇭',
+				},
+			],
+		},
+		{
+			title: 'Y',
+			items: [
+				{
+					name: 'Yemen',
+					code: '(YE)',
+					flag: '🇾🇪',
+				},
+			],
+		},
+		{
+			title: 'Z',
+			items: [
+				{
+					name: 'Zambia',
+					code: '(ZM)',
+					flag: '🇿🇲',
+				},
+				{
+					name: 'Zimbabwe',
+					code: '(ZW)',
+					flag: '🇿🇼',
+				},
+			],
+		},
 	];
 
 	selectItemTemplate(item: any, index: number, items: Array<any>) {
@@ -29,4 +1385,8 @@ export class ListPageModel extends Observable {
 			okButtonText: DialogStrings.OK,
 		});
 	}
+
+	itemLoading(args: EventData): void {
+		(args.object as View).backgroundColor = 'transparent';
+	}
 }
diff --git a/apps/toolbox/src/pages/list-page.xml b/apps/toolbox/src/pages/list-page.xml
index 1dfd79c25..67f1ecf72 100644
--- a/apps/toolbox/src/pages/list-page.xml
+++ b/apps/toolbox/src/pages/list-page.xml
@@ -1,18 +1,18 @@
 <Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo" actionBarHidden="false">
-     <Page.actionBar>
+    <Page.actionBar>
         <ActionBar>
             <Label text="Components" class="header"/>
         </ActionBar>
     </Page.actionBar>
 
-    <ListView class="list-group" items="{{ components }}" itemTap="{{ componentsItemTap }} " separatorColor="#00000000"
-        itemTemplateSelector="{{ selectItemTemplate }}">
+<GridLayout backgroundColor="#efefef">
+    <ListView class="list-group" items="{{ components }}" itemTap="{{ componentsItemTap }} " separatorColor="#00000000" itemTemplateSelector="{{ selectItemTemplate }}" stickyHeader="true" sectioned="true" stickyHeaderTopPadding="false" stickyHeaderTemplate="<GridLayout><Label text='{{ title }}' fontSize='18' fontWeight='bold' color='#009bff' padding='2 0 2 12' borderBottomWidth='1' borderBottomColor='#ccc' borderTopWidth='1' borderTopColor='#ccc' backgroundColor='#fff' /></GridLayout>" stickyHeaderHeight="45" itemLoading="{{ itemLoading }}">
         <ListView.itemTemplates>
             <template key="not-last">
-                <StackLayout class="list-row-item">
-                    <GridLayout>
-                        <FlexboxLayout flexDirection="row" class="list-view-row" verticalAlignment="center">
-                            <visionos>
+                <!-- <StackLayout class="list-row-item"> -->
+                    <GridLayout columns="auto,auto,*" padding="12" margin="4 6 4 6" borderRadius="4" backgroundColor="#fff">
+                        <!-- <FlexboxLayout flexDirection="row" class="list-view-row" verticalAlignment="center"> -->
+                            <!-- <visionos>
                                 <Label text="{{ iconText }}" class="icon-around icon-label"/>
                             </visionos>
                             <ios>
@@ -22,21 +22,23 @@
                                 <StackLayout class="icon-around">
                                     <Label text="{{ iconText }}" class="icon-label"/>
                                 </StackLayout>
-                            </android>
-                            <StackLayout class="va-middle">
-                                <Label text="{{ name }}" class="component-label"></Label>
-                            </StackLayout>
-                        </FlexboxLayout>
-                        <Label text="J" class="component-select component-select-fix"></Label>
+                            </android> -->
+                            <!-- <StackLayout class="va-middle"> -->
+                            <Label class="component-select component-select-fix" text="{{ flag }}" marginLeft="4"></Label>
+                                <Label col="1" text="{{ name }}" marginLeft="6"></Label>
+                                <Label col="2" text="{{ code }}" marginLeft="4" color="#999"></Label>
+                            <!-- </StackLayout> -->
+                        <!-- </FlexboxLayout> -->
+                        
                     </GridLayout>
-                    <StackLayout class="listview-separator"/>
-                </StackLayout>
+                    <!-- <StackLayout class="listview-separator"/> -->
+                <!-- </StackLayout> -->
             </template>
             <template key="last">
-                <StackLayout class="list-row-item">
-                    <GridLayout>
-                        <FlexboxLayout flexDirection="row" class="list-view-row" verticalAlignment="center">
-                            <visionos>
+                <!-- <StackLayout class="list-row-item"> -->
+                    <GridLayout columns="auto,auto,*" padding="12" margin="4 6 4 6" borderRadius="4" backgroundColor="#fff">
+                        <!-- <FlexboxLayout flexDirection="row" class="list-view-row" verticalAlignment="center"> -->
+                            <!-- <visionos>
                                 <Label text="{{ iconText }}" class="icon-around icon-label"/>
                             </visionos>
                             <ios>
@@ -46,16 +48,20 @@
                                 <StackLayout class="icon-around">
                                     <Label text="{{ iconText }}" class="icon-label"/>
                                 </StackLayout>
-                            </android>
-                            <StackLayout class="va-middle">
-                                <Label text="{{ name }}" class="component-label"></Label>
-                            </StackLayout>
-                        </FlexboxLayout>
-                        <Label text="J" class="component-select component-select-fix"></Label>
+                            </android> -->
+                            <!-- <StackLayout class="va-middle"> -->
+                                <Label class="component-select component-select-fix" text="{{ flag }}" marginLeft="4"></Label>
+                                <Label col="1" text="{{ name }}" marginLeft="6"></Label>
+                                <Label col="2" text="{{ code }}" marginLeft="4" color="#999"></Label>
+                            <!-- </StackLayout>
+                        </FlexboxLayout> -->
+
                     </GridLayout>
-                </StackLayout>
+                <!-- </StackLayout> -->
             </template>
         </ListView.itemTemplates>
     </ListView>
 
+</GridLayout>
+
 </Page>
diff --git a/packages/core/ui/list-view/index.d.ts b/packages/core/ui/list-view/index.d.ts
index c3ea1f050..b463e2239 100644
--- a/packages/core/ui/list-view/index.d.ts
+++ b/packages/core/ui/list-view/index.d.ts
@@ -99,6 +99,46 @@ export class ListView extends View {
 	 */
 	iosEstimatedRowHeight: CoreTypes.LengthType;
 
+	/**
+	 * Gets or sets a value indicating whether the ListView should display sticky headers.
+	 * When enabled, headers will remain visible at the top while scrolling through sections.
+	 *
+	 * @nsProperty
+	 */
+	stickyHeader: boolean;
+
+	/**
+	 * Gets or sets the template for sticky headers.
+	 *
+	 * @nsProperty
+	 */
+	stickyHeaderTemplate: string | Template;
+
+	/**
+	 * Gets or sets the height of sticky headers.
+	 *
+	 * @nsProperty
+	 */
+	stickyHeaderHeight: CoreTypes.LengthType;
+
+	/**
+	 * Gets or sets a value indicating whether the ListView should show default top padding above section headers.
+	 * When set to false (default), removes iOS default spacing for a tighter layout.
+	 * When set to true, preserves iOS default ~4-5px spacing above section headers.
+	 *
+	 * @nsProperty
+	 */
+	stickyHeaderTopPadding: boolean;
+
+	/**
+	 * Gets or sets a value indicating whether the ListView should treat items as sectioned data.
+	 * When enabled, items array should contain objects with 'items' property for section content.
+	 * Each section will have its own sticky header.
+	 *
+	 * @nsProperty
+	 */
+	sectioned: boolean;
+
 	/**
 	 * Forces the ListView to reload all its items.
 	 */
@@ -230,3 +270,28 @@ export const iosEstimatedRowHeightProperty: Property<ListView, CoreTypes.LengthT
  * Backing property for separator color property.
  */
 export const separatorColorProperty: CssProperty<Style, Color>;
+
+/**
+ * Represents the observable property backing the stickyHeader property of each ListView instance.
+ */
+export const stickyHeaderProperty: Property<ListView, boolean>;
+
+/**
+ * Represents the sticky header template property of each ListView instance.
+ */
+export const stickyHeaderTemplateProperty: Property<ListView, string | Template>;
+
+/**
+ * Represents the observable property backing the stickyHeaderHeight property of each ListView instance.
+ */
+export const stickyHeaderHeightProperty: Property<ListView, CoreTypes.LengthType>;
+
+/**
+ * Represents the observable property backing the stickyHeaderTopPadding property of each ListView instance.
+ */
+export const stickyHeaderTopPaddingProperty: Property<ListView, boolean>;
+
+/**
+ * Represents the observable property backing the sectioned property of each ListView instance.
+ */
+export const sectionedProperty: Property<ListView, boolean>;
diff --git a/packages/core/ui/list-view/index.ios.ts b/packages/core/ui/list-view/index.ios.ts
index f5c6c8c93..eb066b623 100644
--- a/packages/core/ui/list-view/index.ios.ts
+++ b/packages/core/ui/list-view/index.ios.ts
@@ -1,7 +1,7 @@
 import { ItemEventData } from '.';
-import { ListViewBase, separatorColorProperty, itemTemplatesProperty, iosEstimatedRowHeightProperty } from './list-view-common';
+import { ListViewBase, separatorColorProperty, itemTemplatesProperty, iosEstimatedRowHeightProperty, stickyHeaderProperty, stickyHeaderTemplateProperty, stickyHeaderHeightProperty, sectionedProperty } from './list-view-common';
 import { CoreTypes } from '../../core-types';
-import { View, KeyedTemplate } from '../core/view';
+import { View, KeyedTemplate, Template } from '../core/view';
 import { Length } from '../styling/length-shared';
 import { Observable, EventData } from '../../data/observable';
 import { Color } from '../../color';
@@ -10,6 +10,9 @@ import { StackLayout } from '../layouts/stack-layout';
 import { ProxyViewContainer } from '../proxy-view-container';
 import { profile } from '../../profiling';
 import { Trace } from '../../trace';
+import { Builder } from '../builder';
+import { Label } from '../label';
+import { isFunction } from '../../utils/types';
 
 export * from './list-view-common';
 
@@ -61,6 +64,41 @@ class ListViewCell extends UITableViewCell {
 	public owner: WeakRef<View>;
 }
 
+@NativeClass
+class ListViewHeaderCell extends UITableViewHeaderFooterView {
+	public static initWithEmptyBackground(): ListViewHeaderCell {
+		const cell = <ListViewHeaderCell>ListViewHeaderCell.new();
+		// Clear background by default - this will make headers transparent
+		cell.backgroundColor = UIColor.clearColor;
+
+		return cell;
+	}
+
+	initWithReuseIdentifier(reuseIdentifier: string): this {
+		const cell = <this>super.initWithReuseIdentifier(reuseIdentifier);
+		// Clear background by default - this will make headers transparent
+		cell.backgroundColor = UIColor.clearColor;
+
+		return cell;
+	}
+
+	public willMoveToSuperview(newSuperview: UIView): void {
+		const parent = <ListView>(this.view ? this.view.parent : null);
+
+		// When inside ListView and there is no newSuperview this header is
+		// removed from native visual tree so we remove it from our tree too.
+		if (parent && !newSuperview) {
+			parent._removeHeaderContainer(this);
+		}
+	}
+
+	public get view(): View {
+		return this.owner ? this.owner.deref() : null;
+	}
+
+	public owner: WeakRef<View>;
+}
+
 function notifyForItemAtIndex(listView: ListViewBase, cell: any, view: View, eventName: string, indexPath: NSIndexPath) {
 	const args = <ItemEventData>{
 		eventName: eventName,
@@ -88,10 +126,33 @@ class DataSource extends NSObject implements UITableViewDataSource {
 		return dataSource;
 	}
 
+	public numberOfSectionsInTableView(tableView: UITableView): number {
+		const owner = this._owner?.deref();
+
+		if (!owner) {
+			return 1;
+		}
+
+		const sections = owner._getSectionCount();
+		if (Trace.isEnabled()) {
+			Trace.write(`ListView: numberOfSections = ${sections} (sectioned: ${owner.sectioned})`, Trace.categories.Debug);
+		}
+		return sections;
+	}
+
 	public tableViewNumberOfRowsInSection(tableView: UITableView, section: number) {
 		const owner = this._owner?.deref();
 
-		return owner && owner.items ? owner.items.length : 0;
+		if (!owner) {
+			return 0;
+		}
+
+		const sectionItems = owner._getItemsInSection(section);
+		const rowCount = sectionItems ? sectionItems.length : 0;
+		if (Trace.isEnabled()) {
+			Trace.write(`ListView: numberOfRows in section ${section} = ${rowCount}`, Trace.categories.Debug);
+		}
+		return rowCount;
 	}
 
 	public tableViewCellForRowAtIndexPath(tableView: UITableView, indexPath: NSIndexPath): UITableViewCell {
@@ -184,6 +245,55 @@ class UITableViewDelegateImpl extends NSObject implements UITableViewDelegate {
 
 		return layout.toDeviceIndependentPixels(height);
 	}
+
+	public tableViewViewForHeaderInSection(tableView: UITableView, section: number): UIView {
+		const owner = this._owner?.deref();
+
+		if (!owner || !owner.stickyHeader || !owner.stickyHeaderTemplate) {
+			if (Trace.isEnabled()) {
+				Trace.write(`ListView: No sticky header (stickyHeader: ${owner?.stickyHeader}, hasTemplate: ${!!owner?.stickyHeaderTemplate})`, Trace.categories.Debug);
+			}
+			return null;
+		}
+
+		if (Trace.isEnabled()) {
+			Trace.write(`ListView: Creating sticky header`, Trace.categories.Debug);
+		}
+
+		const headerReuseIdentifier = 'stickyHeader';
+		let headerCell = <ListViewHeaderCell>tableView.dequeueReusableHeaderFooterViewWithIdentifier(headerReuseIdentifier);
+
+		if (!headerCell) {
+			// Use proper iOS initialization for registered header cells
+			headerCell = <ListViewHeaderCell>ListViewHeaderCell.alloc().initWithReuseIdentifier(headerReuseIdentifier);
+			headerCell.backgroundColor = UIColor.clearColor;
+		}
+
+		owner._prepareHeader(headerCell, section);
+
+		return headerCell;
+	}
+
+	public tableViewHeightForHeaderInSection(tableView: UITableView, section: number): number {
+		const owner = this._owner?.deref();
+
+		if (!owner || !owner.stickyHeader) {
+			return 0;
+		}
+
+		let height: number;
+		if (owner.stickyHeaderHeight === 'auto') {
+			height = 44;
+		} else {
+			height = layout.toDeviceIndependentPixels(Length.toDevicePixels(owner.stickyHeaderHeight, 44));
+		}
+
+		if (Trace.isEnabled()) {
+			Trace.write(`ListView: Sticky header height: ${height}`, Trace.categories.Debug);
+		}
+
+		return height;
+	}
 }
 
 @NativeClass
@@ -233,6 +343,54 @@ class UITableViewRowHeightDelegateImpl extends NSObject implements UITableViewDe
 
 		return layout.toDeviceIndependentPixels(owner._effectiveRowHeight);
 	}
+
+	public tableViewViewForHeaderInSection(tableView: UITableView, section: number): UIView {
+		const owner = this._owner?.deref();
+
+		if (!owner || !owner.stickyHeader || !owner.stickyHeaderTemplate) {
+			if (Trace.isEnabled()) {
+				Trace.write(`ListView: No sticky header (stickyHeader: ${owner?.stickyHeader}, hasTemplate: ${!!owner?.stickyHeaderTemplate})`, Trace.categories.Debug);
+			}
+			return null;
+		}
+
+		if (Trace.isEnabled()) {
+			Trace.write(`ListView: Creating sticky header`, Trace.categories.Debug);
+		}
+
+		const headerReuseIdentifier = 'stickyHeader';
+		let headerCell = <ListViewHeaderCell>tableView.dequeueReusableHeaderFooterViewWithIdentifier(headerReuseIdentifier);
+
+		if (!headerCell) {
+			headerCell = <ListViewHeaderCell>ListViewHeaderCell.alloc().initWithReuseIdentifier(headerReuseIdentifier);
+			headerCell.backgroundColor = UIColor.clearColor;
+		}
+
+		owner._prepareHeader(headerCell, section);
+
+		return headerCell;
+	}
+
+	public tableViewHeightForHeaderInSection(tableView: UITableView, section: number): number {
+		const owner = this._owner?.deref();
+
+		if (!owner || !owner.stickyHeader) {
+			return 0;
+		}
+
+		let height: number;
+		if (owner.stickyHeaderHeight === 'auto') {
+			height = 44;
+		} else {
+			height = layout.toDeviceIndependentPixels(Length.toDevicePixels(owner.stickyHeaderHeight, 44));
+		}
+
+		if (Trace.isEnabled()) {
+			Trace.write(`ListView: Sticky header height: ${height}`, Trace.categories.Debug);
+		}
+
+		return height;
+	}
 }
 
 export class ListView extends ListViewBase {
@@ -244,11 +402,15 @@ export class ListView extends ListViewBase {
 	private _preparingCell: boolean;
 	private _isDataDirty: boolean;
 	private _map: Map<ListViewCell, ItemView>;
+	private _headerMap: Map<ListViewHeaderCell, View>;
+	private _preparingHeader: boolean;
+	private _headerTemplateCache: View;
 	widthMeasureSpec = 0;
 
 	constructor() {
 		super();
 		this._map = new Map<ListViewCell, ItemView>();
+		this._headerMap = new Map<ListViewHeaderCell, View>();
 		this._heights = new Array<number>();
 	}
 
@@ -260,10 +422,20 @@ export class ListView extends ListViewBase {
 		super.initNativeView();
 		const nativeView = this.nativeViewProtected;
 		nativeView.registerClassForCellReuseIdentifier(ListViewCell.class(), this._defaultTemplate.key);
+		nativeView.registerClassForHeaderFooterViewReuseIdentifier(ListViewHeaderCell.class(), 'stickyHeader');
 		nativeView.estimatedRowHeight = DEFAULT_HEIGHT;
 		nativeView.rowHeight = UITableViewAutomaticDimension;
 		nativeView.dataSource = this._dataSource = DataSource.initWithOwner(new WeakRef(this));
 		this._delegate = UITableViewDelegateImpl.initWithOwner(new WeakRef(this));
+
+		// Control section header top padding (iOS 15+)
+		if (nativeView.respondsToSelector('setSectionHeaderTopPadding:')) {
+			if (!this.stickyHeaderTopPadding) {
+				nativeView.sectionHeaderTopPadding = 0;
+			}
+			// When stickyHeaderTopPadding is true, don't set the property to use iOS default
+		}
+
 		this._setNativeClipToBounds();
 	}
 
@@ -296,13 +468,16 @@ export class ListView extends ListViewBase {
 	}
 
 	get _childrenCount(): number {
-		return this._map.size;
+		return this._map.size + this._headerMap.size;
 	}
 
 	public eachChildView(callback: (child: View) => boolean): void {
 		this._map.forEach((view, key) => {
 			callback(view);
 		});
+		this._headerMap.forEach((view, key) => {
+			callback(view);
+		});
 	}
 
 	public scrollToIndex(index: number) {
@@ -340,6 +515,11 @@ export class ListView extends ListViewBase {
 				view.bindingContext = null;
 			}
 		});
+		this._headerMap.forEach((view, nativeView, map) => {
+			if (!(view.bindingContext instanceof Observable)) {
+				view.bindingContext = null;
+			}
+		});
 
 		if (this.isLoaded) {
 			this.nativeViewProtected.reloadData();
@@ -385,8 +565,8 @@ export class ListView extends ListViewBase {
 	}
 
 	public requestLayout(): void {
-		// When preparing cell don't call super - no need to invalidate our measure when cell desiredSize is changed.
-		if (!this._preparingCell) {
+		// When preparing cell or header don't call super - no need to invalidate our measure when cell/header desiredSize is changed.
+		if (!this._preparingCell && !this._preparingHeader) {
 			super.requestLayout();
 		}
 	}
@@ -409,6 +589,9 @@ export class ListView extends ListViewBase {
 		this._map.forEach((childView, listViewCell) => {
 			View.measureChild(this, childView, childView._currentWidthMeasureSpec, childView._currentHeightMeasureSpec);
 		});
+		this._headerMap.forEach((childView, listViewHeaderCell) => {
+			View.measureChild(this, childView, childView._currentWidthMeasureSpec, childView._currentHeightMeasureSpec);
+		});
 	}
 
 	public onLayout(left: number, top: number, right: number, bottom: number): void {
@@ -423,6 +606,12 @@ export class ListView extends ListViewBase {
 				View.layoutChild(this, childView, 0, 0, width, cellHeight);
 			}
 		});
+		this._headerMap.forEach((childView, listViewHeaderCell) => {
+			const headerHeight = this.stickyHeaderHeight === 'auto' ? 44 : Length.toDevicePixels(this.stickyHeaderHeight, 44);
+			const width = layout.getMeasureSpecSize(this.widthMeasureSpec);
+			childView.iosOverflowSafeAreaEnabled = false;
+			View.layoutChild(this, childView, 0, 0, width, headerHeight);
+		});
 	}
 
 	private _layoutCell(cellView: View, indexPath: NSIndexPath): number {
@@ -445,11 +634,21 @@ export class ListView extends ListViewBase {
 			this._preparingCell = true;
 			let view: ItemView = cell.view;
 			if (!view) {
-				view = this._getItemTemplate(indexPath.row).createView();
+				if (this.sectioned) {
+					// For sectioned data, we need to calculate the absolute index for template selection
+					let absoluteIndex = 0;
+					for (let i = 0; i < indexPath.section; i++) {
+						absoluteIndex += this._getItemsInSection(i).length;
+					}
+					absoluteIndex += indexPath.row;
+					view = this._getItemTemplate(absoluteIndex).createView();
+				} else {
+					view = this._getItemTemplate(indexPath.row).createView();
+				}
 			}
 
 			const args = notifyForItemAtIndex(this, cell, view, ITEMLOADING, indexPath);
-			view = args.view || this._getDefaultItemContent(indexPath.row);
+			view = args.view || this._getDefaultItemContent(this.sectioned ? indexPath.row : indexPath.row);
 
 			// Proxy containers should not get treated as layouts.
 			// Wrap them in a real layout as well.
@@ -469,8 +668,14 @@ export class ListView extends ListViewBase {
 				cell.owner = new WeakRef(view);
 			}
 
-			this._prepareItem(view, indexPath.row);
-			view._listViewItemIndex = indexPath.row;
+			if (this.sectioned) {
+				this._prepareItemInSection(view, indexPath.section, indexPath.row);
+				view._listViewItemIndex = indexPath.row; // Keep row index for compatibility
+				(view as any)._listViewSectionIndex = indexPath.section;
+			} else {
+				this._prepareItem(view, indexPath.row);
+				view._listViewItemIndex = indexPath.row;
+			}
 			this._map.set(cell, view);
 
 			// We expect that views returned from itemLoading are new (e.g. not reused).
@@ -503,6 +708,163 @@ export class ListView extends ListViewBase {
 		this._map.delete(cell);
 	}
 
+	public _prepareHeader(headerCell: ListViewHeaderCell, section: number): number {
+		let headerHeight: number;
+		try {
+			this._preparingHeader = true;
+			let view: View = headerCell.view;
+			if (!view) {
+				view = this._getHeaderTemplate();
+				if (!view) {
+					if (Trace.isEnabled()) {
+						Trace.write(`ListView: Failed to create header view for section ${section}`, Trace.categories.Debug);
+					}
+					// Create a fallback view
+					const lbl = new Label();
+					lbl.text = `Section ${section}`;
+					view = lbl;
+				}
+			}
+
+			// Handle header cell reuse
+			if (!headerCell.view) {
+				headerCell.owner = new WeakRef(view);
+			} else if (headerCell.view !== view) {
+				// Remove old view and set new one
+				(<UIView>headerCell.view.nativeViewProtected)?.removeFromSuperview();
+				this._removeHeaderContainer(headerCell);
+				headerCell.owner = new WeakRef(view);
+			}
+
+			// Clear existing binding context and set new one
+			if (view.bindingContext) {
+				view.bindingContext = null;
+			}
+
+			if (this.sectioned) {
+				const sectionData = this._getSectionData(section);
+				if (sectionData) {
+					view.bindingContext = sectionData;
+				} else {
+					// Fallback if section data is missing
+					view.bindingContext = { title: `Section ${section}`, section: section };
+				}
+			} else {
+				view.bindingContext = this.bindingContext;
+			}
+
+			// Force immediate binding context evaluation
+			if (view && typeof (view as any)._onBindingContextChanged === 'function') {
+				(view as any)._onBindingContextChanged(null, view.bindingContext);
+
+				// Also trigger for child views
+				// @ts-ignore
+				if (view._childrenCount) {
+					view.eachChildView((child) => {
+						if (typeof (child as any)._onBindingContextChanged === 'function') {
+							(child as any)._onBindingContextChanged(null, view.bindingContext);
+						}
+						return true;
+					});
+				}
+			}
+			this._headerMap.set(headerCell, view);
+
+			// Add new header view to the cell
+			if (view && !view.parent) {
+				this._addView(view);
+				headerCell.contentView.addSubview(view.nativeViewProtected);
+			}
+
+			// Request layout and measure/layout the header
+			if (view && view.bindingContext) {
+				view.requestLayout();
+			}
+
+			headerHeight = this._layoutHeader(view);
+		} finally {
+			this._preparingHeader = false;
+		}
+
+		return headerHeight;
+	}
+
+	private _layoutHeader(headerView: View): number {
+		if (headerView) {
+			const headerHeight = this.stickyHeaderHeight === 'auto' ? 44 : Length.toDevicePixels(this.stickyHeaderHeight, 44);
+			const heightMeasureSpec: number = layout.makeMeasureSpec(headerHeight, layout.EXACTLY);
+
+			const measuredSize = View.measureChild(this, headerView, this.widthMeasureSpec, heightMeasureSpec);
+			// Layout the header with the measured size
+			View.layoutChild(this, headerView, 0, 0, measuredSize.measuredWidth, measuredSize.measuredHeight);
+
+			return measuredSize.measuredHeight;
+		}
+
+		return 44;
+	}
+
+	private _getHeaderTemplate(): View {
+		if (this.stickyHeaderTemplate) {
+			if (__UI_USE_EXTERNAL_RENDERER__) {
+				if (isFunction(this.stickyHeaderTemplate)) {
+					return (<Template>this.stickyHeaderTemplate)();
+				}
+			} else {
+				if (typeof this.stickyHeaderTemplate === 'string') {
+					try {
+						const parsed = Builder.parse(this.stickyHeaderTemplate, this);
+						if (!parsed) {
+							// Create a simple fallback
+							const fallbackLabel = new Label();
+							fallbackLabel.text = 'Parse Failed';
+							return fallbackLabel;
+						}
+						return parsed;
+					} catch (error) {
+						if (Trace.isEnabled()) {
+							Trace.write(`ListView: Template parsing error: ${error}`, Trace.categories.Debug);
+						}
+						// Create a simple fallback
+						const errorLabel = new Label();
+						errorLabel.text = 'Template Error';
+						return errorLabel;
+					}
+				} else {
+					const view = (<Template>this.stickyHeaderTemplate)();
+					if (Trace.isEnabled()) {
+						Trace.write(`ListView: Created header view from template function: ${!!view} (type: ${view?.constructor?.name})`, Trace.categories.Debug);
+					}
+					return view;
+				}
+			}
+		}
+
+		if (Trace.isEnabled()) {
+			Trace.write(`ListView: No sticky header template, creating default`, Trace.categories.Debug);
+		}
+
+		// Return a default header if no template is provided
+		const lbl = new Label();
+		lbl.text = 'Default Header';
+		return lbl;
+	}
+
+	public _removeHeaderContainer(headerCell: ListViewHeaderCell): void {
+		const view: View = headerCell.view;
+		// This is to clear the StackLayout that is used to wrap ProxyViewContainer instances.
+		if (!(view.parent instanceof ListView)) {
+			this._removeView(view.parent);
+		}
+
+		// No need to request layout when we are removing headers.
+		const preparing = this._preparingHeader;
+		this._preparingHeader = true;
+		view.parent._removeView(view);
+		this._preparingHeader = preparing;
+		this._headerMap.delete(headerCell);
+	}
+
 	[separatorColorProperty.getDefault](): UIColor {
 		return this.nativeViewProtected.separatorColor;
 	}
@@ -533,4 +895,58 @@ export class ListView extends ListViewBase {
 		const estimatedHeight = layout.toDeviceIndependentPixels(Length.toDevicePixels(value, 0));
 		nativeView.estimatedRowHeight = estimatedHeight < 0 ? DEFAULT_HEIGHT : estimatedHeight;
 	}
+
+	[stickyHeaderProperty.getDefault](): boolean {
+		return false;
+	}
+	[stickyHeaderProperty.setNative](value: boolean) {
+		if (Trace.isEnabled()) {
+			Trace.write(`ListView: stickyHeader set to ${value}`, Trace.categories.Debug);
+		}
+		// Immediately refresh to apply changes
+		if (this.isLoaded) {
+			this.refresh();
+		}
+	}
+
+	[stickyHeaderTemplateProperty.getDefault](): string | Template {
+		return null;
+	}
+	[stickyHeaderTemplateProperty.setNative](value: string | Template) {
+		if (Trace.isEnabled()) {
+			Trace.write(`ListView: stickyHeaderTemplate set: ${typeof value} ${value ? '(has value)' : '(null)'}`, Trace.categories.Debug);
+		}
+		// Clear any cached template
+		this._headerTemplateCache = null;
+		// Immediately refresh to apply changes
+		if (this.isLoaded) {
+			this.refresh();
+		}
+	}
+
+	[stickyHeaderHeightProperty.getDefault](): CoreTypes.LengthType {
+		return 'auto';
+	}
+	[stickyHeaderHeightProperty.setNative](value: CoreTypes.LengthType) {
+		if (Trace.isEnabled()) {
+			Trace.write(`ListView: stickyHeaderHeight set to ${value}`, Trace.categories.Debug);
+		}
+		// Immediately refresh to apply changes
+		if (this.isLoaded) {
+			this.refresh();
+		}
+	}
+
+	[sectionedProperty.getDefault](): boolean {
+		return false;
+	}
+	[sectionedProperty.setNative](value: boolean) {
+		if (Trace.isEnabled()) {
+			Trace.write(`ListView: sectioned set to ${value}`, Trace.categories.Debug);
+		}
+		// Immediately refresh to apply changes
+		if (this.isLoaded) {
+			this.refresh();
+		}
+	}
 }
diff --git a/packages/core/ui/list-view/list-view-common.ts b/packages/core/ui/list-view/list-view-common.ts
index 1cf71a0f3..432ce30a2 100644
--- a/packages/core/ui/list-view/list-view-common.ts
+++ b/packages/core/ui/list-view/list-view-common.ts
@@ -11,6 +11,8 @@ import { ObservableArray, ChangedData } from '../../data/observable-array';
 import { addWeakEventListener, removeWeakEventListener } from '../core/weak-event-listener';
 import { CoreTypes } from '../../core-types';
 import { isFunction } from '../../utils/types';
+import { Trace } from '../../trace';
+import { booleanConverter } from '../core/view-base';
 
 const autoEffectiveRowHeight = -1;
 
@@ -49,6 +51,11 @@ export abstract class ListViewBase extends ContainerView implements ListViewDefi
 	public items: any[] | ItemsSource;
 	public itemTemplate: string | Template;
 	public itemTemplates: string | Array<KeyedTemplate>;
+	public stickyHeader: boolean;
+	public stickyHeaderTemplate: string | Template;
+	public stickyHeaderHeight: CoreTypes.LengthType;
+	public stickyHeaderTopPadding: boolean;
+	public sectioned: boolean;
 
 	get separatorColor(): Color {
 		return this.style.separatorColor;
@@ -125,12 +132,58 @@ export abstract class ListViewBase extends ContainerView implements ListViewDefi
 		}
 	}
 
+	public _prepareItemInSection(item: View, section: number, index: number) {
+		if (item) {
+			item.bindingContext = this._getDataItemInSection(section, index);
+		}
+	}
+
 	private _getDataItem(index: number): any {
 		const thisItems = <ItemsSource>this.items;
 
 		return thisItems.getItem ? thisItems.getItem(index) : thisItems[index];
 	}
 
+	public _getSectionCount(): number {
+		if (!this.sectioned || !this.items) {
+			return 1;
+		}
+		return this.items.length;
+	}
+
+	public _getItemsInSection(section: number): any[] | ItemsSource {
+		if (!this.sectioned || !this.items) {
+			return this.items;
+		}
+		const sectionData = this.items[section];
+		return sectionData?.items || [];
+	}
+
+	public _getSectionData(section: number): any {
+		if (!this.sectioned || !this.items || !Array.isArray(this.items)) {
+			return null;
+		}
+
+		if (section < 0 || section >= this.items.length) {
+			if (Trace.isEnabled()) {
+				Trace.write(`ListView: Section ${section} out of bounds (total sections: ${this.items.length})`, Trace.categories.Debug);
+			}
+			return null;
+		}
+
+		const sectionData = this.items[section];
+		if (Trace.isEnabled() && !sectionData) {
+			Trace.write(`ListView: Section ${section} data is null/undefined`, Trace.categories.Debug);
+		}
+
+		return sectionData;
+	}
+
+	public _getDataItemInSection(section: number, index: number): any {
+		const sectionItems = this._getItemsInSection(section);
+		return (sectionItems as ItemsSource).getItem ? (sectionItems as ItemsSource).getItem(index) : sectionItems[index];
+	}
+
 	public _getDefaultItemContent(index: number): View {
 		const lbl = new Label();
 		lbl.bind({
@@ -249,3 +302,40 @@ export const separatorColorProperty = new CssProperty<Style, Color>({
 	valueConverter: (v) => new Color(v),
 });
 separatorColorProperty.register(Style);
+
+export const stickyHeaderProperty = new Property<ListViewBase, boolean>({
+	name: 'stickyHeader',
+	defaultValue: false,
+	valueConverter: booleanConverter,
+});
+stickyHeaderProperty.register(ListViewBase);
+
+export const stickyHeaderTemplateProperty = new Property<ListViewBase, string | Template>({
+	name: 'stickyHeaderTemplate',
+	valueChanged: (target) => {
+		target.refresh();
+	},
+});
+stickyHeaderTemplateProperty.register(ListViewBase);
+
+export const stickyHeaderHeightProperty = new Property<ListViewBase, CoreTypes.LengthType>({
+	name: 'stickyHeaderHeight',
+	defaultValue: 'auto',
+	equalityComparer: Length.equals,
+	valueConverter: Length.parse,
+});
+stickyHeaderHeightProperty.register(ListViewBase);
+
+export const stickyHeaderTopPaddingProperty = new Property<ListViewBase, boolean>({
+	name: 'stickyHeaderTopPadding',
+	defaultValue: false,
+	valueConverter: booleanConverter,
+});
+stickyHeaderTopPaddingProperty.register(ListViewBase);
+
+export const sectionedProperty = new Property<ListViewBase, boolean>({
+	name: 'sectioned',
+	defaultValue: false,
+	valueConverter: (v) => !!v,
+});
+sectionedProperty.register(ListViewBase);