{"id":"ca6d8c5d-5f67-49f3-973b-74af335e25b6","shortId":"DLYZDh","kind":"skill","title":"syncfusion-maui-picker","tagline":"Implements Syncfusion .NET MAUI Picker (SfPicker) control. Use when working with picker controls, item pickers, selection pickers, multi-column pickers, or dialog pickers in .NET MAUI applications. This skill covers installation, configuration, modes (Default, Dialog, RelativeDia","description":"# Implementing .NET MAUI Picker (SfPicker)\n\nThe Syncfusion .NET MAUI Picker (SfPicker) control allows users to select items from a customizable picker interface with support for multiple columns, different display modes, and extensive customization options. It's ideal for implementing date pickers, time pickers, color pickers, country pickers, and any scenario requiring item selection from a scrollable list.\n\n## When to Use This Skill\n\nUse this skill when you need to:\n\n- **Implement item selection interfaces** in .NET MAUI applications using Syncfusion Picker\n- **Create custom pickers** such as date pickers, time pickers, color pickers, or country pickers\n- **Display picker controls** in Default, Dialog, or RelativeDialog modes\n- **Configure multi-column pickers** for complex data selection scenarios\n- **Customize picker appearance** including headers, footers, selection views, and column headers\n- **Bind data** to picker columns using ItemsSource and ObservableCollection\n- **Handle picker events** such as SelectionChanged, OkButtonClicked, or CancelButtonClicked\n- **Implement accessibility features** for picker controls\n- **Localize picker content** for multi-language support\n- **Apply advanced features** like looping, item templates, or liquid glass effects\n\n## Component Overview\n\nThe .NET MAUI Picker (SfPicker) provides:\n\n- **Multiple display modes**: Default (inline), Dialog (popup), and RelativeDialog (positioned popup)\n- **Multi-column support**: Display multiple columns with independent data sources\n- **Customizable views**: Header, footer, selection view, and column headers\n- **Rich data binding**: Support for simple collections and complex objects\n- **Event-driven architecture**: Events and commands for user interactions\n- **Accessibility support**: WCAG compliance and screen reader compatibility\n- **Localization**: Multi-language and culture-specific formatting\n- **Advanced customization**: Item templates, styling, and visual effects\n\n## Documentation and Navigation Guide\n\n### Getting Started\n📄 **Read:** [references/getting-started.md](references/getting-started.md)\n\nWhen the user needs to:\n- Install and set up the Syncfusion .NET MAUI Picker\n- Add the NuGet package (Syncfusion.Maui.Picker)\n- Register the Syncfusion handler (ConfigureSyncfusionCore)\n- Create a basic picker implementation in XAML or C#\n- Set initial height and width properties\n\n### Picker Modes and Display\n📄 **Read:** [references/picker-modes.md](references/picker-modes.md)\n\nWhen the user needs to:\n- Choose between Default, Dialog, or RelativeDialog modes\n- Display picker as a popup dialog\n- Position picker relative to specific UI elements\n- Configure RelativePosition options (AlignTop, AlignTopLeft, AlignBottomRight, etc.)\n- Set RelativeView for custom positioning\n- Control popup size with PopupWidth and PopupHeight\n- Programmatically open/close picker using IsOpen property\n\n### Column Configuration\n📄 **Read:** [references/columns.md](references/columns.md)\n\nWhen the user needs to:\n- Add single or multiple columns to the picker\n- Use DisplayMemberPath for displaying specific object properties\n- Customize column width\n- Set SelectedIndex and SelectedItem properties\n- Bind ItemsSource to data collections\n- Configure column divider color for multi-column pickers\n- Manage dynamic column addition and removal\n\n### Header, Footer, and Selection Views\n📄 **Read:** [references/header-footer-selection.md](references/header-footer-selection.md)\n\nWhen the user needs to:\n- Add and customize header view (PickerHeaderView)\n- Set header text and height\n- Configure footer view with OK and Cancel buttons\n- Enable/disable ShowOkButton property\n- Customize footer button text (OkButtonText, CancelButtonText)\n- Style selection view appearance\n- Use IsSelectionImmediate for instant selection updates\n\n### Column Headers\n📄 **Read:** [references/column-headers.md](references/column-headers.md)\n\nWhen the user needs to:\n- Add column header view (PickerColumnHeaderView)\n- Set HeaderText property for individual columns\n- Configure column header height\n- Customize column header styling\n- Implement multi-column header layouts\n\n### Populating Items and Data Binding\n📄 **Read:** [references/populating-items.md](references/populating-items.md)\n\nWhen the user needs to:\n- Bind ItemsSource to ObservableCollection\n- Create and populate data sources\n- Configure binding context in XAML and C#\n- Bind complex objects with custom properties\n- Handle dynamic data updates and refreshes\n- Implement MVVM data binding patterns\n\n### Events and Commands\n📄 **Read:** [references/events-commands.md](references/events-commands.md)\n\nWhen the user needs to:\n- Handle Opened, Closing, and Closed events\n- Respond to SelectionChanged events\n- Process OkButtonClicked and CancelButtonClicked events\n- Use SelectionChangedCommand with MVVM\n- Implement AcceptCommand and DeclineCommand\n- Access event arguments and parameters\n- Cancel picker closing with Closing event\n\n### Customization and Styling\n📄 **Read:** [references/customization.md](references/customization.md)\n\nWhen the user needs to:\n- Apply item templates for custom item appearance\n- Customize visual styling (colors, fonts, backgrounds)\n- Configure text styles and formatting\n- Implement visual states\n- Apply custom themes and styles\n\n### Accessibility\n📄 **Read:** [references/accessibility.md](references/accessibility.md)\n\nWhen the user needs to:\n- Ensure WCAG compliance\n- Implement keyboard navigation support\n- Configure screen reader compatibility\n- Add ARIA attributes for accessibility\n- Manage focus behavior\n- Follow accessibility best practices\n\n### Localization\n📄 **Read:** [references/localization.md](references/localization.md)\n\nWhen the user needs to:\n- Implement multi-language support\n- Set up resource files for localization\n- Configure culture-specific formatting\n- Handle right-to-left (RTL) languages\n\n### Advanced Features\n📄 **Read:** [references/advanced-features.md](references/advanced-features.md)\n\nWhen the user needs to:\n- Enable looping (circular scrolling)\n- Configure picker text display modes\n- Implement data template selectors\n- Apply liquid glass effects\n- Optimize picker performance\n- Handle complex custom scenarios\n- Troubleshoot edge cases","tags":["syncfusion","maui","picker","components","skills","agent-skills"],"capabilities":["skill","source-syncfusion","skill-syncfusion-maui-picker","topic-agent-skills"],"categories":["maui-ui-components-skills"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/syncfusion/maui-ui-components-skills/syncfusion-maui-picker","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add syncfusion/maui-ui-components-skills","source_repo":"https://github.com/syncfusion/maui-ui-components-skills","install_from":"skills.sh"}},"qualityScore":"0.476","qualityRationale":"deterministic score 0.48 from registry signals: · indexed on github topic:agent-skills · 53 github stars · SKILL.md body (6,257 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-04-22T00:56:08.727Z","embedding":null,"createdAt":"2026-04-18T22:15:33.340Z","updatedAt":"2026-04-22T00:56:08.727Z","lastSeenAt":"2026-04-22T00:56:08.727Z","tsv":"'acceptcommand':614 'access':185,268,617,665,689,694 'add':316,408,464,512,685 'addit':448 'advanc':199,285,729 'alignbottomright':378 'aligntop':376 'aligntopleft':377 'allow':54 'appear':157,495,645 'appli':198,639,660,752 'applic':32,118 'architectur':261 'argument':619 'aria':686 'attribut':687 'background':651 'basic':328 'behavior':692 'best':695 'bind':166,250,431,541,550,560,566,581 'button':482,488 'c':334,565 'cancel':481,622 'cancelbuttonclick':183,607 'cancelbuttontext':491 'case':765 'choos':353 'circular':741 'close':596,598,624,626 'collect':254,435 'color':85,131,439,649 'column':24,68,148,164,170,230,234,246,398,412,424,437,443,447,502,513,522,524,528,534 'command':264,585 'compat':275,684 'complex':151,256,567,760 'complianc':271,676 'compon':209 'configur':37,145,373,399,436,475,523,559,652,681,717,743 'configuresyncfusioncor':325 'content':192 'context':561 'control':11,17,53,138,189,385 'countri':87,134 'cover':35 'creat':122,326,554 'cultur':282,719 'culture-specif':281,718 'custom':74,123,155,286,383,423,466,486,527,570,628,643,646,661,761 'customiz':61,239 'data':152,167,237,249,434,540,557,574,580,749 'date':81,127 'declinecommand':616 'default':39,140,220,355 'dialog':27,40,141,222,356,365 'differ':69 'display':70,136,218,232,344,360,419,746 'displaymemberpath':417 'divid':438 'document':293 'driven':260 'dynam':446,573 'edg':764 'effect':208,292,755 'element':372 'enabl':739 'enable/disable':483 'ensur':674 'etc':379 'event':177,259,262,583,599,603,608,618,627 'event-driven':258 'extens':73 'featur':186,200,730 'file':714 'focus':691 'follow':693 'font':650 'footer':160,242,452,476,487 'format':284,656,721 'get':297 'glass':207,754 'guid':296 'handl':175,572,594,722,759 'handler':324 'header':159,165,241,247,451,467,471,503,514,525,529,535 'headertext':518 'height':337,474,526 'ideal':78 'implement':5,42,80,111,184,330,531,578,613,657,677,706,748 'includ':158 'independ':236 'individu':521 'initi':336 'inlin':221 'instal':36,307 'instant':499 'interact':267 'interfac':63,114 'isopen':396 'isselectionimmedi':497 'item':18,58,93,112,203,287,538,640,644 'itemssourc':172,432,551 'keyboard':678 'languag':196,279,709,728 'layout':536 'left':726 'like':201 'liquid':206,753 'list':98 'local':190,276,697,716 'loop':202,740 'manag':445,690 'maui':3,8,31,44,50,117,213,314 'mode':38,71,144,219,342,359,747 'multi':23,147,195,229,278,442,533,708 'multi-column':22,146,228,441,532 'multi-languag':194,277,707 'multipl':67,217,233,411 'mvvm':579,612 'navig':295,679 'need':109,305,351,406,462,510,548,592,637,672,704,737 'net':7,30,43,49,116,212,313 'nuget':318 'object':257,421,568 'observablecollect':174,553 'ok':479 'okbuttonclick':181,605 'okbuttontext':490 'open':595 'open/close':393 'optim':756 'option':75,375 'overview':210 'packag':319 'paramet':621 'pattern':582 'perform':758 'picker':4,9,16,19,21,25,28,45,51,62,82,84,86,88,121,124,128,130,132,135,137,149,156,169,176,188,191,214,315,329,341,361,367,394,415,444,623,744,757 'pickercolumnheaderview':516 'pickerheaderview':469 'popul':537,556 'popup':223,227,364,386 'popupheight':391 'popupwidth':389 'posit':226,366,384 'practic':696 'process':604 'programmat':392 'properti':340,397,422,430,485,519,571 'provid':216 'read':299,345,400,456,504,542,586,631,666,698,731 'reader':274,683 'references/accessibility.md':667,668 'references/advanced-features.md':732,733 'references/column-headers.md':505,506 'references/columns.md':401,402 'references/customization.md':632,633 'references/events-commands.md':587,588 'references/getting-started.md':300,301 'references/header-footer-selection.md':457,458 'references/localization.md':699,700 'references/picker-modes.md':346,347 'references/populating-items.md':543,544 'refresh':577 'regist':321 'relat':368 'relativedia':41 'relativedialog':143,225,358 'relativeposit':374 'relativeview':381 'remov':450 'requir':92 'resourc':713 'respond':600 'rich':248 'right':724 'right-to-left':723 'rtl':727 'scenario':91,154,762 'screen':273,682 'scroll':742 'scrollabl':97 'select':20,57,94,113,153,161,243,454,493,500 'selectedindex':427 'selecteditem':429 'selectionchang':180,602 'selectionchangedcommand':610 'selector':751 'set':309,335,380,426,470,517,711 'sfpicker':10,46,52,215 'showokbutton':484 'simpl':253 'singl':409 'size':387 'skill':34,103,106 'skill-syncfusion-maui-picker' 'sourc':238,558 'source-syncfusion' 'specif':283,370,420,720 'start':298 'state':659 'style':289,492,530,630,648,654,664 'support':65,197,231,251,269,680,710 'syncfus':2,6,48,120,312,323 'syncfusion-maui-pick':1 'syncfusion.maui.picker':320 'templat':204,288,641,750 'text':472,489,653,745 'theme':662 'time':83,129 'topic-agent-skills' 'troubleshoot':763 'ui':371 'updat':501,575 'use':12,101,104,119,171,395,416,496,609 'user':55,266,304,350,405,461,509,547,591,636,671,703,736 'view':162,240,244,455,468,477,494,515 'visual':291,647,658 'wcag':270,675 'width':339,425 'work':14 'xaml':332,563","prices":[{"id":"23cfa919-94b1-43d9-b4ed-e74ffc9d2e96","listingId":"ca6d8c5d-5f67-49f3-973b-74af335e25b6","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"syncfusion","category":"maui-ui-components-skills","install_from":"skills.sh"},"createdAt":"2026-04-18T22:15:33.340Z"}],"sources":[{"listingId":"ca6d8c5d-5f67-49f3-973b-74af335e25b6","source":"github","sourceId":"syncfusion/maui-ui-components-skills/syncfusion-maui-picker","sourceUrl":"https://github.com/syncfusion/maui-ui-components-skills/tree/master/skills/syncfusion-maui-picker","isPrimary":false,"firstSeenAt":"2026-04-18T22:15:33.340Z","lastSeenAt":"2026-04-22T00:56:08.727Z"}],"details":{"listingId":"ca6d8c5d-5f67-49f3-973b-74af335e25b6","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"syncfusion","slug":"syncfusion-maui-picker","github":{"repo":"syncfusion/maui-ui-components-skills","stars":53,"topics":["agent-skills"],"license":null,"html_url":"https://github.com/syncfusion/maui-ui-components-skills","pushed_at":"2026-04-08T07:27:37Z","description":"Skills for Syncfusion .NET MAUI components. Enable AI-assisted development with comprehensive documentation, code examples, and best practices for 100+ UI controls including DataGrid, Charts, Scheduler, and more.","skill_md_sha":"7803e1d80ca7baa23348fd8eebe916fded9935bb","skill_md_path":"skills/syncfusion-maui-picker/SKILL.md","default_branch":"master","skill_tree_url":"https://github.com/syncfusion/maui-ui-components-skills/tree/master/skills/syncfusion-maui-picker"},"layout":"multi","source":"github","category":"maui-ui-components-skills","frontmatter":{"name":"syncfusion-maui-picker","description":"Implements Syncfusion .NET MAUI Picker (SfPicker) control. Use when working with picker controls, item pickers, selection pickers, multi-column pickers, or dialog pickers in .NET MAUI applications. This skill covers installation, configuration, modes (Default, Dialog, RelativeDialog), header/footer customization, column handling, data binding, events, and accessibility."},"skills_sh_url":"https://skills.sh/syncfusion/maui-ui-components-skills/syncfusion-maui-picker"},"updatedAt":"2026-04-22T00:56:08.727Z"}}