Xamarin.Forms 弹出窗口中的日期选择器

Question

我通过 MVVM 使用 Xamarin.Forms 创建了一个项目，我想在其中生成一个弹出窗口，通过数据选择器接受两个数据。用户应指定开始日期和结束日期。由于我在其他地方已经需要它，所以我已经下载了 ACR.UserDialogs NuGet 包。我还设置了一个 DialogService，其中对话框接收三个字符串参数，并且实际上想要数据选择器的类似解决方案。有人知道我该怎么做吗？

Answer 1

Nuget 包：rg.plugins.popup、propertychanged.fody

MainView.xaml:

<?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:datepickerpopup="clr-namespace:DatePickerPopup"
             x:Class="DatePickerPopup.MainPage">
    <ContentPage.BindingContext>
        <datepickerpopup:MainViewModel/>
    </ContentPage.BindingContext>
    <StackLayout>
        <Button Text="Open Popup"
                Command="{Binding OpenPopup_Command}"
                />

        <Label Text="{Binding SetDates_.StartDate}"/>
        <Label Text="{Binding SetDates_.EndDate}"/>
    </StackLayout>

</ContentPage>

MainViewModel.cs

using Rg.Plugins.Popup.Services;
using System;
using System.Collections.Generic;
using System.Text;
using Xamarin.Forms;

namespace DatePickerPopup
{
    public class MainViewModel : BaseViewModel
    {
        public SetDates SetDates_ { get; set; } = new SetDates();


        public Command OpenPopup_Command => new Command(async () => 
        {
            DatePickerPop pop = new DatePickerPop();
            var vm = pop.BindingContext as DatePickerViewModel;
            vm.Save_Command = PopupSave_Command;
            await PopupNavigation.Instance.PushAsync(pop);
        });

        public Command PopupSave_Command => new Command(async(param) => 
        {
            SetDates_ = param as SetDates;
            await PopupNavigation.Instance.PopAllAsync();
        });

    }
}

DatePickerPop.xaml

<?xml version="1.0" encoding="utf-8" ?>
<animations:PopupPage  xmlns:animations="http://rotorgames.com"
                       xmlns="http://xamarin.com/schemas/2014/forms"
                        xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
                       xmlns:datepickerpopup="clr-namespace:DatePickerPopup"
                       x:Class="DatePickerPopup.DatePickerPop">
    <animations:PopupPage.BindingContext>
        <datepickerpopup:DatePickerViewModel/>
    </animations:PopupPage.BindingContext>
    <StackLayout VerticalOptions="Center"
                 HorizontalOptions="Center"
                 BackgroundColor="White">
        <DatePicker Date="{Binding SetDates_.StartDate}"/>
        <DatePicker Date="{Binding SetDates_.EndDate}"/>

        <Button Text="Save"
                Command="{Binding Save_Command}"
                CommandParameter="{Binding SetDates_}"/>
        <Button Text="Cancel"
                Command="{Binding Cancel_Command}"/>
    </StackLayout>
</animations:PopupPage>

DatePickerViewModel.cs

using Rg.Plugins.Popup.Services;
using System;
using System.Collections.Generic;
using System.Text;
using Xamarin.Forms;

namespace DatePickerPopup
{
    public class DatePickerViewModel : BaseViewModel
    {
        public SetDates SetDates_ { get; set; } = new SetDates();
        public Command Save_Command { get; set; }
        public Command Cancel_Command => new Command(async () => 
        await PopupNavigation.Instance.PopAsync());
    }
}

SetDates.cs

using System;
using System.Collections.Generic;
using System.Text;

namespace DatePickerPopup
{
    public class SetDates : BaseViewModel
    {
        public DateTime StartDate { get; set; }
        public DateTime EndDate { get; set; }
    }
}

Xamarin.Forms 弹出窗口中的日期选择器

Xamarin.Forms Datepicker in PopUp

xamarin.forms

mvvm

uwp

datepicker

popup