I am using the Microsoft example of MediaElement with Slider as here. In Android it works and the Slider runs while Buffering, but in iOS it doesn't work. Remain Stopped at the Beggining. I am using a CaroulselView with MediaElement and don't know if can be a bug related. But again, it just happens with iOS.
I am posting here because I opened an Issue on Git , but no one answered.
My XAML:
<CarouselView x:Name="carouselStorys"
ItemsLayout="VerticalList"
ItemsSource="{Binding StorysList}"
PositionChanged="carouselView_PositionChanged" >
<CarouselView.ItemTemplate>
<DataTemplate>
<Grid RowDefinitions="150,*" ColumnDefinitions="Auto,*, Auto">
<xct:MediaElement Grid.RowSpan="2" Grid.ColumnSpan="3" Aspect="AspectFill"
x:Name="mediaElement" AutoPlay="True"
MediaEnded="mediaElement_MediaEnded"
BindingContextChanged="MediaElement_BindingContextChanged"
Source="{Binding Story.Source}"
ShowsPlaybackControls="False"
HorizontalOptions="Fill"
VerticalOptions="FillAndExpand"/>
<customcontrols:CustomSlider Margin="0,20"
Grid.Row="0"
Grid.Column="1"
HorizontalOptions="FillAndExpand"
VerticalOptions="CenterAndExpand"
BindingContext="{x:Reference mediaElement}"
Maximum="{Binding Duration, Converter={StaticResource TimeSpanConverter}}"
Value="{Binding Position, Converter={StaticResource TimeSpanConverter}}"
>
<!--<customcontrols:CustomSlider.IsVisible>
<OnPlatform x:TypeArguments="x:Boolean" iOS="False" Android="True"/>
</customcontrols:CustomSlider.IsVisible>-->
<customcontrols:CustomSlider.Triggers>
<DataTrigger TargetType="customcontrols:CustomSlider"
Binding="{Binding CurrentState}"
Value="{x:Static xct:MediaElementState.Buffering}">
<Setter Property="IsEnabled" Value="False" />
</DataTrigger>
</customcontrols:CustomSlider.Triggers>
</customcontrols:CustomSlider>
<ffimageloading:CachedImage Grid.Row="0"
Margin="20"
WidthRequest="40"
HeightRequest="40"
Aspect="AspectFill"
CacheDuration="50"
HorizontalOptions="StartAndExpand"
VerticalOptions="CenterAndExpand"
DownsampleToViewSize="True"
BitmapOptimizations="True"
Source= "{Binding Story.UserImage}">
<ffimageloading:CachedImage.Transformations>
<fftransformations:CircleTransformation />
</ffimageloading:CachedImage.Transformations>
</ffimageloading:CachedImage>
<Label Margin="20" Grid.Column="2" Grid.Row="0" Text="X" FontSize="24" FontAttributes="Bold" TextColor="White" VerticalOptions="Center">
<Label.GestureRecognizers>
<TapGestureRecognizer Tapped="TapGestureRecognizer_Tapped"/>
</Label.GestureRecognizers>
</Label>
</Grid>
</DataTemplate>
</CarouselView.ItemTemplate>
</CarouselView>
My .cs code
public partial class StoriesPage : ContentPage
{
DashboardViewModel _viewModel;
public ObservableCollection<User> templist { get; set; }
List<MediaElement> mediaElements = new List<MediaElement>();
public StoriesPage (DashboardViewModel dashboardViewModel)
{
InitializeComponent ();
BindingContext = _viewModel = dashboardViewModel;
_viewModel.CurrentPosition = _viewModel.StorysList.IndexOf(_viewModel.SelectedItem);
carouselStorys.Position = _viewModel.CurrentPosition;
templist = new ObservableCollection<User> (_viewModel.StorysList);
}
protected override void OnAppearing()
{
base.OnAppearing();
AddToTempList();
}
protected override void OnDisappearing()
{
base.OnDisappearing();
}
private void mediaElement_MediaEnded(object sender, EventArgs e)
{
if (carouselStorys.Position == _viewModel.CountStorysList -1)
App.Current.MainPage.Navigation.PopAsync();
else
carouselStorys.ScrollTo(_viewModel.CurrentPosition + 1);
}
private void MediaElement_BindingContextChanged(object sender, EventArgs e)
{
var element = sender as MediaElement;
mediaElements.Add(element);
}
private void carouselView_PositionChanged(object sender, PositionChangedEventArgs e)
{
if (carouselStorys.CurrentItem == null)
return;
//AutoPlay when using CaroulselView not works after third scroll in Android. Video doesn't play and stay a black view like it's not buffering.
//With this code I force playing and it's buffering.
if (Device.RuntimePlatform == Device.Android)
{
mediaElements[mediaElements.Count - 2].Stop();
mediaElements.Last().Play();
}
_viewModel.CurrentPosition = carouselStorys.Position;
AddToTempList();
}
private void TapGestureRecognizer_Tapped(object sender, EventArgs e)
{
carouselStorys.ItemsSource = null;
StorysSingleton.Storys = templist;
//PopAsync removed, because there is a Bug in SfTabView, that sometimes when Popped, the tabbar disappear.
//todo check later if it doesn´t happen.
//Navigation.PopAsync();
App.Current.MainPage.Navigation.PushAsync(new MyTabbedPage());
}
async Task AddToTempList()
{
var currentUser = carouselStorys.CurrentItem as User;
foreach (var user in templist)
{
if (user.Id == currentUser.Id)
{
templist.Remove(user);
user.Story.IsNew = false;
templist.Add(user);
break;
}
}
}
}