Блог

Главная - Вопросы по программированию - В Xamarin.Формы как установить всплывающую страницу в нужное положение с помощью RG.Плагин?

В Xamarin.Формы как установить всплывающую страницу в нужное положение с помощью RG.Плагин?

#xamarin #xamarin.forms #popup

#xamarin #xamarin.forms #всплывающее окно

Вопрос:

Я установил пакет Nuget Rg.plugins.popup. Попытался установить всплывающую страницу, которая должна отображаться справа. Пробовал разные способы, но не смог найти решение

 <pages:PopupPage.Animation>

    <animations:MoveAnimation 
     PositionIn="Right"
     PositionOut="Right"
     DurationIn="300"
     DurationOut="300"
     EasingIn="SinOut"
     EasingOut="SinIn"
     HasBackgroundAnimation="True"/>

 </pages:PopupPage.Animation>

Любое решение с помощью плагина RG?

Комментарии:

1. Может быть, Rg.plugins.popup это можно сделать. Следует отметить, что формат написания вопроса требует внимания, и вы можете поделиться изображением желаемого эффекта, что будет полезно.

Ответ №1:

Речь идет не об анимации, которая будет управлять только внешним видом. Вы должны убедиться, что содержимое всплывающей страницы правильно упорядочено. Например, вот 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="MyApp.Views.RandomPopupPage">
    <StackLayout
        BackgroundColor="White"
        HorizontalOptions="End"
        VerticalOptions="Start"
        Margin="20"
        WidthRequest="100"
        HeightRequest="100"
        Spacing="0">
        <Label
            VerticalTextAlignment="Center"
            HorizontalTextAlignment="Center"
            VerticalOptions="Center"
            HorizontalOptions="Center"
            Text="Some text here" />
    </StackLayout>
</pages:PopupPage>

Он имеет StackLayout, выровненный по вертикали с началом (ВВЕРХУ) и выровненный по горизонтали с концом (справа). Он также имеет фиксированную ширину и высоту. Вы должны расположить ее элементы так, как вы делаете с обычной страницей, имея в виду, что она имеет прозрачный фон.

Это выглядит так: см. Изображение

Ответ №2:

Попытался установить всплывающую страницу, которая должна отображаться справа.

Из документа Rg.plugins.popup можно настроить анимацию следующим образом:

Создайте класс UserAnimation

 class UserAnimation : MoveAnimation
{
    private double _defaultTranslationY;

    public UserAnimation()
    {
        DurationIn = DurationOut = 300;
        EasingIn = Easing.SinOut;
        EasingOut = Easing.SinIn;
        PositionIn = MoveAnimationOptions.Right;
        PositionOut = MoveAnimationOptions.Right;
    }
    //1
    public override void Preparing(View content, PopupPage page)
    {
        base.Preparing(content, page);
        page.IsVisible = false;
        if (content == null) return;
        _defaultTranslationY = content.TranslationY;

    }

    //3
    public override void Disposing(View content, PopupPage page)
    {
        base.Disposing(content, page);
        page.IsVisible = true;
        if (content == null) return;
        content.TranslationY = _defaultTranslationY;

    }
    //2
    public async override Task Appearing(View content, PopupPage page)
    {
        var taskList = new List<Task>();
        taskList.Add(base.Appearing(content, page));
        if (content != null)
        {
            var topOffset = GetTopOffset(content, page);
            var leftOffset = GetLeftOffset(content, page);
            taskList.Add(content.TranslateTo(content.Width, _defaultTranslationY, DurationIn, EasingIn));
        };

        page.IsVisible = true;
        await Task.WhenAll(taskList);
    }
    //4
    public async override Task Disappearing(View content, PopupPage page)
    {
        var taskList = new List<Task>();
        taskList.Add(base.Disappearing(content, page));
        if (content != null)
        {
            _defaultTranslationY = content.TranslationX - content.Width;

            var topOffset = GetTopOffset(content, page);
            var leftOffset = GetLeftOffset(content, page);

            taskList.Add(content.TranslateTo(leftOffset, _defaultTranslationY, DurationOut, EasingOut));
        };

        await Task.WhenAll(taskList);
    }
}

Используйте его в Xaml:

 <pages:PopupPage.Animation>
    <animations:UserAnimation/>
</pages:PopupPage.Animation>

Не уверен, что приведенный ниже эффект — это то, что вы хотите, но вы можете использовать этот метод для настройки анимации.

введите описание изображения здесь

Метки: