Hey there,
What I'm trying to do is make SfCarousel look like that:
What I did was creating a Label inside ScrollView, then creating a Frame with Black BorderColor to achieve the aesthetics.
The SfCarousel is inside a Grid row with "*" Row Height Definition (with 2 other rows of 60)
C#:
SfCarousel carousel = new SfCarousel() { ViewMode = ViewMode.Linear};
ObservableCollection<SfCarouselItem> collectionOfItems = new ObservableCollection<SfCarouselItem>();
Frame frame = new Frame() { BackgroundColor = Color.Transparent, BorderColor = Color.Black, HorizontalOptions = LayoutOptions.CenterAndExpand,
VerticalOptions = LayoutOptions.CenterAndExpand, Padding = new Thickness(10)};
Label label = new Label { Text = getCurrentStageString(), TextColor = Color.Black, HorizontalOptions = LayoutOptions.CenterAndExpand,
VerticalOptions = LayoutOptions.CenterAndExpand, WidthRequest = 220 };
ScrollView scrollView = new ScrollView() { Content = label, HorizontalOptions = LayoutOptions.FillAndExpand, VerticalOptions = LayoutOptions.FillAndExpand};
scrollView.Content = label;
frame.Content = scrollView;
frame.BorderColor = Color.Black;
collectionOfItems.Add(new SfCarouselItem() { ItemContent = frame});
collectionOfItems.Add(new SfCarouselItem() { ImageName = "usflag.png" });
carousel.ItemsSource = collectionOfItems;
MainLayout.Children.Add(carousel, 0, 0);
Grid.SetColumnSpan(carousel, 3);
this.Content = MainLayout;
XAML:
<Grid
x:Name="MainLayout"
Padding="30,5,30,5"
HorizontalOptions="FillAndExpand"
RowSpacing="5"
VerticalOptions="FillAndExpand">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="60" />
<RowDefinition Height="60" />
</Grid.RowDefinitions>
Current situation is that Label won't scroll, Border top and bottom lines aren't visible at all...
GIF:
