locked
How can overlay a stackLayout with another existing stacklayout? RRS feed

  • Question

  • User382545 posted

    So I have this BaseMainPage and I need it so I can have a Icon on all my page's navigation bar. And when I click this icon, I want a StackLayout to overlay the current displaying page... This is my BaseMainPage. xaml:

    <ContentPage xmlns="
                 x:Class="OficinaDigitalX   .Views  .BaseMainPage">
        <ContentPage.ToolbarItems>
            <ToolbarItem Icon="notes" Clicked="ShowNotes_Clicked"/>
        </ContentPage.ToolbarItems>
    
        <StackLayout x:Name="NotesView" 
                     HorizontalOptions="FillAndExpand" 
                     VerticalOptions="FillAndExpand"  
                     BackgroundColor="Gray"
                     AbsoluteLayout.LayoutBounds="0,0,1,1" 
                     AbsoluteLayout.LayoutFlags="All"
                     Margin="50, 0, 0, 50">
        </StackLayout>
    </ContentPage>
    

    This is my BaseMainPage .xaml .cs:

    public partial class BaseMainPage : ContentPage
        {
            public bool isNotesOpened = false;
    
            public BaseMainPage()
            {
                InitializeComponent();
            }
    
            public void ShowNotes_Clicked(object sender, EventArgs e)
            {
                if (!isNotesOpened)
                {
                    NotesView .TranslateTo(0, 0, 200);
                    isNotesOpened = true;
    
                }
    
                else if (isNotesOpened)
                {
                    NotesView .TranslateTo(550, 0, 200);
                    isNotesOpened = false;
                }
            }
    

    This is "MyCar.xaml.cs"

    public partial class MyCar : BaseMainPage
    public MyCar()
            {
                InitializeComponent();
                BindingContext = new MyCarViewModel(Navigation);
            }
    

    And my "MyCar.xaml"

    <views:BaseMainPage xmlns="
            xmlns:android="clr-namespace:Xamarin. Forms. PlatformConfiguration. AndroidSpecific;assembly=Xamarin .Forms. Core"
            xmlns:views="clr-namespace:OficinaDigitalX .Views"   
            xmlns:customControls="clr-namespace:OficinaDigitalX. ViewModel"
            x:Class="OficinaDigitalX. Views. MyCar"
                        Title="Os Meus Carros">
        <views:BaseMainPage. Content>
            <AbsoluteLayout>
    
        ////My Code
    </views:BaseMainPage.  Content>
    </views:BaseMainPage> 
    

    So the thing here is, the icon is perfect, and I get to the "shownotesclicked" code when I click the Icon... but I think my "notesView" stack layout is getting behind the new layout I'm creating within the pages that inherit from it... So the question here is: Pretending I'm on MyCar page, how can I overlay the page with the StackLayout "NotesView" from BaseMainPage?

    The gray area is what I want to do, and the black area is tha page I'm currently in

    Thursday, February 14, 2019 10:21 AM

Answers

  • User359363 posted

    Have a look at: https://github.com/rotorgames/Rg.Plugins.Popup

    Rg.Plugins.Popup - is a cross platform plugin for Xamarin.Forms which allows to open Xamarin.Forms pages as a popup that can be shared across iOS, Android and UWP (macOS supporting will be soon). Also the plugin allows to use very simple and flexible animations for showing popup pages

    • Marked as answer by Anonymous Thursday, June 3, 2021 12:00 AM
    Friday, February 15, 2019 1:04 AM

All replies

  • User359363 posted

    Have a look at: https://github.com/rotorgames/Rg.Plugins.Popup

    Rg.Plugins.Popup - is a cross platform plugin for Xamarin.Forms which allows to open Xamarin.Forms pages as a popup that can be shared across iOS, Android and UWP (macOS supporting will be soon). Also the plugin allows to use very simple and flexible animations for showing popup pages

    • Marked as answer by Anonymous Thursday, June 3, 2021 12:00 AM
    Friday, February 15, 2019 1:04 AM
  • User382545 posted

    thank's a lot, this is very helpfull!

    Friday, February 15, 2019 3:42 PM