Titanium / Appcelerator - 使用选择器获取时间,生成具有本地时差的日期对象

时间:2017-01-12 18:55:08

标签: javascript date titanium appcelerator appcelerator-titanium

我正在使用选择器(Ti.UI.Picker)并将类型设置为Ti.UI.PICKER_TYPE_TIME。目的是允许用户更改数据库中日期条目的时间。日期存储在UTC时间戳中。流程如下:

  1. 用户打开控制器
  2. 日期从数据库中提取,并使用moment.utc()方法存储为Moment JS日期对象。
  3. 用户选择打开选择器以更改时间
  4. moment.toDate()方法用于将所需的日期对象传递给选择器
  5. 选择器打开的时间根据手机上的时区设置进行了更正,例如:+ 1小时。
  6. 当用户完成时,选择器返回一个日期对象,结果时间不是他们选择的时间;在这种情况下,它是-1小时。
  7. 我认为通过使用moment.utc(),我可以避免这种情况。但也许选择器会使用普通的JavaScript日期对象执行一些内部操作,从而及时进行调整。

    有解决方法吗?我的目标是;如果原始时间是13:00,我希望选择器在13:00打开,然后如果用户将其更改为15:00,我希望选择器的结果为15:00,相应的标签显示为15:00。

    以下是一些示例代码

    var moment = require('alloy/moment');
    
    var time_unix = 1396815002000;
    var date_obj = moment.utc(time_unix);
    
    function updateTimeLabel() {
        $.timeLabel.setText(date_obj.format('HH:mm'));
    }
    
    function onTimeClick() {
        var pickerView = Titanium.UI.createView({
            backgroundColor: "#FFF",
            height: 280,
            bottom :-280,
            zIndex: 1000
        }); 
        var cancel = Ti.UI.createButton({
            title:'Cancel',
            style: Ti.UI.iPhone.SystemButtonStyle.BORDERED
        }); 
        var done = Ti.UI.createButton({ 
            title:'Done',   
            style: Ti.UI.iPhone.SystemButtonStyle.DONE
        });     
        var spacer = Ti.UI.createButton({
            systemButton: Ti.UI.iPhone.SystemButton.FLEXIBLE_SPACE
        });
        var toolbar = Ti.UI.iOS.createToolbar({
            top: 0,
            barColor: '#000',
            items:[cancel,spacer,done]
        });
        var picker = Ti.UI.createPicker({
            type: Ti.UI.PICKER_TYPE_TIME,
            value: date_obj.toDate(), // does the problem occur here?
            minDate: new Date('1950-01-01'),
            maxDate: new Date('2050-01-01'),
            top: 45
        });
        cancel.addEventListener('click', function () {
            console.log('cancel pressed');
            pickerView.animate({bottom: 0, duration: 500});
        });
        done.addEventListener('click', function (evt) {
            date_obj = moment.utc(picker.getValue());
            updateTimeLabel(); // result is 1 hour less than picker
            pickerView.animate({bottom: -280, duration: 500});
        });
        pickerView.add(toolbar);
        pickerView.add(picker);
        $.win.add(pickerView);
        // picker opens with time that is +1 hour
        pickerView.animate({bottom: 0, duration: 500});
    }
    
    
    $.win.open();
    updateTimeLabel();
    

    截图 Screen shot of Ti.UI.Picker showing incorrect time

4 个答案:

答案 0 :(得分:1)

在我的情况下,我使用时刻格式方法设置默认值,以及简单的日期和时间:

picker.setValue(moment(someTime).format("YYYY-MM-DD"));

和时间选择器:

picker.setValue(moment(someTime).format("HH:mm"));

完美无缺

答案 1 :(得分:1)

我遇到了完全相同的问题,但意识到-1小时的差异是由于夏令时,将localeString()附加到返回值为我修复它。

答案 2 :(得分:0)

使用(unix)时间戳存储日期/时间。但是在显示它时,您使用momentJS时区: http://momentjs.com/timezone/

另一方面,您可能“想”听取更改事件以更新标签。

答案 3 :(得分:-1)

快速“猜测”。你现在有机会在一个有夏令时的地方吗?

据我所知,“UTC”(不是Moment特有的)是没有夏令时的“真实”GMT时间。所以可以成为戏弄你的东西。

如果是这样,您是否可以“转换”UTC时间以显示用户“本地”时间内的“相同”小时数(或者至少进行夏令时修正)?然后在用户关闭对话框后转换回来。

有人可能会给你一个更好的解释 - 和解决方案; - )

/约翰