Есть ли способ создать всплывающее окно в формах Xamarin (шаблон программного обеспечения - mvvm), без использования плагинов? - PullRequest
1 голос
/ 09 января 2020

Я пытаюсь создать всплывающее окно, чтобы напомнить пользователю отправить или сделать некоторые другие функции. Есть ли у кого-нибудь идея? Спасибо,

Ответы [ 3 ]

0 голосов
/ 10 января 2020

Для своих приложений я использую класс App.xaml.cs , вот пример, который я использую для отображения ContentView поверх ContentPage , если прямое содержимое ContentPage представляет собой AbsoluteLayout:

App.xaml.cs

        public static void ShowPopup()
        {
            //Get current Page, we assume it's a ContentPage
            var mainPage = App.Current.MainPage as ContentPage;
            //Get the content of that Page, we assume it's an AbsoluteLayout
            var current = mainPage.Content as AbsoluteLayout;
            //Add WaitPopup.cs as a child
            current.Children.Add(new WaitPopup());
            //Re-load the view
            mainPage.Content = current;
        }

        public static void RemovePopup()
        {
            //Get current Page, we assume it's a ContentPage
            var mainPage = Current.MainPage as ContentPage;
            //Get the content of that Page, we assume it's an AbsoluteLayout
            var current = mainPage.Content as AbsoluteLayout;
            //Remove the child from the AbsoluteLayout, in this example it will be WaitPopup
            current.Children.RemoveAt(1);
            //Re-load the view
            mainPage.Content = current;
        }

WaitPopUp.cs , мне нравится создавать всплывающее окно, используя c#, но вы можете создать новый файл .xaml и показать его вместо этого, если вы будете sh.

public class WaitPopup : ContentView
    {
        public WaitPopup()
        {
            /* We assume we are adding this to an AbsoluteLayout */
            AbsoluteLayout.SetLayoutBounds(this, new Rectangle(0, 0, 1, 1));
            AbsoluteLayout.SetLayoutFlags(this, AbsoluteLayoutFlags.All);
            /*I add opacity so that it looks more like a popup,change background to Transparent if you want this to look more like a true pop up */
            BackgroundColor = Color.White;
            Opacity = 0.77;
            /* All of this content is optional, apply whatever you wish to your PopUp */
            Content = new StackLayout
            {
                /* */
                VerticalOptions = LayoutOptions.Center,
                HorizontalOptions = LayoutOptions.Center,
                /* */
                Children = {
                    /* */
                    new Image {
                        Source = "logo.png",
                        Aspect = Aspect.AspectFill,
                        Margin = new Thickness(100,30,100,20)
                    },
                    /* */
                    new Label {
                        Text = "Espera...",
                        TextColor = Color.Black,
                        HorizontalOptions = LayoutOptions.Center,
                        VerticalOptions = LayoutOptions.Center,
                        VerticalTextAlignment = TextAlignment.Center
                    },
                }
            };
            //Optional, do not use if you do not understand animations
            RotateLogo();
        }
        private void RotateLogo()
        {
            //uint duration = 10 * 60 * 1000;
            var sLayout = this.Content as StackLayout;
            var logo = sLayout.Children[0] as Image;
            logo.RotateYTo(4 * 360, 10000);
        }
    }

Пример .xaml-файла, который будет работать с WaitPopup, помните, технически вы можете сделать это всплывающее окно совместимым с любым макетом, но для этого примера мы предполагаем, что каждая страница имеет AbsoluteLayout, так как содержимое, и что, когда мы добавляем WaitPopUp.cs, это второй дочерний элемент в массиве Children AbsoluteLayout:

<?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:d="http://xamarin.com/schemas/2014/forms/design"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d"
             x:Class="CALogin.Views.LoginPage"
             xmlns:vm="clr-namespace:CALogin.ViewModels">
    <ContentPage.BindingContext>
        <vm:LoginViewModel/>
    </ContentPage.BindingContext>
    <ContentPage.Content>
        <AbsoluteLayout x:Name="MasterLayout" VerticalOptions="FillAndExpand"
                    HorizontalOptions="FillAndExpand" Padding="0">
            <Grid x:Name="MasterGrid" BackgroundColor="Gray">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                <Grid.RowDefinitions>
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>
                <!-- Place all of your normal page content here, inside this "MasterGrid" -->
                <!-- When you call ShowPopup(), WaitPopup will be added as the 2nd child of the AbsoluteLayout -->
                <!-- WaitPopup will fill and expand the entire screen, overlapping MasterGrid -->
            </Grid>
        </AbsoluteLayout>
    </ContentPage.Content>
</ContentPage>

Если вы хотите добавить ViewModel, вы можете сделать это без проблем с BindingContext в WaitPopup.CS

Ура!

0 голосов
/ 10 января 2020

Согласно вашему описанию, вы хотите создать всплывающее окно без использования плагинов, я использую Collectionview для создания настраиваемого всплывающего окна и задаю isvisible как false по умолчанию, вы можете посмотреть:

MainPage.xaml:

 <ContentPage.Content>
    <AbsoluteLayout
        Padding="0"
        HorizontalOptions="FillAndExpand"
        VerticalOptions="FillAndExpand">
        <StackLayout
            AbsoluteLayout.LayoutBounds="0, 0, 1, 1"
            AbsoluteLayout.LayoutFlags="All"
            BackgroundColor="Azure">
            <StackLayout HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand">
                <Label
                    FontAttributes="Bold"
                    FontSize="Medium"
                    HorizontalOptions="Center"
                    Text="Xamarin Monkeys" />
                <Image
                    x:Name="imgMonkey"
                    HeightRequest="200"
                    Source="a11.jpg"
                    WidthRequest="200" />
                <Button
                    Clicked="btnPopupButton_Clicked"
                    HorizontalOptions="Center"
                    Text="Show Popup"
                    VerticalOptions="Center" />
            </StackLayout>
        </StackLayout>

        <!--  Popup Area  -->
        <ContentView
            x:Name="popupLoginView"
            Padding="10,0"
            AbsoluteLayout.LayoutBounds="0, 0, 1, 1"
            AbsoluteLayout.LayoutFlags="All"
            BackgroundColor="#C0808080"
            IsVisible="false">

            <StackLayout HorizontalOptions="Center" VerticalOptions="Center">
                <StackLayout
                    BackgroundColor="White"
                    HeightRequest="200"
                    Orientation="Vertical"
                    WidthRequest="300">
                    <Entry Margin="20,20,20,10" Placeholder="Enter Username" />
                    <Entry Margin="20,0,20,0" Placeholder="Enter Password" />
                    <Button Margin="20,0,20,0" Text="Login" />

                </StackLayout>

            </StackLayout>

        </ContentView>
    </AbsoluteLayout>

private void btnPopupButton_Clicked(object sender, EventArgs e)
    {
        popupLoginView.IsVisible = true;
    }

Вот снимок экрана:

enter image description here

Вы можете использовать Collectionview для создания различных всплывающих окон на разных страницах контента.

0 голосов
/ 10 января 2020

Xamarin.Forms позволяет отображать оповещения (простое сообщение с кнопкой «ОК»), «Действия» (выбор между различными параметрами) и «Подсказки» (для ввода текста). Вот документация .

Если вы хотите создать и отобразить свое собственное представление со связанной моделью представления, вам нужно будет использовать стороннюю библиотеку. Rg.Plugins.Popup , кажется, самый популярный выбор на мой взгляд.

...