时间戳

首页 > 解决方案 > Xamarin 表单中的弹出窗口在调用后迅速消失（Rg.Plugin）

c# - Xamarin 表单中的弹出窗口在调用后迅速消失（Rg.Plugin）

问题描述

我正在尝试创建我的第一个 Xamarin 表单应用程序。这是我的第一个使用 C# 的应用程序，也是我的第一个 Xamarin 应用程序，因此当我在 Visual Studio 2019 中创建项目时，我使用提供“汉堡菜单”的模板运行。我在 youtube 上找到了使用 Rg.Plugins 的快速指南调用弹出窗口。我尝试做同样的事情，并且我可以看到它确实有效，因为弹出页面是使用淡入淡出的动画呈现的。一旦它被渲染，它就会消失，并且底层页面正在“变灰”，所以它似乎是活动的，但我根本看不到它。我的猜测是它与我的其他元素的绘制方式有关，还是因为我使用了汉堡菜单模板？如果有人知道发生了什么，我会很高兴 :) 我一直在使用 iOS 模拟器来测试应用程序。

下面是调用弹出窗口的页面的 XAML：

在“Clicked="PopupCPR_clicked" 上调用的“Frontpage”：

<?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="EWSMonitor.Views.Monitorering"
             xmlns:vm="clr-namespace:EWSMonitor.ViewModels"
             Title="{Binding Title}">
    
    <ContentPage.BindingContext>
        <vm:MonitoreringModel />
    </ContentPage.BindingContext>
    
    <ContentPage.Resources>
        <ResourceDictionary>
            <Color x:Key="Accent">#2a2b2b</Color>
        </ResourceDictionary>
    </ContentPage.Resources>

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <BoxView Color="{StaticResource Primary}" Grid.Column="0" Grid.RowSpan="2"/>


        
        <StackLayout BackgroundColor="{StaticResource Primary}" VerticalOptions="FillAndExpand" HorizontalOptions="Fill">
            <StackLayout Orientation="Horizontal" HorizontalOptions="Center" VerticalOptions="Center">
                <ContentView Padding="0,40,0,40" VerticalOptions="FillAndExpand">
                    <Image Source="logo.png" VerticalOptions="Center" HeightRequest="100" />
                </ContentView>
            </StackLayout>
        </StackLayout>
        <ScrollView Grid.Row="1">
            <StackLayout Orientation="Vertical" Padding="30,24,30,24" Spacing="10" WidthRequest="200">
                <Label TextColor="{StaticResource Sekundær}" Text="Indtast patient ID (CPR) eller klik på &quot;Monitorer uden patient identifikation&quot;." FontSize="20"/>
                <Label TextColor="{StaticResource Sekundær}" Text="Du kan vælge at scanne patientens armbånd eller indtast CPR nummer manuelt! Benyt altid en scanner hvor det er muligt!" FontSize="16" Padding="0,0,0,0"/>
                <Label TextColor="{StaticResource Sekundær}" FontSize="12" Padding="0,24,0,0">
                    <Label.FormattedText>
                        <FormattedString>
                            <FormattedString.Spans>
                                <Span Text="Fremsøg patient: "/>
                                <!-- <Span Text="https://aka.ms/xamarin-quickstart" FontAttributes="Bold"/> -->
                            </FormattedString.Spans>
                        </FormattedString>
                    </Label.FormattedText>
                </Label>

                
                
                
                
                <Grid VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"></RowDefinition>
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*"></ColumnDefinition>
                        <ColumnDefinition Width="*"></ColumnDefinition>
                    </Grid.ColumnDefinitions>
                    <!--Command="{Binding OpenWebCommand}"-->
                    <Button Margin="1,1,1,1" x:Name="PopupCPR" Text="Indtast CPR"
                        Clicked="PopupCPR_clicked"
                        BackgroundColor="{StaticResource Sekundær}"
                        TextColor="{StaticResource Primary}"
                        CornerRadius="5" WidthRequest="150" HeightRequest="30" Grid.Row="0" Grid.Column="0" />
                    <Button Margin="1,1,1,1" Text="Monitorer uden patientidentifikation"
                        Command="{Binding OpenWebCommand}"
                        BackgroundColor="{StaticResource Sekundær}"
                        TextColor="{StaticResource Primary}"
                        CornerRadius="5" WidthRequest="150" HeightRequest="30" Grid.Row="0" Grid.Column="1" />
                    
                    

                </Grid>
            </StackLayout>
        </ScrollView>
    </Grid>
</ContentPage>

xaml.cs 文件：

using Rg.Plugins.Popup.Services;
using System;
using System.ComponentModel;
using Xamarin.Forms;
using Xamarin.Forms.Xaml;

namespace EWSMonitor.Views
{
    public partial class Monitorering : ContentPage
    {
        public Monitorering()
        {
            InitializeComponent();
        }

        private PopupCPR _PopupCPR;
        private async void PopupCPR_clicked(object sender, EventArgs e)
        {

            _PopupCPR = new PopupCPR();
            await PopupNavigation.Instance.PushAsync(_PopupCPR);
           
            
        }

    }
}

然后弹出页面xaml：

<?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="EWSMonitor.Views.PopupCPR"
             xmlns:vm="clr-namespace:EWSMonitor.ViewModels"
             Title="{Binding Title}">
    <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>

    <StackLayout VerticalOptions="Center" HorizontalOptions="FillAndExpand" Padding="20, 20, 20, 20">
        <StackLayout BackgroundColor="{StaticResource Sekundær}" Padding="0, 10, 0, 0">
            <Label Text="Dette er et fedt pop-up vindue" TextColor="{StaticResource Primary}" FontSize="20" HorizontalOptions="Center"></Label>
            <ScrollView>
                <StackLayout>
                    <StackLayout Orientation="Horizontal">
                        <Entry Placeholder="Test Entry"
                               HorizontalOptions="FillAndExpand"
                               BindingContext="{x:Reference Switch}"
                               IsEnabled="{Binding Path=IsToggled}"
                               PlaceholderColor="Silver"
                               Keyboard="Email"
                               TextColor="Gray"></Entry>
                        <Switch IsToggled="True" x:Name="Switch"></Switch>
                    </StackLayout>
                    <ActivityIndicator Color="Gray" IsRunning="True"></ActivityIndicator>
                    <Slider Value="0.4" x:Name="Slider"></Slider>
                    <ProgressBar BindingContext="{x:Reference Slider}" Progress="{Binding Path=Value}"></ProgressBar>
                    <Button Text="Close" TextColor="{StaticResource Sekundær}" Clicked="OnClose"></Button>
                </StackLayout>
            </ScrollView>
            
        </StackLayout>
        
        
    </StackLayout>

    <!--  <ContentView x:Name="popupCPRVindue" BackgroundColor="{StaticResource Sekundær}" Padding="10,0" IsVisible="true" AbsoluteLayout.LayoutBounds="0, 0, 1, 1">
        <StackLayout VerticalOptions="Center" HorizontalOptions="Center">
            <Label Text="Hejsa" />
            <Button Text="Luk" TextColor="{StaticResource Sekundær}" Clicked="OnClose"></Button>

        </StackLayout>

    </ContentView>
    -->
<!--
    <StackLayout 
        VerticalOptions="Center" 
        HorizontalOptions="Center" 
        Padding="20, 20, 20, 20">
        <Label
            Text="Dette er en stor fed TEST" TextColor="{StaticResource Sekundær}"/>
        <Button Text="Luk" TextColor="{StaticResource Sekundær}" Clicked="OnClose"></Button>
    </StackLayout>
    
    -->
</pages:PopupPage>

以及弹出页面的 xaml.cs：

using Rg.Plugins.Popup.Pages;
using Rg.Plugins.Popup.Services;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

using Xamarin.Forms;
using Xamarin.Forms.Xaml;

namespace EWSMonitor.Views
{
    [XamlCompilation(XamlCompilationOptions.Compile)]
    public partial class PopupCPR : PopupPage
    {
        public PopupCPR()
        {
            InitializeComponent();
        }

        private async void OnClose(object sender, EventArgs e)
        {
            await PopupNavigation.Instance.PopAsync();
        }

        protected override Task OnAppearingAnimationEndAsync()
        {
            return Content.FadeTo(0, 5);
        }

        protected override Task OnAppearingAnimationBeginAsync()
        {
            return Content.FadeTo(1);
        }
    }
}

这是一张在它消失之前可以看到它淡入的图片：

在它消失之前弹出

标签： c#xamarinxamarin.forms

解决方案

您明确将 设置Opacity为 0

Content.FadeTo(0, 5);

推荐阅读