menu

Xamarin.Forms

  • Code Examples
  • Upgrade Guide
  • User Guide
  • Demos
  • Support
  • Forums
  • Download
Class SfPopupLayout - Xamarin.Forms API Reference | Syncfusion

    Show / Hide Table of Contents

    Class SfPopupLayout

    Displays an alert message with customizable buttons or load any desired view inside the pop-up.

    Inheritance
    System.Object
    SfPopupLayout
    Implements
    System.IDisposable
    Namespace: Syncfusion.XForms.PopupLayout
    Assembly: Syncfusion.SfPopupLayout.XForms.dll
    Syntax
    public class SfPopupLayout : Layout<View>, IDisposable, IParentThemeElement, IThemeElement

    Constructors

    SfPopupLayout()

    Initializes a new instance of the SfPopupLayout class.

    Declaration
    public SfPopupLayout()

    Fields

    AbsoluteXProperty

    Identifies the AbsoluteX bindable property.

    Declaration
    public static readonly BindableProperty AbsoluteXProperty
    Field Value
    Type
    Xamarin.Forms.BindableProperty

    AbsoluteYProperty

    Identifies the AbsoluteY bindable property.

    Declaration
    public static readonly BindableProperty AbsoluteYProperty
    Field Value
    Type
    Xamarin.Forms.BindableProperty

    ClosePopupOnBackButtonPressedProperty

    Identifies the ClosePopupOnBackButtonPressed Xamarin.Forms.BindableProperty.

    Declaration
    public static readonly BindableProperty ClosePopupOnBackButtonPressedProperty
    Field Value
    Type
    Xamarin.Forms.BindableProperty

    ContentProperty

    Identifies the Content bindable property.

    Declaration
    public static readonly BindableProperty ContentProperty
    Field Value
    Type
    Xamarin.Forms.BindableProperty

    IsOpenProperty

    Identifies the IsOpen bindable property.

    Declaration
    public static readonly BindableProperty IsOpenProperty
    Field Value
    Type
    Xamarin.Forms.BindableProperty

    OverlayModeProperty

    Identifies the OverlayMode Xamarin.Forms.BindableProperty.

    Declaration
    public static readonly BindableProperty OverlayModeProperty
    Field Value
    Type
    Xamarin.Forms.BindableProperty

    PopupViewProperty

    Identifies the PopupView bindable property.

    Declaration
    public static readonly BindableProperty PopupViewProperty
    Field Value
    Type
    Xamarin.Forms.BindableProperty

    RelativePositionProperty

    Identifies the RelativePosition bindable property.

    Declaration
    public static readonly BindableProperty RelativePositionProperty
    Field Value
    Type
    Xamarin.Forms.BindableProperty

    RelativeViewProperty

    Identifies the RelativeView bindable property.

    Declaration
    public static readonly BindableProperty RelativeViewProperty
    Field Value
    Type
    Xamarin.Forms.BindableProperty

    ShowOverlayAlwaysProperty

    Identifies the ShowOverlay bindable property.

    Declaration
    public static readonly BindableProperty ShowOverlayAlwaysProperty
    Field Value
    Type
    Xamarin.Forms.BindableProperty

    StaysOpenProperty

    Identifies the StaysOpen bindable property.

    Declaration
    public static readonly BindableProperty StaysOpenProperty
    Field Value
    Type
    Xamarin.Forms.BindableProperty

    Properties

    AbsoluteX

    Gets or sets the absolute x-point to display a pop-up when positioning it relatively to the specified RelativeView based on the RelativePosition. The pop-up will be displayed based on this property value only when relatively displaying it by using the RelativeView property.

    Declaration
    public int AbsoluteX { get; set; }
    Property Value
    Type Description
    System.Int32

    The absolute X-point to display the popup when positioning the popup relatively to the specified RelativeView based on the RelativePosition.

    Examples

    The following code example demonstrates how to set Absolute X position for the SfPopupLayout control.

    using Syncfusion.XForms.PopupLayout;
    using System;
    using Xamarin.Forms;
    

    namespace PopupGettingStarted { public partial class MainPage : ContentPage { SfPopupLayout popupLayout; public MainPage() { InitializeComponent(); popupLayout = new SfPopupLayout(); var layout = new StackLayout(); var clickToShowPopup = new Button() { Text = "ClickToShowPopup", VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.FillAndExpand }; layout.Children.Add(clickToShowPopup); Content = popupLayout; popupLayout.Content = layout; clickToShowPopup.Clicked += ClickToShowPopup_Clicked; popupLayout.RelativeView = clickToShowPopup; popupLayout.RelativePosition = RelativePosition.AlignBottom; popupLayout.AbsoluteX = 50; } private void ClickToShowPopup_Clicked(object sender, EventArgs e) { popupLayout.Show(); } } }

    <?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:local="clr-namespace:PopupGettingStarted"
                 x:Class="PopupGettingStarted.MainPage"
                 xmlns:sfPopup="clr-namespace:Syncfusion.XForms.PopupLayout;assembly=Syncfusion.SfPopupLayout.XForms">
        <sfPopup:SfPopupLayout x:Name="popupLayout" RelativePosition="AlignBottom" AbsoluteX="50">
            <sfPopup:SfPopupLayout.Content>
                <StackLayout x:Name="mainLayout" VerticalOptions="StartAndExpand" HorizontalOptions="Start">
                    <StackLayout VerticalOptions = "StartAndExpand" HorizontalOptions="StartAndExpand">
                        <Button x:Name="clickToShowPopup" Text="ClickToShowPopup" TextColor="White" 
                                HeightRequest="60" VerticalOptions="Start" Margin="50,0,0,0" HorizontalOptions="StartAndExpand" BackgroundColor="Blue" 
                                Clicked="ClickToShowPopup_Clicked">
                        </Button>
                    </StackLayout>
                </StackLayout>
            </sfPopup:SfPopupLayout.Content>
            <sfPopup:SfPopupLayout.RelativeView>
                <x:Reference Name="clickToShowPopup"/>
            </sfPopup:SfPopupLayout.RelativeView>
        </sfPopup:SfPopupLayout>
    </ContentPage>

    AbsoluteY

    Gets or sets the absolute y-point to display a pop-up when positioning it relatively to the specified RelativeView based on the RelativePosition. The pop-up will be displayed based on this property value only when relatively displaying it by using the RelativeView property.

    Declaration
    public int AbsoluteY { get; set; }
    Property Value
    Type Description
    System.Int32

    The absolute Y-point to display the popup when positioning the popup relatively to the specified RelativeView based on the RelativePosition.

    Examples

    The following code example demonstrates how to set Absolute Y position for the SfPopupLayout control.

    using Syncfusion.XForms.PopupLayout;
    using System;
    using Xamarin.Forms;
    

    namespace PopupGettingStarted { public partial class MainPage : ContentPage { SfPopupLayout popupLayout; public MainPage() { InitializeComponent(); popupLayout = new SfPopupLayout(); var layout = new StackLayout(); var clickToShowPopup = new Button() { Text = "ClickToShowPopup", VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.FillAndExpand }; layout.Children.Add(clickToShowPopup); Content = popupLayout; popupLayout.Content = layout; clickToShowPopup.Clicked += ClickToShowPopup_Clicked; popupLayout.RelativeView = clickToShowPopup; popupLayout.RelativePosition = RelativePosition.AlignBottom;
    popupLayout.AbsoluteY = 100; } private void ClickToShowPopup_Clicked(object sender, EventArgs e) { popupLayout.Show(); } } }

    <?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:local="clr-namespace:PopupGettingStarted"
                 x:Class="PopupGettingStarted.MainPage"
                 xmlns:sfPopup="clr-namespace:Syncfusion.XForms.PopupLayout;assembly=Syncfusion.SfPopupLayout.XForms">
        <sfPopup:SfPopupLayout x:Name="popupLayout" RelativePosition="AlignBottom" AbsoluteY="100">
            <sfPopup:SfPopupLayout.Content>
                <StackLayout x:Name="mainLayout" VerticalOptions="StartAndExpand" HorizontalOptions="Start">
                    <StackLayout VerticalOptions = "StartAndExpand" HorizontalOptions="StartAndExpand">
                        <Button x:Name="clickToShowPopup" Text="ClickToShowPopup" TextColor="White" 
                                HeightRequest="60" VerticalOptions="Start" Margin="50,0,0,0" HorizontalOptions="StartAndExpand" BackgroundColor="Blue" 
                                Clicked="ClickToShowPopup_Clicked"/>
                    </StackLayout>
                </StackLayout>
            </sfPopup:SfPopupLayout.Content>
            <sfPopup:SfPopupLayout.RelativeView>
                <x:Reference Name="clickToShowPopup"/>
            </sfPopup:SfPopupLayout.RelativeView>
        </sfPopup:SfPopupLayout>
    </ContentPage>

    ClosePopupOnBackButtonPressed

    Gets or sets a value indicating whether the PopupView should be closed, when interacting with the back button in Android platform.

    Declaration
    public bool ClosePopupOnBackButtonPressed { get; set; }
    Property Value
    Type Description
    System.Boolean

    The value indicating whether the PopupView should be closed, when interacting with the back button in Android platform.

    Remarks

    The PopupView will be closed based on this value while interacting with the back button, Default value is true and applicable only for Android platform.

    Examples

    The following code example demonstrates how to set ClosePopupOnBackButtonPressed property for the SfPopupLayout control.

    using Syncfusion.XForms.PopupLayout;  
    using System;
    using Xamarin.Forms;
    

    namespace SfPopupGettingStarted { public partial class MainPage : ContentPage { SfPopupLayout popupLayout; public MainPage() { InitializeComponent(); popupLayout = new SfPopupLayout(); var layout = new StackLayout(); var clickToShowPopup = new Button() { Text = "ClickToShowPopup", VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.FillAndExpand }; layout.Children.Add(clickToShowPopup); Content = popupLayout; popupLayout.Content = layout; clickToShowPopup.Clicked += ClickToShowPopup_Clicked; popupLayout.ClosePopupOnBackButtonPressed = false; } private void ClickToShowPopup_Clicked(object sender, EventArgs e) { popupLayout.Show(); } } }

    <?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:local="clr-namespace:SfPopupGettingStarted"
                 xmlns:sfPopup="clr-namespace:Syncfusion.XForms.PopupLayout;assembly=Syncfusion.SfPopupLayout.XForms"
                 x:Class="SfPopupGettingStarted.MainPage">
        <sfPopup:SfPopupLayout x:Name="popupLayout"  ClosePopupOnBackButtonPressed="False">
            <sfPopup:SfPopupLayout.Content>
                <StackLayout x:Name="layout">
                     <Button x:Name="clickToShowPopup" Text="ClickToShowPopup" VerticalOptions="Start" HorizontalOptions="FillAndExpand" Clicked="ClickToShowPopup_Clicked"/>
                </StackLayout>
            </sfPopup:SfPopupLayout.Content>
        </sfPopup:SfPopupLayout>
    </ContentPage>

    Content

    Gets or sets the content to be hosted in the pop-up.

    Declaration
    public View Content { get; set; }
    Property Value
    Type Description
    Xamarin.Forms.View

    The content of the SfPopupLayout.

    Remarks

    The PopupView will be hosted inside the view which is set as the Content.

    Examples

    The following code example demonstrates how to set content for the SfPopupLayout control.

    using Syncfusion.XForms.PopupLayout;
    using System;
    using Xamarin.Forms;
    

    namespace GettingStarted { public partial class MainPage : ContentPage { SfPopupLayout popupLayout;
    public MainPage() { InitializeComponent(); popupLayout = new SfPopupLayout(); var layout = new StackLayout(); var clickToShowPopup = new Button() { Text = "ClickToShowPopup", VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.FillAndExpand }; layout.Children.Add(clickToShowPopup); Content = popupLayout; popupLayout.Content = layout; clickToShowPopup.Clicked += ClickToShowPopup_Clicked;
    } private void ClickToShowPopup_Clicked(object sender, EventArgs e) { popupLayout.Show(); } } }

    <?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:local="clr-namespace:GettingStarted"
                 x:Class="GettingStarted.MainPage" 
                 Padding="0,40,0,0"
                 xmlns:sfPopup="clr-namespace:Syncfusion.XForms.PopupLayout;assembly=Syncfusion.SfPopupLayout.XForms">
        <sfPopup:SfPopupLayout x:Name="popupLayout">
            <sfPopup:SfPopupLayout.Content>
                <StackLayout x:Name="layout">
                    <Button x:Name="clickToShowPopup" Text="ClickToShowPopup" VerticalOptions="Start" 
                            HorizontalOptions="FillAndExpand"  Clicked="ClickToShowPopup_Clicked" />
                </StackLayout>
                </sfPopup:SfPopupLayout.Content>
        </sfPopup:SfPopupLayout>
    </ContentPage>

    IsOpen

    Gets or sets a value indicating whether the PopupView is open or not.

    Declaration
    public bool IsOpen { get; set; }
    Property Value
    Type Description
    System.Boolean

    The value indicating whether the PopupView is open or not.

    Remarks

    The PopupView will be opened and closed based on this value.

    Examples

    The following code example demonstrates how to set IsOpen property for the SfPopupLayout control.

    using Syncfusion.XForms.PopupLayout;
    using System;
    using Xamarin.Forms;
    

    namespace PopupGettingStarted { public partial class MainPage : ContentPage { SfPopupLayout popupLayout; public MainPage() { InitializeComponent(); popupLayout = new SfPopupLayout(); var layout = new StackLayout(); var clickToShowPopup = new Button() { Text = "ClickToShowPopup", VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.FillAndExpand }; layout.Children.Add(clickToShowPopup); Content = popupLayout; popupLayout.Content = layout; clickToShowPopup.Clicked += ClickToShowPopup_Clicked; } private void ClickToShowPopup_Clicked(object sender, EventArgs e) { popupLayout.IsOpen = false; } } }

    <?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:local="clr-namespace:PopupGettingStarted"
                 x:Class="PopupGettingStarted.MainPage"
                 xmlns:sfPopup="clr-namespace:Syncfusion.XForms.PopupLayout;assembly=Syncfusion.SfPopupLayout.XForms">
                 <ContentPage.BindingContext>
    <local:ViewModel x:Name="viewModel" />
    </ContentPage.BindingContext>
        <sfPopup:SfPopupLayout x:Name="popupLayout" IsOpen="{Binding PopupStatus">
            <sfPopup:SfPopupLayout.Content>
                <StackLayout x:Name="mainLayout" VerticalOptions="StartAndExpand" HorizontalOptions="Start">
                    <StackLayout VerticalOptions = "StartAndExpand" HorizontalOptions="StartAndExpand">
                        <Button x:Name="clickToShowPopup" Text="ClickToShowPopup" TextColor="White" 
                                HeightRequest="60" VerticalOptions="Start" Margin="50,0,0,0" HorizontalOptions="StartAndExpand" BackgroundColor="Blue"
                                Clicked="ClickToShowPopup_Clicked"/>
                    </StackLayout>
                </StackLayout>
            </sfPopup:SfPopupLayout.Content>
        </sfPopup:SfPopupLayout>
    </ContentPage>

    OverlayMode

    Gets or sets a value indicating whether overlay should be transparent or blurred ///

    Declaration
    public OverlayMode OverlayMode { get; set; }
    Property Value
    Type Description
    OverlayMode

    OverlayMode.Blur If the overlay should be blurred otherwise OverlayMode.Transparent. The default value is OverlayMode.Transparent.

    Remarks

    should not be null when SfPopupLayout is not in the visual tree and popup is shown on the go as mentioned here https://help.syncfusion.com/xamarin/popup/getting-started#displaying-popup-on-the-go.

    Examples

    The following code example demonstrates how to apply blur effect to the overlay in SfPopupLayout control.

    using Syncfusion.XForms.PopupLayout;
    using System;
    using Xamarin.Forms;
    

    namespace GettingStarted { public partial class MainPage : ContentPage { SfPopupLayout popupLayout;
    public MainPage() { InitializeComponent(); popupLayout = new SfPopupLayout();
    popupLayout.PopupView.PopupStyle.OverlayOpacity = 0; popupLayout.OverlayMode = OverlayMode.Blur; var layout = new StackLayout(); var clickToShowPopup = new Button() { Text = "ClickToShowPopup", VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.FillAndExpand }; layout.Children.Add(clickToShowPopup);
    Content = popupLayout; popupLayout.Content = layout; clickToShowPopup.Clicked += ClickToShowPopup_Clicked;
    } private void ClickToShowPopup_Clicked(object sender, EventArgs e) { popupLayout.Show(); } } }

    <?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:local="clr-namespace:GettingStarted"
                 x:Class="GettingStarted.MainPage" 
                 Padding="0,40,0,0"
                 xmlns:sfPopup="clr-namespace:Syncfusion.XForms.PopupLayout;assembly=Syncfusion.SfPopupLayout.XForms">
    
        <sfPopup:SfPopupLayout x:Name="popupLayout" OverlayMode="Blur">
            <sfPopup:SfPopupLayout.PopupView>
                <sfPopup:PopupView>
                    <sfPopup:PopupView.PopupStyle>
                        <sfPopup:PopupStyle HeaderBackgroundColor="DimGray"
                                            OverlayOpacity="0"/>
                    </sfPopup:PopupView.PopupStyle>
                </sfPopup:PopupView>
            </sfPopup:SfPopupLayout.PopupView>
            <sfPopup:SfPopupLayout.Content>
                <StackLayout x:Name="layout">
                    <Button x:Name="clickToShowPopup" Text="ClickToShowPopup" VerticalOptions="Start" 
                            HorizontalOptions="FillAndExpand" Clicked="ClickToShowPopup_Clicked"  />
                </StackLayout>
            </sfPopup:SfPopupLayout.Content>
        </sfPopup:SfPopupLayout>    
    </ContentPage>

    PopupView

    Gets the pop-up view of SfPopupLayout that will be displayed when setting the IsOpen property to true.

    Declaration
    public PopupView PopupView { get; set; }
    Property Value
    Type Description
    PopupView

    The popup view of the SfPopupLayout that will be displayed when setting the IsOpen property as true.

    RelativePosition

    Gets or sets the relative position, where the pop-up should be displayed relatively to RelativeView. The relative position can also be absolutely adjusted using the AbsoluteX and AbsoluteY properties.

    Declaration
    public RelativePosition RelativePosition { get; set; }
    Property Value
    Type Description
    RelativePosition

    The relative position, where popup should be displayed relatively to RelativeView.

    Examples

    The following code example demonstrates how to set Relative Position for the SfPopupLayout control.

    using Syncfusion.XForms.PopupLayout;
    using System;
    using Xamarin.Forms;
    

    namespace PopupGettingStarted { public partial class MainPage : ContentPage { SfPopupLayout popupLayout; public MainPage() { InitializeComponent(); popupLayout = new SfPopupLayout(); var layout = new StackLayout(); var clickToShowPopup = new Button() { Text = "ClickToShowPopup", VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.FillAndExpand }; layout.Children.Add(clickToShowPopup); Content = popupLayout; popupLayout.Content = layout; clickToShowPopup.Clicked += ClickToShowPopup_Clicked; popupLayout.RelativeView = clickToShowPopup; popupLayout.RelativePosition = RelativePosition.AlignBottom; } private void ClickToShowPopup_Clicked(object sender, EventArgs e) { popupLayout.Show(); } } }

    <?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:local="clr-namespace:PopupGettingStarted"
                 x:Class="PopupGettingStarted.MainPage"
                 xmlns:sfPopup="clr-namespace:Syncfusion.XForms.PopupLayout;assembly=Syncfusion.SfPopupLayout.XForms">
        <sfPopup:SfPopupLayout x:Name="popupLayout" RelativePosition="AlignBottom>
            <sfPopup:SfPopupLayout.Content>
                <StackLayout x:Name="mainLayout" VerticalOptions="StartAndExpand" HorizontalOptions="Start">
                    <StackLayout VerticalOptions = "StartAndExpand" HorizontalOptions="StartAndExpand">
                        <Button x:Name="clickToShowPopup" Text="ClickToShowPopup" TextColor="White" 
                                HeightRequest="60" VerticalOptions="Start" Margin="50,0,0,0" HorizontalOptions="StartAndExpand" BackgroundColor="Blue" 
                                Clicked="ClickToShowPopup_Clicked">
                        </Button>
                    </StackLayout>
                </StackLayout>
            </sfPopup:SfPopupLayout.Content>
            <sfPopup:SfPopupLayout.RelativeView>
                <x:Reference Name="clickToShowPopup"/>
            </sfPopup:SfPopupLayout.RelativeView>
        </sfPopup:SfPopupLayout>
    </ContentPage>

    RelativeView

    Gets or sets the view relative to which the popup should be displayed based on the RelativePosition. The relative position can also be absolutely adjusted using the AbsoluteX and AbsoluteY properties.

    Declaration
    public View RelativeView { get; set; }
    Property Value
    Type Description
    Xamarin.Forms.View

    The view relative to which popup should be displayed based on the RelativePosition.

    Examples

    The following code example demonstrates how to set relative view for the SfPopupLayout control.

    using Syncfusion.XForms.PopupLayout;
    using System;
    using Xamarin.Forms;
    

    namespace PopupGettingStarted { public partial class MainPage : ContentPage { SfPopupLayout popupLayout; public MainPage() { InitializeComponent(); popupLayout = new SfPopupLayout(); var layout = new StackLayout(); var clickToShowPopup = new Button() { Text = "ClickToShowPopup", VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.FillAndExpand }; layout.Children.Add(clickToShowPopup); Content = popupLayout; popupLayout.Content = layout; clickToShowPopup.Clicked += ClickToShowPopup_Clicked; popupLayout.RelativeView = clickToShowPopup; } private void ClickToShowPopup_Clicked(object sender, EventArgs e) { popupLayout.Show(); } } }

    <?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:local="clr-namespace:PopupGettingStarted"
                 x:Class="PopupGettingStarted.MainPage"
                 xmlns:sfPopup="clr-namespace:Syncfusion.XForms.PopupLayout;assembly=Syncfusion.SfPopupLayout.XForms">
        <sfPopup:SfPopupLayout x:Name="popupLayout">
            <sfPopup:SfPopupLayout.Content>
                <StackLayout x:Name="mainLayout" VerticalOptions="StartAndExpand" HorizontalOptions="Start">
                    <StackLayout VerticalOptions = "StartAndExpand" HorizontalOptions="StartAndExpand">
                        <Button x:Name="clickToShowPopup" Text="ClickToShowPopup" TextColor="White" 
                                HeightRequest="60" VerticalOptions="Start" Margin="50,0,0,0" HorizontalOptions="StartAndExpand" BackgroundColor="Blue" 
                                Clicked="ClickToShowPopup_Clicked"/>
                    </StackLayout>
                </StackLayout>
            </sfPopup:SfPopupLayout.Content>
            <sfPopup:SfPopupLayout.RelativeView>
                <x:Reference Name="clickToShowPopup"/>
            </sfPopup:SfPopupLayout.RelativeView>
        </sfPopup:SfPopupLayout>
    </ContentPage>

    ShowOverlayAlways

    Gets or Sets a value indicating whether an overlay can be shown around the PopupView. Default value is false.

    Declaration
    public bool ShowOverlayAlways { get; set; }
    Property Value
    Type
    System.Boolean
    Examples

    The following code example demonstrates how to set ShowOverlayAlways property for the SfPopupLayout control.

    using Syncfusion.XForms.PopupLayout;
    using System;
    using Xamarin.Forms;
    

    namespace PopupGettingStarted { public partial class MainPage : ContentPage { SfPopupLayout popupLayout; public MainPage() { InitializeComponent(); popupLayout = new SfPopupLayout(); var layout = new StackLayout(); var clickToShowPopup = new Button() { Text = "ClickToShowPopup", VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.FillAndExpand }; layout.Children.Add(clickToShowPopup); Content = popupLayout; popupLayout.Content = layout; clickToShowPopup.Clicked += ClickToShowPopup_Clicked; popupLayout.ShowOverlayAlways = true; } private void ClickToShowPopup_Clicked(object sender, EventArgs e) { popupLayout.Show(); } } }

    <?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:local="clr-namespace:PopupGettingStarted"
                 x:Class="PopupGettingStarted.MainPage"
                 xmlns:sfPopup="clr-namespace:Syncfusion.XForms.PopupLayout;assembly=Syncfusion.SfPopupLayout.XForms">
        <sfPopup:SfPopupLayout x:Name="popupLayout" ShowOverlayAlways="True">
            <sfPopup:SfPopupLayout.Content>
                <StackLayout x:Name="mainLayout" VerticalOptions="StartAndExpand" HorizontalOptions="Start">
                    <StackLayout VerticalOptions = "StartAndExpand" HorizontalOptions="StartAndExpand">
                        <Button x:Name="clickToShowPopup" Text="ClickToShowPopup" TextColor="White" 
                                HeightRequest="60" VerticalOptions="Start" Margin="50,0,0,0" HorizontalOptions="StartAndExpand" BackgroundColor="Blue" 
                                Clicked="ClickToShowPopup_Clicked">
                        </Button>
                    </StackLayout>
                </StackLayout>
            </sfPopup:SfPopupLayout.Content>
        </sfPopup:SfPopupLayout>
    </ContentPage>

    StaysOpen

    Gets or sets a value indicating whether the PopupView should be opened, when interacting outside its boundary area.

    Declaration
    public bool StaysOpen { get; set; }
    Property Value
    Type Description
    System.Boolean

    The value indicating whether the PopupView should stay open, when the interaction is made outside its boundary area.

    Examples

    The following code example demonstrates how to set StaysOpen property for the SfPopupLayout control.

    using Syncfusion.XForms.PopupLayout;     
    using System;
    using Xamarin.Forms;
    

    namespace SfPopupGettingStarted { public partial class MainPage : ContentPage { SfPopupLayout popupLayout; public MainPage() { InitializeComponent(); popupLayout = new SfPopupLayout(); var layout = new StackLayout(); var clickToShowPopup = new Button() { Text = "ClickToShowPopup", VerticalOptions = LayoutOptions.Start, HorizontalOptions = LayoutOptions.FillAndExpand }; layout.Children.Add(clickToShowPopup); Content = popupLayout; popupLayout.Content = layout; clickToShowPopup.Clicked += ClickToShowPopup_Clicked; popupLayout.StaysOpen = true; } private void ClickToShowPopup_Clicked(object sender, EventArgs e) { popupLayout.Show(); } } }

    <?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:local="clr-namespace:SfPopupGettingStarted"
                 xmlns:sfPopup="clr-namespace:Syncfusion.XForms.PopupLayout;assembly=Syncfusion.SfPopupLayout.XForms"
                 x:Class="SfPopupGettingStarted.MainPage">
        <sfPopup:SfPopupLayout x:Name="popupLayout" StaysOpen="True" >
            <sfPopup:SfPopupLayout.Content>
                <StackLayout x:Name="layout">
                    <Button  x:Name="clickToShowPopup" Text="ClickToShowPopup" VerticalOptions="Start" HorizontalOptions="FillAndExpand" Clicked="ClickToShowPopup_Clicked"/>
                </StackLayout>
            </sfPopup:SfPopupLayout.Content>
        </sfPopup:SfPopupLayout>
    </ContentPage>

    Methods

    Dismiss()

    Dismisses the pop-up from the view.

    Declaration
    public void Dismiss()
    Remarks

    This parameter is used, when the rootView is not SfPopupLayout. If it is true, the ParentView will be reset in the CotentView, else the rootView will be maintained as SfPopupLayout.

    Dispose()

    Performs final clean up before it is released from memory.

    Declaration
    public void Dispose()

    Dispose(Boolean)

    Releases the unmanaged resources used by the component and optionally releases the managed resources.

    Declaration
    protected virtual void Dispose(bool disposing)
    Parameters
    Type Name Description
    System.Boolean disposing

    if true - release both managed and unmanaged resources; if false - release only unmanaged resources.

    LayoutChildren(Double, Double, Double, Double)

    Positions and sizes the children of a layout.

    Declaration
    protected override void LayoutChildren(double x, double y, double width, double height)
    Parameters
    Type Name Description
    System.Double x

    A value representing the x coordinate of the child region bounding box.

    System.Double y

    A value representing the y coordinate of the child region bounding box.

    System.Double width

    A value representing the width of the child region bounding box.

    System.Double height

    A value representing the height of the child region bounding box.

    OnBindingContextChanged()

    Executes an action by overriding this method when the BindingContext gets changed.

    Declaration
    protected override void OnBindingContextChanged()

    Show(Boolean)

    Displays a pop-up in the view.

    Declaration
    public void Show(bool isFullScreen = false)
    Parameters
    Type Name Description
    System.Boolean isFullScreen

    Determines whether to display the popup in full width and height of the screen.

    Show(Double, Double)

    Displays a pop-up at the given x and y points.

    Declaration
    public void Show(double xPosition, double yPosition)
    Parameters
    Type Name Description
    System.Double xPosition

    The x-point at which the popup should be displayed.

    System.Double yPosition

    The y-point at which the popup should be displayed.

    ShowAtTouchPoint()

    Displays a pop-up at the touch point.

    Declaration
    public void ShowAtTouchPoint()

    ShowRelativeToView(View, RelativePosition, Double, Double)

    Displays a pop-up relative to the given view.

    Declaration
    public void ShowRelativeToView(View relativeView, RelativePosition relativePosition, double absoluteX = NaN, double absoluteY = NaN)
    Parameters
    Type Name Description
    Xamarin.Forms.View relativeView

    The view relative to which popup should be displayed.

    RelativePosition relativePosition

    The position, where popup should be displayed, relative to the given view.

    System.Double absoluteX

    The absolute X-point from relative view.

    System.Double absoluteY

    The absolute Y-point from relative view.

    Events

    Closed

    Gets fired whenever the PopupView is dismissed from the view.

    Declaration
    public event EventHandler Closed
    Event Type
    Type
    System.EventHandler
    Remarks

    This event fires whenever the IsOpen property is set as false.

    Closing

    This event will be fired whenever the PopupView is closing in the view. Occurring of this event can be cancelled based on conditions.

    Declaration
    public event EventHandler<CancelEventArgs> Closing
    Event Type
    Type
    System.EventHandler<CancelEventArgs>

    Opened

    Gets fired whenever the PopupView is shown in the view.

    Declaration
    public event EventHandler Opened
    Event Type
    Type
    System.EventHandler
    Remarks

    This event fires whenever the IsOpen property is set as true.

    Opening

    Gets fired whenever the PopupView is opening in the view. Occurrence can be cancelled based on conditions.

    Declaration
    public event EventHandler<CancelEventArgs> Opening
    Event Type
    Type
    System.EventHandler<CancelEventArgs>

    PopupLayoutLoaded

    This event will be fired whenever the Syncfusion.XForms.PopupLayout has completed loading and is added to the visual tree.

    Declaration
    public event EventHandler PopupLayoutLoaded
    Event Type
    Type
    System.EventHandler

    Implements

    System.IDisposable
    Back to top Generated by DocFX
    Copyright © 2001 - 2025 Syncfusion Inc. All Rights Reserved