public PickerHandler(NativeComponentRenderer renderer, MC.Picker pickerControl) : base(renderer, pickerControl)
{
PickerControl = pickerControl ?? throw new ArgumentNullException(nameof(pickerControl));
Initialize(renderer);
}
public SwipeTransitionModeGallery()
{
Title = "SwipeTransitionMode Gallery";
var scroll = new Microsoft.Maui.Controls.ScrollView();
var swipeLayout = new StackLayout
{
Margin = new Thickness(12)
};
var instructions = new Label
{
BackgroundColor = Colors.Black,
TextColor = Colors.White,
Text = "This Gallery use a Platform Specific only available for Android and iOS."
};
swipeLayout.Add(instructions);
var swipeItemSwipeTransitionModeLabel = new Label
{
FontSize = 10,
Text = "SwipeTransitionMode:"
};
swipeLayout.Add(swipeItemSwipeTransitionModeLabel);
var swipeItemSwipeTransitionModePicker = new Microsoft.Maui.Controls.Picker();
var swipeTransitionModes = Enum.GetNames(typeof(SwipeTransitionMode)).Select(t => t).ToList();
swipeItemSwipeTransitionModePicker.ItemsSource = swipeTransitionModes;
swipeItemSwipeTransitionModePicker.SelectedIndex = 0; // Reveal
swipeLayout.Add(swipeItemSwipeTransitionModePicker);
var deleteSwipeItem = new SwipeItem
{
BackgroundColor = Colors.Red,
IconImageSource = "calculator.png",
Text = "Delete"
};
deleteSwipeItem.Invoked += (sender, e) => { DisplayAlert("SwipeView", "Delete Invoked", "Ok"); };
var swipeItems = new SwipeItems {
deleteSwipeItem
};
swipeItems.Mode = SwipeMode.Reveal;
var leftSwipeContent = new Grid
{
BackgroundColor = Colors.Gray
};
var leftSwipeLabel = new Label
{
HorizontalOptions = LayoutOptions.Center,
VerticalOptions = LayoutOptions.Center,
Text = "Swipe to Right"
};
leftSwipeContent.Add(leftSwipeLabel);
var leftSwipeView = new Microsoft.Maui.Controls.SwipeView
{
HeightRequest = 60,
WidthRequest = 300,
LeftItems = swipeItems,
Content = leftSwipeContent
};
swipeLayout.Add(leftSwipeView);
var rightSwipeContent = new Grid
{
BackgroundColor = Colors.Gray
};
var rightSwipeLabel = new Label
{
HorizontalOptions = LayoutOptions.Center,
VerticalOptions = LayoutOptions.Center,
Text = "Swipe to Left"
};
rightSwipeContent.Add(rightSwipeLabel);
var rightSwipeView = new Microsoft.Maui.Controls.SwipeView
{
HeightRequest = 60,
WidthRequest = 300,
RightItems = swipeItems,
Content = rightSwipeContent
};
swipeLayout.Children.Add(rightSwipeView);
var topSwipeContent = new Grid
{
BackgroundColor = Colors.Gray
};
var topSwipeLabel = new Label
{
HorizontalOptions = LayoutOptions.Center,
VerticalOptions = LayoutOptions.Center,
Text = "Swipe to Top"
};
topSwipeContent.Add(topSwipeLabel);
var topSwipeView = new Microsoft.Maui.Controls.SwipeView
{
HeightRequest = 60,
WidthRequest = 300,
BottomItems = swipeItems,
Content = topSwipeContent
};
swipeLayout.Add(topSwipeView);
var bottomSwipeContent = new Grid
{
BackgroundColor = Colors.Gray
};
var bottomSwipeLabel = new Label
{
HorizontalOptions = LayoutOptions.Center,
VerticalOptions = LayoutOptions.Center,
Text = "Swipe to Bottom"
};
bottomSwipeContent.Add(bottomSwipeLabel);
var bottomSwipeView = new Microsoft.Maui.Controls.SwipeView
{
HeightRequest = 60,
WidthRequest = 300,
TopItems = swipeItems,
Content = bottomSwipeContent
};
swipeLayout.Add(bottomSwipeView);
swipeItemSwipeTransitionModePicker.SelectedIndexChanged += (sender, e) =>
{
var swipeTransitionMode = swipeItemSwipeTransitionModePicker.SelectedItem;
switch (swipeTransitionMode)
{
case "Drag":
leftSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.Android>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
leftSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.iOS>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
rightSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.Android>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
rightSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.iOS>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
topSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.Android>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
topSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.iOS>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
bottomSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.Android>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
bottomSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.iOS>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
break;
case "Reveal":
leftSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.Android>().SetSwipeTransitionMode(SwipeTransitionMode.Reveal);
leftSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.iOS>().SetSwipeTransitionMode(SwipeTransitionMode.Reveal);
rightSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.Android>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
rightSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.iOS>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
topSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.Android>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
topSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.iOS>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
bottomSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.Android>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
bottomSwipeView.On <Microsoft.Maui.Controls.PlatformConfiguration.iOS>().SetSwipeTransitionMode(SwipeTransitionMode.Drag);
break;
}
};
scroll.Content = swipeLayout;
Content = scroll;
}
public IndicatorCodeGallery()
{
Title = "IndicatorView Gallery";
//On<iOS>().SetLargeTitleDisplay(LargeTitleDisplayMode.Never);
var nItems = 10;
var layout = new Grid
{
RowDefinitions = new RowDefinitionCollection
{
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Star
},
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Auto
}
}
};
var itemsLayout = new LinearItemsLayout(ItemsLayoutOrientation.Horizontal)
{
SnapPointsType = SnapPointsType.MandatorySingle,
SnapPointsAlignment = SnapPointsAlignment.Center
};
var itemTemplate = ExampleTemplates.CarouselTemplate();
_carouselView = new CarouselView
{
ItemsLayout = itemsLayout,
ItemTemplate = itemTemplate,
BackgroundColor = Colors.LightGray,
AutomationId = "TheCarouselView"
};
layout.Children.Add(_carouselView);
var generator = new ItemsSourceGenerator(_carouselView, nItems, ItemsSourceType.ObservableCollection);
layout.Children.Add(generator);
generator.GenerateItems();
_carouselView.PropertyChanged += CarouselViewPropertyChanged;
(_carouselView.ItemsSource as ObservableCollection <CollectionViewGalleryTestItem>).CollectionChanged += IndicatorCodeGalleryCollectionChanged;
var indicatorView = new IndicatorView
{
HorizontalOptions = LayoutOptions.Center,
Margin = new Thickness(12, 6, 12, 12),
IndicatorColor = Colors.Gray,
SelectedIndicatorColor = Colors.Black,
IndicatorsShape = IndicatorShape.Square,
AutomationId = "TheIndicatorView",
Count = 5,
};
_carouselView.IndicatorView = indicatorView;
layout.Children.Add(indicatorView);
var stckColors = new StackLayout {
Orientation = StackOrientation.Horizontal
};
stckColors.Children.Add(new Label {
VerticalOptions = LayoutOptions.Center, Text = "IndicatorColor"
});
var colors = new List <string>
{
"Black",
"Blue",
"Red"
};
var colorsPicker = new Picker
{
ItemsSource = colors,
WidthRequest = 150
};
colorsPicker.SelectedIndex = 0;
colorsPicker.SelectedIndexChanged += (s, e) =>
{
var selectedIndex = colorsPicker.SelectedIndex;
switch (selectedIndex)
{
case 0:
indicatorView.IndicatorColor = Colors.Black;
break;
case 1:
indicatorView.IndicatorColor = Colors.Blue;
break;
case 2:
indicatorView.IndicatorColor = Colors.Red;
break;
}
};
stckColors.Children.Add(colorsPicker);
layout.Children.Add(stckColors);
var stckTemplate = new StackLayout {
Orientation = StackOrientation.Horizontal
};
stckTemplate.Children.Add(new Label {
VerticalOptions = LayoutOptions.Center, Text = "IndicatorTemplate"
});
var templates = new List <string>
{
"Circle",
"Square",
"Template"
};
var templatePicker = new Picker
{
ItemsSource = templates,
WidthRequest = 150,
TextColor = Colors.Black
};
templatePicker.SelectedIndexChanged += (s, e) =>
{
var selectedIndex = templatePicker.SelectedIndex;
switch (selectedIndex)
{
case 0:
indicatorView.IndicatorTemplate = null;
indicatorView.IndicatorsShape = IndicatorShape.Circle;
break;
case 1:
indicatorView.IndicatorTemplate = null;
indicatorView.IndicatorsShape = IndicatorShape.Square;
break;
case 2:
indicatorView.IndicatorTemplate = ExampleTemplates.IndicatorTemplate();
break;
}
};
templatePicker.SelectedIndex = 0;
stckTemplate.Children.Add(templatePicker);
layout.Children.Add(stckTemplate);
var stckSize = new StackLayout {
Orientation = StackOrientation.Horizontal
};
stckSize.Children.Add(new Label {
VerticalOptions = LayoutOptions.Center, Text = "Indicator Size"
});
//indicatorView.IndicatorSize = 25;
var sizeSlider = new Slider
{
WidthRequest = 150,
Value = indicatorView.IndicatorSize,
Maximum = 50,
};
sizeSlider.ValueChanged += (s, e) =>
{
var indicatorSize = sizeSlider.Value;
indicatorView.IndicatorSize = indicatorSize;
};
stckSize.Children.Add(sizeSlider);
layout.Children.Add(stckSize);
Grid.SetRow(generator, 0);
Grid.SetRow(stckColors, 1);
Grid.SetRow(stckTemplate, 2);
Grid.SetRow(stckSize, 3);
Grid.SetRow(_carouselView, 4);
Grid.SetRow(indicatorView, 6);
var layoutBtn = new StackLayout
{
Orientation = StackOrientation.Horizontal,
HorizontalOptions = LayoutOptions.Center,
};
var btnRemove = new Button
{
Text = "DEL First",
FontSize = 8,
AutomationId = "btnRemoveFirst",
BackgroundColor = Colors.LightGray,
Padding = new Thickness(5),
Command = new Command(() =>
{
var items = (_carouselView.ItemsSource as ObservableCollection <CollectionViewGalleryTestItem>);
items.Remove(items[0]);
})
};
_btnPrev = new Button
{
Text = "Prev",
FontSize = 8,
AutomationId = "btnPrev",
BackgroundColor = Colors.LightGray,
Padding = new Thickness(5),
Command = new Command(() =>
{
_carouselView.Position--;
}, () =>
{
return(_carouselView.Position > 0);
})
};
_btnNext = new Button
{
Text = "Next",
FontSize = 8,
AutomationId = "btnNext",
BackgroundColor = Colors.LightGray,
Padding = new Thickness(5),
Command = new Command(() =>
{
_carouselView.Position++;
}, () =>
{
var items = (_carouselView.ItemsSource as ObservableCollection <CollectionViewGalleryTestItem>);
return(_carouselView.Position < items.Count - 1);
})
};
var btnRemoveLast = new Button
{
Text = "DEL Last",
FontSize = 8,
AutomationId = "btnRemoveLast",
BackgroundColor = Colors.LightGray,
Padding = new Thickness(5),
Command = new Command(() =>
{
var items = (_carouselView.ItemsSource as ObservableCollection <CollectionViewGalleryTestItem>);
var indexToRemove = items.Count - 1;
items.Remove(items[indexToRemove]);
})
};
layoutBtn.Children.Add(btnRemove);
layoutBtn.Children.Add(_btnPrev);
layoutBtn.Children.Add(_btnNext);
layoutBtn.Children.Add(btnRemoveLast);
layout.Children.Add(layoutBtn);
Grid.SetRow(layoutBtn, 5);
Content = layout;
}
public CarouselSnapGallery()
{
//On<iOS>().SetLargeTitleDisplay(LargeTitleDisplayMode.Never);
var viewModel = new CarouselItemsGalleryViewModel(false, false);
Title = $"CarouselView Snap Options";
var layout = new Grid
{
RowDefinitions = new RowDefinitionCollection
{
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Star
}
}
};
var snapPointsStack = new StackLayout
{
Margin = new Thickness(12)
};
var snapPointsLabel = new Label {
FontSize = 10, Text = "SnapPointsType:"
};
var snapPointsTypes = Enum.GetNames(typeof(SnapPointsType)).Select(b => b).ToList();
var snapPointsTypePicker = new Microsoft.Maui.Controls.Picker
{
ItemsSource = snapPointsTypes,
SelectedItem = snapPointsTypes[1]
};
snapPointsStack.Children.Add(snapPointsLabel);
snapPointsStack.Children.Add(snapPointsTypePicker);
layout.Children.Add(snapPointsStack);
var snapPointsAlignmentsStack = new StackLayout
{
Margin = new Thickness(12)
};
var snapPointsAlignmentsLabel = new Label {
FontSize = 10, Text = "SnapPointsAlignment:"
};
var snapPointsAlignments = Enum.GetNames(typeof(SnapPointsAlignment)).Select(b => b).ToList();
var snapPointsAlignmentPicker = new Picker
{
ItemsSource = snapPointsAlignments,
SelectedItem = snapPointsAlignments[0]
};
snapPointsAlignmentsStack.Children.Add(snapPointsAlignmentsLabel);
snapPointsAlignmentsStack.Children.Add(snapPointsAlignmentPicker);
Grid.SetRow(snapPointsAlignmentsStack, 1);
layout.Children.Add(snapPointsAlignmentsStack);
var itemsLayout = new LinearItemsLayout(ItemsLayoutOrientation.Horizontal)
{
SnapPointsType = SnapPointsType.Mandatory,
SnapPointsAlignment = SnapPointsAlignment.Start
};
var itemTemplate = GetCarouselTemplate();
var carouselView = new CarouselView
{
ItemsSource = viewModel.Items,
ItemsLayout = itemsLayout,
ItemTemplate = itemTemplate,
BackgroundColor = Colors.LightGray,
PeekAreaInsets = new Thickness(0, 0, 100, 0),
Margin = new Thickness(12),
AutomationId = "TheCarouselView"
};
Grid.SetRow(carouselView, 2);
layout.Children.Add(carouselView);
snapPointsTypePicker.SelectedIndexChanged += (sender, e) =>
{
if (carouselView.ItemsLayout is LinearItemsLayout linearItemsLayout)
{
Enum.TryParse(snapPointsTypePicker.SelectedItem.ToString(), out SnapPointsType snapPointsType);
linearItemsLayout.SnapPointsType = snapPointsType;
}
};
snapPointsAlignmentPicker.SelectedIndexChanged += (sender, e) =>
{
if (carouselView.ItemsLayout is LinearItemsLayout linearItemsLayout)
{
Enum.TryParse(snapPointsAlignmentPicker.SelectedItem.ToString(), out SnapPointsAlignment snapPointsAlignment);
linearItemsLayout.SnapPointsAlignment = snapPointsAlignment;
}
};
Content = layout;
BindingContext = viewModel;
}