使用 Cordova 集成多个日历

Posted

技术标签:

【中文标题】使用 Cordova 集成多个日历【英文标题】:Multiple Calendars integration using Cordova 【发布时间】:2018-07-14 23:28:34 【问题描述】:

我正在为我的 android 应用程序使用 cordova 和 ionic。我需要集成多个日历以将事件添加到不同的日历。

我已经检查了一些其他应用程序,这些应用程序填充了 Android 设备中添加的帐户列表,并且事件被添加到填充列表中的选定帐户中。 [账号可以是google/outlook等]

我想知道是否有任何方法可以使用cordova实现与上述相同的效果。我正在使用https://www.npmjs.com/package/cordova-plugin-calendar,它允许我添加到设备中的默认日历。但我需要填充设备中添加的所有帐户并将事件添加到选定的帐户日历。

任何帮助表示赞赏。

【问题讨论】:

【参考方案1】:

要选择特定日历,您首先需要使用listCalendars() 列出可用的日历。 您可以使用它向用户显示可用日历的列表,并允许他们选择一个。 用户选择日历后,您可以在创建活动时将其详细信息传递给 createEventWithOptions()

例如,像这样的:

var calendars = [];

var selectedCalendar;

var onDeviceReady = function()
    window.plugins.calendar.listCalendars(function(_calendars)
        _calendars.forEach(function(_calendar)
            if(cordova.platformId === "android")
                // Omit Contacts from Android calendar list
                if(!_calendar.name.match(/Contacts/i))
                    calendars.push(_calendar);
                
            else //cordova.platformId === "ios"
                // Omit Birthdays and Subscriptions as they are read-only
                if(!_calendar.type.match(/Subscription/i) && !_calendar.type.match(/Birthday/i))
                    calendars.push(_calendar);
                
            
        );
    , function(err)
        console.error('Error listing calendars: ' + err);
    );
;
document.addEventListener("deviceready", onDeviceReady, false);

// Call this to display the list of available calendars for the user to choose from
// TODO implement calendar picker UI
var displayCalendars = function()
    calendars.forEach(function(calendar)
        var id = calendar.id;
        var name = calendar.name;
        var displayName = calendar.displayname || calendar.name;

        //TODO generate calendar picker UI entry
    );
;


// TODO call this when user has selected a calendar entry in the picker UI
var selectCalendar = function(id, name)
    selectedCalendar = 
        id: id,
        name: name
    ;


// TODO call this to add event to selected calendar
var createEvent = function(title, location, startDateTime, endDateTime, notes)
    // Generate options for selected calendar
    var calOptions = window.plugins.calendar.getCalendarOptions();
    calOptions.calendarId = selectedCalendar.id;
    calOptions.calendarName = selectedCalendar.name;

    // Add event to selected calendar
    window.plugins.calendar.createEventWithOptions(
        title,
        location,
        notes,
        startDateTime,
        endDateTime,
        calOptions,
        function()
            console.log("Successfully added to calendar");
        ,
        function(err)
            console.error("Error adding to calendar: " + err);
        
    );
;

【讨论】:

window.plugins.calendar.createEventInteractively() 非常适合我。您的回答帮助我更多地探索插件。+1 :)

以上是关于使用 Cordova 集成多个日历的主要内容,如果未能解决你的问题,请参考以下文章

Cordova IOS 7.1 日历是只读的。

Cordova 日历插件添加与会者

已有iOS项目集成cordova并使用wkwebview

混合应用程序中的日历样式日期选择器(Cordova/Phonegap)

Cordova与现有框架的结合,Cordova插件使用教程,Cordova自定义插件,框架集成Cordova,将Cordova集成到现有框架中

适用于 iOS 的 Phonegap/Cordova 日历插件无响应