Dave Friedel
01270c6938
Complete ShellDemo application demonstrating all MAUI controls: - App/AppShell: Shell navigation with flyout menu - HomePage: Feature cards, theme toggle, quick actions - ButtonsPage: Button styles, states, variations, event logging - TextInputPage: Entry, Editor, SearchBar with keyboard shortcuts - SelectionPage: CheckBox, Switch, Slider with colored variants - PickersPage: Picker, DatePicker, TimePicker demos - ListsPage: CollectionView with fruits, colors, contacts - ProgressPage: ProgressBar, ActivityIndicator, interactive demo - GridsPage: Grid layouts - auto/star/absolute sizing, spans, nesting - AboutPage: OpenMaui Linux information - DetailPage: Push/pop navigation demo All pages use proper XAML with code-behind following MAUI patterns. 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
143 lines
7.2 KiB
XML
143 lines
7.2 KiB
XML
<?xml version="1.0" encoding="utf-8" ?>
|
|
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
|
|
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
|
|
x:Class="ShellDemo.Pages.PickersPage"
|
|
Title="Pickers"
|
|
BackgroundColor="{StaticResource PageBackground}">
|
|
|
|
<Grid RowDefinitions="*,Auto">
|
|
<ScrollView Grid.Row="0">
|
|
<VerticalStackLayout Padding="20" Spacing="20">
|
|
|
|
<Label Text="Picker Controls" FontSize="24" FontAttributes="Bold" />
|
|
|
|
<!-- Picker Section -->
|
|
<Border BackgroundColor="{StaticResource CardBackground}"
|
|
Stroke="{StaticResource BorderColor}"
|
|
StrokeThickness="1"
|
|
Padding="16">
|
|
<Border.StrokeShape>
|
|
<RoundRectangle CornerRadius="8" />
|
|
</Border.StrokeShape>
|
|
<VerticalStackLayout Spacing="15">
|
|
<Label Text="Picker" FontSize="16" FontAttributes="Bold" />
|
|
|
|
<Picker x:Name="FruitPicker"
|
|
Title="Select a fruit"
|
|
SelectedIndexChanged="OnFruitPickerChanged">
|
|
<Picker.ItemsSource>
|
|
<x:Array Type="{x:Type x:String}">
|
|
<x:String>Apple</x:String>
|
|
<x:String>Banana</x:String>
|
|
<x:String>Cherry</x:String>
|
|
<x:String>Date</x:String>
|
|
<x:String>Elderberry</x:String>
|
|
<x:String>Fig</x:String>
|
|
<x:String>Grape</x:String>
|
|
</x:Array>
|
|
</Picker.ItemsSource>
|
|
</Picker>
|
|
<Label x:Name="FruitSelectedLabel" Text="Selected: (none)" TextColor="{StaticResource TextSecondary}" />
|
|
|
|
<Label Text="With Default Selection:" FontSize="12" Margin="0,10,0,0" />
|
|
<Picker x:Name="ColorPicker"
|
|
Title="Select a color"
|
|
SelectedIndex="2"
|
|
SelectedIndexChanged="OnColorPickerChanged">
|
|
<Picker.ItemsSource>
|
|
<x:Array Type="{x:Type x:String}">
|
|
<x:String>Red</x:String>
|
|
<x:String>Green</x:String>
|
|
<x:String>Blue</x:String>
|
|
<x:String>Yellow</x:String>
|
|
<x:String>Purple</x:String>
|
|
</x:Array>
|
|
</Picker.ItemsSource>
|
|
</Picker>
|
|
|
|
<Label Text="Styled Picker:" FontSize="12" Margin="0,10,0,0" />
|
|
<Picker Title="Select size"
|
|
TextColor="DarkBlue"
|
|
TitleColor="Gray"
|
|
SelectedIndexChanged="OnSizePickerChanged">
|
|
<Picker.ItemsSource>
|
|
<x:Array Type="{x:Type x:String}">
|
|
<x:String>Small</x:String>
|
|
<x:String>Medium</x:String>
|
|
<x:String>Large</x:String>
|
|
<x:String>Extra Large</x:String>
|
|
</x:Array>
|
|
</Picker.ItemsSource>
|
|
</Picker>
|
|
</VerticalStackLayout>
|
|
</Border>
|
|
|
|
<!-- DatePicker Section -->
|
|
<Border BackgroundColor="{StaticResource CardBackground}"
|
|
Stroke="{StaticResource BorderColor}"
|
|
StrokeThickness="1"
|
|
Padding="16">
|
|
<Border.StrokeShape>
|
|
<RoundRectangle CornerRadius="8" />
|
|
</Border.StrokeShape>
|
|
<VerticalStackLayout Spacing="15">
|
|
<Label Text="DatePicker" FontSize="16" FontAttributes="Bold" />
|
|
|
|
<DatePicker x:Name="BasicDatePicker" DateSelected="OnDateSelected" />
|
|
<Label x:Name="DateSelectedLabel" Text="Selected date will appear here" TextColor="{StaticResource TextSecondary}" />
|
|
|
|
<Label Text="With Date Range (this month only):" FontSize="12" Margin="0,10,0,0" />
|
|
<DatePicker x:Name="RangeDatePicker" DateSelected="OnRangeDateSelected" />
|
|
|
|
<Label Text="Styled DatePicker:" FontSize="12" Margin="0,10,0,0" />
|
|
<DatePicker TextColor="DarkGreen" DateSelected="OnStyledDateSelected" />
|
|
</VerticalStackLayout>
|
|
</Border>
|
|
|
|
<!-- TimePicker Section -->
|
|
<Border BackgroundColor="{StaticResource CardBackground}"
|
|
Stroke="{StaticResource BorderColor}"
|
|
StrokeThickness="1"
|
|
Padding="16">
|
|
<Border.StrokeShape>
|
|
<RoundRectangle CornerRadius="8" />
|
|
</Border.StrokeShape>
|
|
<VerticalStackLayout Spacing="15">
|
|
<Label Text="TimePicker" FontSize="16" FontAttributes="Bold" />
|
|
|
|
<TimePicker x:Name="BasicTimePicker" PropertyChanged="OnTimeChanged" />
|
|
<Label x:Name="TimeSelectedLabel" Text="Selected time will appear here" TextColor="{StaticResource TextSecondary}" />
|
|
|
|
<Label Text="Styled TimePicker:" FontSize="12" Margin="0,10,0,0" />
|
|
<TimePicker Time="14:30:00" TextColor="DarkBlue" PropertyChanged="OnStyledTimeChanged" />
|
|
|
|
<Label Text="Alarm Time:" FontSize="12" Margin="0,10,0,0" />
|
|
<HorizontalStackLayout Spacing="10">
|
|
<TimePicker x:Name="AlarmTimePicker" Time="07:00:00" />
|
|
<Button Text="Set Alarm"
|
|
BackgroundColor="Orange"
|
|
TextColor="White"
|
|
Clicked="OnSetAlarmClicked" />
|
|
</HorizontalStackLayout>
|
|
</VerticalStackLayout>
|
|
</Border>
|
|
|
|
</VerticalStackLayout>
|
|
</ScrollView>
|
|
|
|
<!-- Event Log Panel -->
|
|
<Border Grid.Row="1" BackgroundColor="#F5F5F5" Padding="12" StrokeThickness="0">
|
|
<VerticalStackLayout>
|
|
<Label Text="Event Log:" FontSize="12" FontAttributes="Bold" />
|
|
<ScrollView HeightRequest="60">
|
|
<Label x:Name="EventLog"
|
|
Text="Events will appear here..."
|
|
FontSize="11"
|
|
TextColor="{StaticResource TextSecondary}"
|
|
LineBreakMode="WordWrap" />
|
|
</ScrollView>
|
|
</VerticalStackLayout>
|
|
</Border>
|
|
</Grid>
|
|
</ContentPage>
|