ti-ui_skill

Overview

This skill is a Titanium SDK UI/UX patterns and components expert for reviewing, designing, and optimizing app interfaces across Alloy and Classic projects. It auto-detects Titanium projects and provides concrete guidance for layouts, ListView/TableView performance, gestures, animations, accessibility, and platform-specific UI. Use it to enforce best practices and resolve common cross-platform pitfalls quickly.

How this skill works

When invoked inside a project containing tiapp.xml, the skill switches into Titanium mode and targets either Alloy (app/ structure) or Classic (Resources/ structure). It inspects layout choices, ListView/TableView templates and usage patterns, event handling and bubbling, gesture handlers, animation code, accessibility properties, and platform-specific APIs, then returns practical advice and fixes. If no Titanium project is detected, it reports that the guidance applies only to Titanium projects.

When to use it

• Review or optimize ListView/TableView performance and scrolling behavior
• Debug event handling, bubbling, or global listener leaks
• Design or review gestures (swipe, pinch) and touch handling
• Implement animations, transforms, and transitions for UI motion
• Audit accessibility (VoiceOver/TalkBack) and platform-specific a11y rules
• Adapt layouts, status bar, action/navigation bars, and orientation handling for iOS and Android

Best practices

• Prefer ListView over TableView for large data sets; use fixed heights (avoid Ti.UI.SIZE) in item templates
• Batch UI updates and use applyProperties to reduce bridge crossings
• Never attach accessibility properties to container views that should forward interaction to children
• Scope platform-specific Ti.UI.iOS* or Ti.UI.Android* properties behind platform modifiers or conditional code
• Remove global listeners (Ti.App, Ti.Gesture, Ti.Accelerometer) on pause to save battery
• Use dp units for cross-platform sizing and avoid mixing vertical+horizontal scroll in Android ScrollView

Example use cases

• Identify and fix jerky ListView scrolling by replacing Ti.UI.SIZE with fixed item heights
• Convert TableView implementations to ListView templates and bindId patterns for performance
• Detect accidental use of Ti.UI.iOS.* properties on Android and suggest platform-conditional fixes
• Recommend accessibility fixes: adding accessibilityLabel to controls (not containers) and ensuring VoiceOver/TalkBack focus order
• Propose animation optimizations using 2D/3D matrices and avoiding heavy WebView content inside scrolling containers