Why does my lottie animation doesn't show in Xamarin Forms? - c#

I followed a tutorial and for some reason my lottie animation is not being shown when I test on Android device.
Package Com.Airbnb.Lottie.Forms was added to all app projects (it's crossplatform)
Then added Com.Airbnb.Android.Lottie to the Android app (first I tried without it, didn't work either)
This is the code
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:lottie="clr-namespace:Lottie.Forms;assembly=Lottie.Forms"
x:Class="AppWasher.MainPage">
<StackLayout>
<lottie:AnimationView
x:Name="animationView"
Animation="26617-ogad.json"
RepeatMode="Restart"
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand"
WidthRequest="300"
HeightRequest="300"/>
</StackLayout>
</ContentPage>
This is the guide lottie provides
<forms:AnimationView
x:Name="animationView"
Animation="LottieLogo1.json"
AnimationSource="AssetOrBundle"
Command="{Binding ClickCommand}"
RepeatCount="3"
RepeatMode="Restart"
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand" />
I tried using all those properties too, same result.
I'm testing on Android 9.0 version
Also json files were added to the assets folder in the android project and build action is set to AndroidAsset

It works for me after i change the android Target Framework version to Android 10.0.
And i found the latest Lottie nuget depends on AndroidX.

Related

How to set size of Xamarin Community Toolkit Popup to wrap content dynamically in Xamarin Forms?

I have a Xamarin.CommunityToolkit - Popup. I don't want to predefine its size. I want it to size according to the content dynamically. Is there any way to achieve this?
Here is my XAML code:
<?xml version="1.0" encoding="UTF-8"?>
<xct:Popup xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:xct="http://xamarin.com/schemas/2020/toolkit"
x:Class="SampleProject.Views.SamplePopup">
<StackLayout>
<Label Text="Hello Xamarin.Forms!" />
<Button Text="Close Popup" Clicked="ClosePopup" />
</StackLayout>
</xct:Popup>
The current implementation doesn't support such feature, as Amjad mentioned in his comment there was a similar feature request in the past but it was closed as things were migrating to the new repo .NET MAUI community toolkit.
If you are interested you can open a discussion explaining or pointing to the link of that feature request.

How to set background image of ContentPage in Xamarin

I am trying to set a background image on my Xamarin app.
I saw already Xamarin Forms ContentPage background image tiling article.
At that code, has set a background image from the URL.
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="SuperForms.Samples.Page1">
<ContentView>
<Image Source="https://i.stack.imgur.com/ajyCo.png"
Aspect="AspectFill"/>
</ContentView>
</ContentPage>
I want to set from local Resources. So I have modified the XAML file like the following code. But It doesn't work. How to should I fix the following code.
I want to set the background image via only the XAML file. not via C# code.
MainPage.xaml
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="SuperForms.Samples.Page1">
<ContentView>
<Image Source="Image/background.png"
Aspect="AspectFill"/>
</ContentView>
</ContentPage>
This is my Xamarin solution structure.
I want to build my app on Android, iOS, and Windows.
Please let me know in detail because I am a beginner at Xamarin.
Best regards.
According to xamarin document:
Image files can be added to each application project and referenced
from Xamarin.Forms shared code. This method of distributing images is
required when images are platform-specific, such as when using
different resolutions on different platforms, or slightly different
designs.
And on andriod.Place images in the Resources/drawable directory with Build Action: AndroidResource. High- and low-DPI versions of an image can also be supplied (in appropriately named Resources subdirectories such as drawable-ldpi, drawable-hdpi, and drawable-xhdpi).
see the link below:
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/images?tabs=windows

How to display a popup window on Xamarin

I am very new to Xamarin, so please excuse me for my simple questions.
Like the alert window on the screen, I want to open a second window that can be resized and positioned. Despite all my calls, I couldn't get it.
An absolute style div for those who know html.
Thanks in advance to friends who can give me an idea of how I can do it.
I think what you're looking for is a "Popup". It can be done by hand, but I recommend using a library like this one. It lets you customize your Popups however you want by creating custom pages for them, like this:
<?xml version="1.0" encoding="utf-8" ?>
<pages:PopupPage
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:pages="clr-namespace:Rg.Plugins.Popup.Pages;assembly=Rg.Plugins.Popup"
xmlns:animations="clr-namespace:Rg.Plugins.Popup.Animations;assembly=Rg.Plugins.Popup"
x:Class="MyProject.MyPopupPage">
<!--You can set an animation in the xaml file or in the csharp code behind-->
<pages:PopupPage.Animation>
<animations:ScaleAnimation
PositionIn="Center"
PositionOut="Center"
ScaleIn="1.2"
ScaleOut="0.8"
DurationIn="400"
DurationOut="300"
EasingIn="SinOut"
EasingOut="SinIn"
HasBackgroundAnimation="True"/>
</pages:PopupPage.Animation>
<!--You can use any elements here which are extended from Xamarin.Forms.View-->
<StackLayout
VerticalOptions="Center"
HorizontalOptions="Center"
Padding="20, 20, 20, 20">
<Label
Text="Test"/>
</StackLayout>
</pages:PopupPage>
If you want Popups that cover the whole screen, you can use modal pages, which are built into Xamarin. Check it here.

Xamarin forms maps error :"Not compatable code running

I am trying to create a simple map page using Xamarin forms maps checking this project only on Andorid.
I Installed the Xamarin forms map. and added the Xaml Below,
in addition I've added the in the Android manifest XML all the relavent
premiisions and Key.
however I am getting this error:Not compatable code running the selected debug engine does not support any code executing on the current thread
would appericate any help
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:maps="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps"
x:Class="MashamApp.mapPage" Title="מפה" >
<ContentPage.Content>
</ContentPage.Content>
<Grid>
<maps:Map x:Name="LocationMap"
IsEnabled="True" IsVisible="True"
MapType="Hybrid"
HasScrollEnabled="True"
HasZoomEnabled="True"
HeightRequest="480"
WidthRequest="480"
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand" >
</maps:Map>
</Grid>
As pointed out by Yuri, a content page should only have a single view or layout.
Change your page to look like this:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:maps="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps"
x:Class="MashamApp.mapPage" Title="מפה" >
<Grid>
<maps:Map x:Name="LocationMap"
IsEnabled="True" IsVisible="True"
MapType="Hybrid"
HasScrollEnabled="True"
HasZoomEnabled="True"
HeightRequest="480"
WidthRequest="480"
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand" >
</maps:Map>
</Grid>
</ContentPage>
You don't even need the Grid unless you are going to add more views inside it.
See here for more details

WebView video in xaml Does not play correctly

When I open the Binding url in a web view the video plays just the audio not the visuals on the emulator and my phone.
When I open the Binding url on my pc and phone it works fine.
Any idea how to fix it?
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="WiscOnline.Mobile.ViewLearningItem"
Title="{Binding LearningItem.Name}">
<WebView x:Name="webView"
HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand"
Source="{Binding CurrentSource}" />
<StackLayout>
<Label Text="{Binding LearningItem.ViewUrl}" FontSize="19"></Label>
</StackLayout>
<WebView Source="{Binding LearningItem.ViewUrl}" ></WebView>
</ContentPage>
This issue is with Android and it's WebView and not specifically with Xamarin. Different versions of Android will support different WebView features. Video playback is particularly bad in a WebView.
A better option would be to use the native video player for each platform or to at least use the native video player on Android.
You could either use a handy plugin/component for this like this one (I have not ever tried that one but saw it was recommended by others) or you could try and roll one yourself by using the native Android VideoView.
A Xamarin Forms thread about this very issue and using the VideoView can be found here.

Categories