Custom Animation with XCT Popup

A quick post today about XCT Popup and custom animation.

JS asked for help today on Gerald’s Discord Server

Let’s see how we can do this with only 3 steps 😎

Step 1 : Base.Color

Create your own Popup class ( MyOwnPopup.cs ) and change the base color to Transparent

	public class MyOwnPopup : Popup
		public MyOwnPopup()
			base.Color = Xamarin.Forms.Color.Transparent;

Step 2 : Create your pop like XCT popup ( MyPopupView.xaml )

<?xml version="1.0" encoding="utf-8" ?>
<popups:MyOwnPopup  xmlns:popups="clr-namespace:StarterKit.Views.Popups" xmlns:xct="" 
    <StackLayout BackgroundColor="White">
        <Label Text="Hello from popup!" VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand" />
        <Button Text="Close me" Clicked="Button_Clicked" />

Step 3 :

Setup your animation !

public partial class MyPopupView
		public MyPopupView()
			Opened += MyPopupView_Opened;

		private void MyPopupView_Opened(object sender, PopupOpenedEventArgs e)
			Animation b = new Animation();
			b.Add(0, 1, new Animation(v => this.Opacity = v, 0, 1));
            //Do what you want here
				 owner: ThePopup,
				 name: "show",
				 length: 1200);
		void Button_Clicked(System.Object sender, System.EventArgs e)

And it’s done ! 👏

I don’t know if it’s the hard way to do it or the only way at the moment.
But … it works 🏅

⛔ I was wrong , it works but only for Android ….😒 ⛔

I’ll dig it to make it works with iOS 🚧

2 thoughts on “Custom Animation with XCT Popup

  1. I tried to apply it, however, the animation does not work on my side.

    Do you have a sample code on github that we can reference for this?

    Thanks in advance! great work!

Leave a Reply

Your email address will not be published.