public TextCodeCollectionViewGallery(IItemsLayout itemsLayout)
{
var layout = new Grid
{
RowDefinitions = new RowDefinitionCollection
{
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Star
}
}
};
var collectionView = new CollectionView
{
ItemsLayout = itemsLayout,
SelectionMode = SelectionMode.Single,
AutomationId = "collectionview"
};
var generator = new ItemsSourceGenerator(collectionView);
layout.Children.Add(generator);
layout.Children.Add(collectionView);
Grid.SetRow(collectionView, 1);
Content = layout;
generator.GenerateItems();
}
public VariableSizeTemplateGridGallery(ItemsLayoutOrientation orientation = ItemsLayoutOrientation.Vertical)
{
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.Star
}
}
};
var itemsLayout = new GridItemsLayout(2, orientation);
var itemTemplate = ExampleTemplates.VariableSizeTemplate();
var collectionView = new CollectionView
{
ItemsLayout = itemsLayout,
ItemTemplate = itemTemplate,
ItemSizingStrategy = ItemSizingStrategy.MeasureFirstItem
};
var generator = new ItemsSourceGenerator(collectionView, 100);
var explanation = new Label();
UpdateExplanation(explanation, collectionView.ItemSizingStrategy);
var sizingStrategySelector = new EnumSelector <ItemSizingStrategy>(() => collectionView.ItemSizingStrategy,
mode =>
{
collectionView.ItemSizingStrategy = mode;
UpdateExplanation(explanation, collectionView.ItemSizingStrategy);
});
layout.Children.Add(generator);
layout.Children.Add(sizingStrategySelector);
Grid.SetRow(sizingStrategySelector, 1);
layout.Children.Add(explanation);
Grid.SetRow(explanation, 2);
layout.Children.Add(collectionView);
Grid.SetRow(collectionView, 3);
Content = layout;
generator.GenerateItems();
}
public TemplateCodeCollectionViewGallery(IItemsLayout itemsLayout)
{
var layout = new Grid
{
RowDefinitions = new RowDefinitionCollection
{
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Star
}
}
};
var itemTemplate = ExampleTemplates.PhotoTemplate();
var collectionView = new CollectionView
{
ItemsLayout = itemsLayout,
ItemTemplate = itemTemplate
};
var generator = new ItemsSourceGenerator(collectionView, initialItems: 20);
layout.Children.Add(generator);
layout.Children.Add(collectionView);
Grid.SetRow(collectionView, 1);
Content = layout;
generator.GenerateItems();
}
public SpacingGallery(IItemsLayout itemsLayout)
{
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.Star
}
}
};
var instructions = new Label
{
Text = "Use the control below to update the spacing between items."
};
if (itemsLayout is GridItemsLayout)
{
instructions.Text += " Format is '[vertical], [horizontal]'";
}
var itemTemplate = ExampleTemplates.SpacingTemplate();
var collectionView = new CollectionView
{
ItemsLayout = itemsLayout,
ItemTemplate = itemTemplate,
AutomationId = "collectionview",
Margin = 10
};
var generator = new ItemsSourceGenerator(collectionView, initialItems: 20);
var spacingModifier = new SpacingModifier(collectionView.ItemsLayout, "Update_Spacing");
layout.Children.Add(generator);
layout.Children.Add(instructions);
layout.Children.Add(spacingModifier);
layout.Children.Add(collectionView);
Grid.SetRow(instructions, 1);
Grid.SetRow(spacingModifier, 2);
Grid.SetRow(collectionView, 3);
Content = layout;
generator.GenerateItems();
}
async void UpdateItemsSourceType(ItemsSourceGenerator generator, ItemsSourceType itemsSourceType, CollectionView collectionView)
{
generator.GenerateItems(itemsSourceType);
if (Device.RuntimePlatform == Device.UWP && !(collectionView.ItemsSource is INotifyCollectionChanged))
{
await DisplayAlert("Warning!", "Reordering on UWP/WinUI only works with ObservableCollections!", "OK");
}
}
private static void ObjectItemsSourceChanged(object control, AttachedMemberChangedEventArgs <IEnumerable> args)
{
var generator = control.GetBindingMemberValue(ItemsSourceGeneratorBase.MemberDescriptor);
if (generator == null)
{
generator = new ItemsSourceGenerator(control);
control.SetBindingMemberValue(ItemsSourceGeneratorBase.MemberDescriptor, generator);
}
generator.SetItemsSource(args.NewValue);
}
public CarouselCodeGallery(ItemsLayoutOrientation orientation)
{
Title = $"CarouselView (Code, {orientation})";
var layout = new Grid
{
RowDefinitions = new RowDefinitionCollection
{
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Star
}
}
};
var itemsLayout =
new ListItemsLayout(orientation)
{
SnapPointsType = SnapPointsType.MandatorySingle,
SnapPointsAlignment = SnapPointsAlignment.Center
};
var itemTemplate = ExampleTemplates.CarouselTemplate();
var carouselView = new CarouselView
{
ItemsLayout = itemsLayout,
ItemTemplate = itemTemplate,
};
var generator = new ItemsSourceGenerator(carouselView, initialItems: 50);
layout.Children.Add(generator);
var scrollToControl = new ScrollToIndexControl(carouselView, false);
layout.Children.Add(scrollToControl);
layout.Children.Add(carouselView);
Grid.SetRow(scrollToControl, 1);
Grid.SetRow(carouselView, 2);
Content = layout;
generator.GenerateItems();
}
public DynamicItemSizeGallery(IItemsLayout itemsLayout)
{
var layout = new Grid
{
RowDefinitions = new RowDefinitionCollection
{
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Star
}
}
};
var instructions = new Label
{
Text = "Tap the buttons in each item to increase/decrease the amount of text. The items should expand and contract to accommodate the text."
};
var itemTemplate = ExampleTemplates.DynamicTextTemplate();
var collectionView = new CollectionView
{
ItemsLayout = itemsLayout,
ItemTemplate = itemTemplate,
AutomationId = "collectionview"
};
var generator = new ItemsSourceGenerator(collectionView, initialItems: 20);
layout.Children.Add(generator);
layout.Children.Add(instructions);
layout.Children.Add(collectionView);
Grid.SetRow(instructions, 1);
Grid.SetRow(collectionView, 2);
Content = layout;
generator.GenerateItems();
}
public ObservableCollectionResetGallery()
{
var layout = new Grid
{
RowDefinitions = new RowDefinitionCollection
{
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Star
}
}
};
var itemsLayout = new GridItemsLayout(3, ItemsLayoutOrientation.Vertical) as IItemsLayout;
var itemTemplate = ExampleTemplates.PhotoTemplate();
var collectionView = new CollectionView {
ItemsLayout = itemsLayout, ItemTemplate = itemTemplate
};
var generator = new ItemsSourceGenerator(collectionView, 100, ItemsSourceType.MultiTestObservableCollection);
layout.Children.Add(generator);
var resetter = new Resetter(collectionView);
layout.Children.Add(resetter);
Grid.SetRow(resetter, 1);
layout.Children.Add(collectionView);
Grid.SetRow(collectionView, 2);
Content = layout;
generator.GenerateItems();
}
public TemplateCodeCollectionViewGridGallery(ItemsLayoutOrientation orientation = ItemsLayoutOrientation.Vertical)
{
var layout = new Grid
{
RowDefinitions = new RowDefinitionCollection
{
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Star
}
}
};
var itemsLayout = new GridItemsLayout(2, orientation);
var itemTemplate = ExampleTemplates.PhotoTemplate();
var collectionView = new CollectionView {
ItemsLayout = itemsLayout, ItemTemplate = itemTemplate, AutomationId = "collectionview"
};
var generator = new ItemsSourceGenerator(collectionView, 100);
var spanSetter = new SpanSetter(collectionView);
layout.Children.Add(generator);
layout.Children.Add(spanSetter);
Grid.SetRow(spanSetter, 1);
layout.Children.Add(collectionView);
Grid.SetRow(collectionView, 2);
Content = layout;
spanSetter.UpdateSpan();
generator.GenerateItems();
}
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 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
}
}
};
var itemsLayout = new LinearItemsLayout(ItemsLayoutOrientation.Horizontal)
{
SnapPointsType = SnapPointsType.MandatorySingle,
SnapPointsAlignment = SnapPointsAlignment.Center
};
var itemTemplate = ExampleTemplates.CarouselTemplate();
var carouselView = new CarouselView
{
ItemsLayout = itemsLayout,
ItemTemplate = itemTemplate,
BackgroundColor = Color.LightGray,
AutomationId = "TheCarouselView"
};
layout.Children.Add(carouselView);
var generator = new ItemsSourceGenerator(carouselView, nItems, ItemsSourceType.ObservableCollection);
layout.Children.Add(generator);
generator.GenerateItems();
var indicatorView = new IndicatorView
{
HorizontalOptions = LayoutOptions.Center,
Margin = new Thickness(12, 6, 12, 12),
IndicatorColor = Color.Gray,
SelectedIndicatorColor = Color.Black,
IndicatorsShape = IndicatorShape.Square,
AutomationId = "TheIndicatorView"
};
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 = Color.Black;
break;
case 1:
indicatorView.IndicatorColor = Color.Blue;
break;
case 2:
indicatorView.IndicatorColor = Color.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 = Color.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, 5);
Content = layout;
}
public PropagateCodeGallery(IItemsLayout itemsLayout)
{
Title = $"Propagate FlowDirection=RTL";
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.Star
}
},
FlowDirection = FlowDirection.RightToLeft,
Visual = VisualMarker.Material
};
var itemTemplate = ExampleTemplates.PropagationTemplate();
var collectionView = new CollectionView
{
ItemsLayout = itemsLayout,
ItemTemplate = itemTemplate,
};
var generator = new ItemsSourceGenerator(collectionView, initialItems: 2);
layout.Children.Add(generator);
var instructions = new Label();
UpdateInstructions(layout, instructions);
Grid.SetRow(instructions, 2);
layout.Children.Add(instructions);
var switchLabel = new Label {
Text = "Toggle FlowDirection"
};
var switchLayout = new StackLayout {
Orientation = StackOrientation.Horizontal
};
var updateSwitch = new Switch {
};
updateSwitch.Toggled += (sender, args) =>
{
layout.FlowDirection = layout.FlowDirection == FlowDirection.RightToLeft
? FlowDirection.LeftToRight
: FlowDirection.RightToLeft;
UpdateInstructions(layout, instructions);
};
switchLayout.Children.Add(switchLabel);
switchLayout.Children.Add(updateSwitch);
Grid.SetRow(switchLayout, 1);
layout.Children.Add(switchLayout);
layout.Children.Add(collectionView);
Grid.SetRow(collectionView, 3);
Content = layout;
generator.GenerateItems();
}
private static void ObjectItemsSourceChanged(object control, AttachedMemberChangedEventArgs<IEnumerable> args)
{
var generator = control.GetBindingMemberValue(ItemsSourceGeneratorBase.MemberDescriptor);
if (generator == null)
{
generator = new ItemsSourceGenerator(control);
control.SetBindingMemberValue(ItemsSourceGeneratorBase.MemberDescriptor, generator);
}
generator.SetItemsSource(args.NewValue);
}
public UngroupedReorderingGallery(IItemsLayout itemsLayout)
{
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.Auto
},
new RowDefinition {
Height = GridLength.Star
}
}
};
var reorderCompletedLabel = new Label
{
Text = "ReorderCompleted (event): NA",
};
var itemTemplate = ExampleTemplates.SpacingTemplate();
var collectionView = new CollectionView
{
ItemsLayout = itemsLayout,
ItemTemplate = itemTemplate,
AutomationId = "collectionview",
CanReorderItems = true
};
collectionView.ReorderCompleted += (sender, e) => reorderCompletedLabel.Text = $"ReorderCompleted (event): {DateTime.Now}";
var generator = new ItemsSourceGenerator(collectionView, initialItems: 20, itemsSourceType: ItemsSourceType.ObservableCollection);
var itemsSourceTypeSelector = new EnumSelector <ItemsSourceType>(() => generator.ItemsSourceType, sourceType => UpdateItemsSourceType(generator, sourceType, collectionView));
var spacingModifier = new SpacingModifier(collectionView.ItemsLayout, "Update_Spacing");
var reloadButton = new Button {
Text = "Reload Current Source", AutomationId = "btnReload", HorizontalOptions = LayoutOptions.Start
};
reloadButton.Clicked += (sender, e) => ReloadItemsSource(collectionView);
layout.Children.Add(generator);
layout.Children.Add(itemsSourceTypeSelector);
layout.Children.Add(spacingModifier);
layout.Children.Add(reorderCompletedLabel);
layout.Children.Add(reloadButton);
layout.Children.Add(collectionView);
Grid.SetRow(itemsSourceTypeSelector, 1);
Grid.SetRow(spacingModifier, 2);
Grid.SetRow(reorderCompletedLabel, 3);
Grid.SetRow(reloadButton, 4);
Grid.SetRow(collectionView, 5);
Content = layout;
generator.GenerateItems();
}
public ObservableCodeCollectionViewGallery(ItemsLayoutOrientation orientation = ItemsLayoutOrientation.Vertical,
bool grid = true, int initialItems = 1000, bool addItemsWithTimer = false, ItemsUpdatingScrollMode scrollMode = ItemsUpdatingScrollMode.KeepItemsInView)
{
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.Auto
},
new RowDefinition {
Height = GridLength.Auto
},
new RowDefinition {
Height = GridLength.Star
}
}
};
IItemsLayout itemsLayout = grid
? new GridItemsLayout(3, orientation)
: new LinearItemsLayout(orientation) as IItemsLayout;
var itemTemplate = ExampleTemplates.PhotoTemplate();
var collectionView = new CollectionView {
ItemsLayout = itemsLayout, ItemTemplate = itemTemplate,
AutomationId = "collectionview", Header = "This is the header", ItemsUpdatingScrollMode = scrollMode
};
var generator = new ItemsSourceGenerator(collectionView, initialItems, ItemsSourceType.ObservableCollection);
var remover = new ItemRemover(collectionView);
var adder = new ItemAdder(collectionView);
var replacer = new ItemReplacer(collectionView);
var mover = new ItemMover(collectionView);
var inserter = new ItemInserter(collectionView);
layout.Children.Add(generator);
layout.Children.Add(remover);
Grid.SetRow(remover, 1);
layout.Children.Add(adder);
Grid.SetRow(adder, 2);
layout.Children.Add(replacer);
Grid.SetRow(replacer, 3);
layout.Children.Add(mover);
Grid.SetRow(mover, 4);
layout.Children.Add(inserter);
Grid.SetRow(inserter, 5);
layout.Children.Add(collectionView);
Grid.SetRow(collectionView, 6);
Content = layout;
if (addItemsWithTimer)
{
generator.GenerateEmptyObservableCollectionAndAddItemsEverySecond();
}
else
{
generator.GenerateItems();
}
}
public ObservableCodeCollectionViewGallery(ItemsLayoutOrientation orientation = ItemsLayoutOrientation.Vertical,
bool grid = true)
{
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.Auto
},
new RowDefinition {
Height = GridLength.Star
}
}
};
IItemsLayout itemsLayout = grid
? new GridItemsLayout(3, orientation)
: new ListItemsLayout(orientation) as IItemsLayout;
var itemTemplate = ExampleTemplates.PhotoTemplate();
var collectionView = new CollectionView {
ItemsLayout = itemsLayout, ItemTemplate = itemTemplate
};
var generator = new ItemsSourceGenerator(collectionView);
var remover = new ItemRemover(collectionView);
var adder = new ItemAdder(collectionView);
var replacer = new ItemReplacer(collectionView);
var mover = new ItemMover(collectionView);
layout.Children.Add(generator);
layout.Children.Add(remover);
Grid.SetRow(remover, 1);
layout.Children.Add(adder);
Grid.SetRow(adder, 2);
layout.Children.Add(replacer);
Grid.SetRow(replacer, 3);
layout.Children.Add(mover);
Grid.SetRow(mover, 4);
layout.Children.Add(collectionView);
Grid.SetRow(collectionView, 5);
Content = layout;
generator.GenerateObservableCollection();
}
public SnapPointsCodeGallery(ItemsLayout itemsLayout)
{
Title = $"Snap Points (Code, {itemsLayout})";
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
}
}
};
itemsLayout.SnapPointsAlignment = SnapPointsAlignment.Start;
itemsLayout.SnapPointsType = SnapPointsType.None;
var itemTemplate = ExampleTemplates.SnapPointsTemplate();
var collectionView = new CollectionView
{
ItemsLayout = itemsLayout,
ItemTemplate = itemTemplate,
};
var generator = new ItemsSourceGenerator(collectionView, initialItems: 50);
var snapPointsTypeSelector = new EnumSelector <SnapPointsType>(() => itemsLayout.SnapPointsType,
type => itemsLayout.SnapPointsType = type);
var snapPointsAlignmentSelector = new EnumSelector <SnapPointsAlignment>(() => itemsLayout.SnapPointsAlignment,
type => itemsLayout.SnapPointsAlignment = type);
var flowDirectionSelector = new EnumSelector <FlowDirection>(() => layout.FlowDirection,
type => layout.FlowDirection = type);
layout.Children.Add(generator);
layout.Children.Add(snapPointsTypeSelector);
layout.Children.Add(snapPointsAlignmentSelector);
layout.Children.Add(flowDirectionSelector);
layout.Children.Add(collectionView);
Grid.SetRow(snapPointsTypeSelector, 1);
Grid.SetRow(snapPointsAlignmentSelector, 2);
Grid.SetRow(flowDirectionSelector, 3);
Grid.SetRow(collectionView, 4);
Content = layout;
generator.GenerateItems();
}
private static void ObjectItemsSourceChanged(object control, AttachedMemberChangedEventArgs <IEnumerable> args)
{
ItemsSourceGenerator.GetOrAdd(control).SetItemsSource(args.NewValue);
}
public CarouselCodeGallery(ItemsLayoutOrientation orientation)
{
On <iOS>().SetLargeTitleDisplay(LargeTitleDisplayMode.Never);
_scrollInfoLabel.MaxLines = 1;
_scrollInfoLabel.LineBreakMode = LineBreakMode.TailTruncation;
_orientation = orientation;
Title = $"CarouselView (Code, {orientation})";
var nItems = 5;
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
}
}
};
var itemsLayout =
new LinearItemsLayout(orientation)
{
SnapPointsType = SnapPointsType.MandatorySingle,
SnapPointsAlignment = SnapPointsAlignment.Center
};
var itemTemplate = ExampleTemplates.CarouselTemplate();
var carouselView = new CarouselView
{
ItemsLayout = itemsLayout,
ItemTemplate = itemTemplate,
Position = 2,
Margin = new Thickness(0, 10, 0, 10),
BackgroundColor = Color.LightGray,
AutomationId = "TheCarouselView"
};
if (orientation == ItemsLayoutOrientation.Horizontal)
{
carouselView.PeekAreaInsets = new Thickness(30, 0, 30, 0);
}
else
{
carouselView.PeekAreaInsets = new Thickness(0, 30, 0, 30);
}
carouselView.Scrolled += CarouselView_Scrolled;
StackLayout stacklayoutInfo = GetReadOnlyInfo(carouselView);
var generator = new ItemsSourceGenerator(carouselView, initialItems: nItems, itemsSourceType: ItemsSourceType.ObservableCollection);
layout.Children.Add(generator);
var positionControl = new PositionControl(carouselView, nItems);
layout.Children.Add(positionControl);
var spacingModifier = new SpacingModifier(carouselView.ItemsLayout, "Update Spacing");
layout.Children.Add(spacingModifier);
layout.Children.Add(stacklayoutInfo);
var stckPeek = new StackLayout {
Orientation = StackOrientation.Horizontal
};
stckPeek.Children.Add(new Label {
Text = "Peek"
});
var padi = new Slider
{
Maximum = 100,
Minimum = 0,
Value = 30,
WidthRequest = 100,
BackgroundColor = Color.Pink
};
padi.ValueChanged += (s, e) => {
var peek = padi.Value;
if (orientation == ItemsLayoutOrientation.Horizontal)
{
carouselView.PeekAreaInsets = new Thickness(peek, 0, peek, 0);
}
else
{
carouselView.PeekAreaInsets = new Thickness(0, peek, 0, peek);
}
};
stckPeek.Children.Add(padi);
stacklayoutInfo.Children.Add(stckPeek);
stacklayoutInfo.Children.Add(_scrollInfoLabel);
var content = new Grid();
content.Children.Add(carouselView);
#if DEBUG
// Uncomment this line to add a helper to visualize the center of each element.
//content.Children.Add(CreateDebuggerLines());
#endif
layout.Children.Add(content);
Grid.SetRow(positionControl, 1);
Grid.SetRow(stacklayoutInfo, 2);
Grid.SetRow(spacingModifier, 3);
Grid.SetRow(content, 4);
Content = layout;
generator.CollectionChanged += (sender, e) => {
positionControl.UpdatePositionCount(generator.Count);
};
generator.GenerateItems();
}
public ObservableMultiItemCollectionViewGallery(ItemsLayoutOrientation orientation = ItemsLayoutOrientation.Vertical,
bool grid = true, int initialItems = 1000, bool withIndex = false)
{
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.Auto
},
new RowDefinition {
Height = GridLength.Star
}
}
};
var itemsLayout = grid
? new GridItemsLayout(3, orientation)
: new ListItemsLayout(orientation) as IItemsLayout;
var itemTemplate = ExampleTemplates.PhotoTemplate();
var collectionView = new CollectionView {
ItemsLayout = itemsLayout, ItemTemplate = itemTemplate, AutomationId = "collectionview"
};
var generator = new ItemsSourceGenerator(collectionView, initialItems, ItemsSourceType.MultiTestObservableCollection);
var remover = new MultiItemRemover(collectionView, withIndex);
var adder = new MultiItemAdder(collectionView, withIndex);
var replacer = new MultiItemReplacer(collectionView);
var mover = new MultiItemMover(collectionView);
layout.Children.Add(generator);
layout.Children.Add(remover);
Grid.SetRow(remover, 1);
layout.Children.Add(adder);
Grid.SetRow(adder, 2);
layout.Children.Add(replacer);
Grid.SetRow(replacer, 3);
layout.Children.Add(mover);
Grid.SetRow(mover, 4);
layout.Children.Add(collectionView);
Grid.SetRow(collectionView, 5);
Content = layout;
generator.GenerateItems();
}
