问题描述
我正在尝试创建我的第一个 Xamarin 表单应用程序。这是我第一个使用 C# 的应用程序,也是我的第一个 Xamarin 应用程序,所以当我在 Visual Studio 2019 中创建项目时,我使用为我提供“汉堡菜单”的模板运行。我在 youtube 上找到了使用 Rg.Plugins 的快速指南调用弹出窗口。我尝试做同样的事情,我可以看到它确实有效,因为弹出页面是使用淡入动画呈现的。渲染后,它就消失了,并且底层页面正在“变灰”,因此它似乎处于活动状态,但我根本看不到它。 我的猜测是它与我的其他元素的绘制方式有关,还是因为我使用了汉堡菜单模板?如果有人知道发生了什么,我会很高兴:) 我一直在使用 iOS 模拟器来测试应用程序。
在“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,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å "Monitorer uden patient identifikation"." 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"/>
<Label TextColor="{StaticResource Sekundær}" FontSize="12" Padding="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" 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" 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">
<StackLayout BackgroundColor="{StaticResource Sekundær}" Padding="0,10,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,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">
<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);
}
}
}
这是一张可以在它消失之前看到它淡入的图片:
解决方法
您明确将 Opacity
设置为 0
Content.FadeTo(0,5);