Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Native Development

Reply
Developer
Posts: 889
Registered: ‎08-31-2009
My Device: 9530, 9630, 9800, 8530, 9900, 9810, 9930, PlayBook, Dev Alpha
My Carrier: Verizon

Format a Date in QML

Is there a good way to format a Date in QML.

 

I realize that I can attach an external javascript library or just do it by hand, but I feel like there has got to be a better way to do this that I am not seeing. Is there?


Read my thoughts on BlackBerry Development at news.ebscer.com
Developer
Posts: 581
Registered: ‎10-17-2010
My Device: (BlackBerry Z10)-> Q10/Passport Dual Use

Re: Format a Date in QML

You can format the date without using external Javascript libraries.

 

Check out QDateTime

 

In you header include

 #include <QDateTime>


Doc Reference
https://developer.blackberry.com/cascades/reference/qdatetime.html


Formatting Example

 QTime time1 = QTime::fromString("131", "HHh");
 // time1 is 13:00:00
 QTime time1 = QTime::fromString("1apA", "1amAM");
 // time1 is 01:00:00

 QDateTime dateTime2 = QDateTime::fromString("M1d1y9800:01:02",
                                             "'M'M'd'd'y'yyhh:mm:ss");
 // dateTime is 1 January 1998 00:01:02



 QDateTime now = QDateTime::currentDateTime();
 QDateTime xmas(QDate(now.date().year(), 12, 25), QTime(0, 0));
 qDebug("There are %d seconds to Christmas", now.secsTo(xmas));

 
Using this you could just create a general date class. Register a context type. Maybe add a parameter to your methods (like the current date, or output format flags).

 

 

Good luck.

New Contributor
Posts: 7
Registered: ‎11-22-2010
My Device: Not Specified

Re: Format a Date in QML

[ Edited ]

If you are working with QDate and QDateTime then to format dates from QML, use Qt.formatDate and Qt.formatDateTime

 

https://developer.blackberry.com/cascades/reference/qml-qt.html#formatDate-method

 

ie.

 

Label {

    text: Qt.formatDate(_controller.theDate,"ddd dd.MM.yy")

}

 

OR

Label {

    text: Qt.formatDateTime(_controller.theDateTime,"ddd dd.MM.yy hh:mmAP")

}

Developer
Posts: 6,473
Registered: ‎12-08-2010
My Device: PlayBook, Z10
My Carrier: none

Re: Format a Date in QML

The Qt namespace is available automatically in QML at all times, so you can use Qt.formatDate() and some of the related functions.  Some of the functions on that page don't appear to be functional in Cascades QML, however.. I'm thinking specifically of openUrlExternally(), and the color-related items which seem to return Color objects that are incompatible with the Cascades Color stuff.


Peter Hansen -- (BB10 and dev-related blog posts at http://peterhansen.ca.)
Author of White Noise and Battery Guru for BB10 and for PlayBook | Get more from your battery!
Developer
Posts: 20
Registered: ‎10-09-2010
My Device: Bold 9700
My Carrier: Base (Belgium)

Re: Format a Date in QML

Converting date strings isn't a 1-line action in QML. How to convert date strings coming from a JSON is shown in this gist.

Developer
Posts: 6,473
Registered: ‎12-08-2010
My Device: PlayBook, Z10
My Carrier: none

Re: Format a Date in QML

Here's another one I've been using. I didn't write it.. should be findable on the web somewhere too, though I may have modified the name.

    function parseISO8601(str) {
        try {
            // we assume str is a UTC date ending in 'Z'
            var _date = new Date();
            var parts = str.split('T'),
                dateParts = parts[0].split('-'),
                timeParts = parts[1].split('Z'),
                timeSubParts = timeParts[0].split(':'),
                timeSecParts = timeSubParts[2].split('.'),
                timeHours = Number(timeSubParts[0]);

            _date.setUTCFullYear(Number(dateParts[0]));
            _date.setUTCMonth(Number(dateParts[1])-1);
            _date.setUTCDate(Number(dateParts[2]));
            _date.setUTCHours(Number(timeHours));
            _date.setUTCMinutes(Number(timeSubParts[1]));
            _date.setUTCSeconds(Number(timeSecParts[0]));
            if (timeSecParts[1])
                _date.setUTCMilliseconds(Number(timeSecParts[1]));
            // by using setUTC methods the date has already been converted to local time(?)
            return _date;
        }
        catch (error) {
            return null;
        }
    }

 


Peter Hansen -- (BB10 and dev-related blog posts at http://peterhansen.ca.)
Author of White Noise and Battery Guru for BB10 and for PlayBook | Get more from your battery!