skills.rest
unoplatform
unoplatformOFFICIAL
Explore all skills by this author →
Website𝕏@unoplatformGitHub

uno-toolkit-tabbar

Implement Uno Platform TabBar navigation with icons, labels, badges, and selection indicators for cross-platform apps.

9|1|Updated Dec 10, 2024
Search Tags:#styling#navigation#cross-platform#ux#uidesign#tabbar#uno-toolkit
One-click install
npx skills add https://github.com/unoplatform/studio --skill uno-toolkit-tabbar
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: uno-toolkit-tabbar
Source: https://github.com/unoplatform/studio/tree/main/skills/uno-toolkit-tabbar
Command: npx skills add https://github.com/unoplatform/studio --skill uno-toolkit-tabbar

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill enables building and styling TabBar navigation in Uno Platform applications, providing a consistent baseline for icons, labels, badges, and selection indicators across platforms.

Core Features & Use Cases

  • Supports bottom navigation, top tabs, and vertical tab layouts for flexible UX.
  • TabBarItem supports Icon, Content (label), and Badge for rich navigation cues.
  • Integrates with Uno Toolkit styling conventions and, when needed, with navigation extensions for region-based wiring in a shell.

Quick Start

Describe the desired tab navigation and generate a TabBar UI prototype in your Uno Platform app.

Frequently Asked Questions about uno-toolkit-tabbar

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I implement bottom navigation with icons and labels in Uno Platform apps?▼

Bottom navigation in Uno Platform apps is implemented using the TabBar and TabBarItem controls, which support configuring icons, content labels, and selection indicators for cross-platform UX consistency.

Can I create vertical tab layouts for navigation in Uno Platform?▼

Yes, vertical tab layouts are supported for navigation in Uno Platform. The TabBar control enables building flexible UX configurations including bottom navigation, top tabs, and vertical tab arrangements.

How do I add badges to tab navigation items in Uno Platform?▼

Badges are added to tab navigation items in Uno Platform by configuring the Badge property on the TabBarItem control, alongside its Icon and Content properties, to provide rich navigation cues.

Does Uno Toolkit TabBar support region-based navigation wiring?▼

Yes, TabBar supports region-based navigation wiring. It integrates with Uno Toolkit navigation extensions to connect TabBar items within a shell, establishing explicit styles and navigation regions.

What is the best way to style TabBar selection indicators across cross-platform Uno Platform apps?▼

Styling TabBar selection indicators across cross-platform Uno Platform apps is achieved by applying explicit styles using Uno Toolkit UI conventions, ensuring consistent visual feedback for the selected tab.

Related Skills

Explore More Software Engineering Skills→
unoplatformunoplatform
9

uno-navigation-tabbar

Generate region-based bottom TabBar navigation shells for Uno Platform apps.

Official
Intermediate
mtmatteimtmattei
5

uno-navigation

Encode Uno Platform navigation patterns with ViewMaps, RouteMaps, and region-based routing.

Community
Advanced
unoplatformunoplatform
9

uno-toolkit-tabbaritem-extensions

Configure TabBarItem on-click navigation via XAML using TabBarItemExtensions.

Official
Basic
unoplatformunoplatform
9

uno-navigation-regions

Implement region-based navigation in Uno Platform apps using Region.Attached, Region.Name, and Region.Navigator.

Official
Intermediate