• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
NFC Development with Qt - v2.2.0 (5. November 2012)
 

NFC Development with Qt - v2.2.0 (5. November 2012)

on

  • 32,703 views

Learn developing Near Field Communication (NFC) apps for Nokia's Symbian and MeeGo phones with step-by-step tutorials! ...

Learn developing Near Field Communication (NFC) apps for Nokia's Symbian and MeeGo phones with step-by-step tutorials!

The three development options Qt, Symbian native and Java ME are outlined. A more detailed explanation shows the Qt Mobility 1.2 APIs to create modern NFC applications for smartphones.

In the final part, step-by-step hands-on tutorials walk you through developing your first two NFC apps. The first demo extends an example from the Qt SDK with reading & writing both URI and text NDEF records to create new sticky notes on the virtual corkboards visible on the screen. The second demo uses the LLCP protocol to create a peer-to-peer chat application between two NFC Forum compatible devices.

Statistics

Views

Total Views
32,703
Views on SlideShare
11,397
Embed Views
21,306

Actions

Likes
7
Downloads
788
Comments
6

39 Embeds 21,306

http://mobilesq.net 19717
http://www.symbiantweet.com 566
http://jerryfahrni.com 534
http://lovemynokia.com 264
http://paper.li 55
http://thepockettech.com 25
http://www.google.com.eg 21
http://webcache.googleusercontent.com 18
http://www.nokianews.hu 17
https://www.google.com 9
http://www.google.com.sa 9
http://www.google.com 9
http://fahrni.blogspot.com 7
http://translate.googleusercontent.com 5
https://www.google.com.sa 5
https://www.google.iq 4
http://www.google.com.kw 4
http://www.google.ae 4
http://bambeero.com 3
https://www.google.com.eg 3
http://www.google.fi 3
http://www.google.jo 3
http://www.google.iq 2
http://twitter.com 2
http://us-w1.rockmelt.com 2
http://www.twylah.com 2
https://www.google.se 1
http://www.google.de 1
http://www.google.com.tr 1
http://www.google.it 1
http://feeds.feedburner.com 1
http://www.google.pl 1
http://feeds.feedburner.com 1
http://www.google.com.lb 1
http://a0.twimg.com 1
http://www.google.at 1
https://www.google.ps 1
https://www.google.jo 1
https://www.google.com.my 1
More...

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel

16 of 6 previous next Post a comment

  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
  • NFC with Qt
    Excellent info
    Are you sure you want to
    Your message goes here
    Processing…
  • Thank you Andreas for this interesting presentation.
    Could you please provide some hint/link on which device and development environment can be used to work in Card Emulation mode? Thanks.
    Are you sure you want to
    Your message goes here
    Processing…
  • @dkainer: auto-starting Qt apps in response to custom records on an NFC tag will be supported by Qt as well - see the Qt Mobility documentation for more information. This is not yet enabled with the current beta releases. If you need autostart-functionality right now, you can simply adapt the Symbian C++ example: https://projects.developer.nokia.com/nfccontenthandlerplugin
    Are you sure you want to
    Your message goes here
    Processing…
  • @mossmatt: Sure, NFC device kits are still available - just sign up for the Nokia Developer Launchpad program to access it. More information: http://www.developer.nokia.com/Community/Wiki/Developing_NFC_Applications#Obtaining_an_NFC_enabled_phone
    Are you sure you want to
    Your message goes here
    Processing…
  • Are NFC Device Kits still available? I would like to start developing a few ideas for apps.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    NFC Development with Qt - v2.2.0 (5. November 2012) NFC Development with Qt - v2.2.0 (5. November 2012) Presentation Transcript

    • NFC Developmentwith Qt on Symbian and MeeGoAndreas Jakl NFC Introduction Related Presentations bit.ly/NfcIntro[@mopius] Windows (Phone) 8 NFC App Scenariosnfcinteractor.com bit.ly/NFCAppScenariosTechnology WizardNokia NFC Development on the Windows 8 Platform bit.ly/Win8NFC 1 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl NFC Forum and the NFC Forum logo are trademarks of the Near Field Communication Forum.
    • NFC Development2 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • NFC Development Alternatives Java ME Qt Mobility Symbian Native Windows Phone 8Works on Series 40 and Cross-platform API. Low level control over Proximity APIs Symbian devices. devices’ NFC support. Best flexibility and Similar on Windows 8 Limited use of More complex, platformsmartphone features. ease of app knowledge required. Extra presentation: development. bit.ly/Win8NFC Lumia 610 NFC – WP7 bit.ly/WpNfc 3 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • NFC Developer Offering Tools Channel Qt Development Qt SDK 1.2 Qt Mobility 1.2 Nokia Store Symbian Development NFC Collection Symbian Belle SDK Java ME development Nokia 6212 Classic NFC SDK or Symbian Belle SDK4 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Java ME NFC Development Both free IDEs come with extensive, generic Java ME support on board. Extend with Nokia 6212 Classic NFC SDK (or Symbian Belle SDK)* * http://www.developer.nokia.com/Community/Wiki/Developing_NFC_Applications#Java_ME_based_development5 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Contactless Communication API • JSR 257 – Tag discovery and data exchange – NDEF messages • Example project: Nfc Creator – https://projects.developer.nokia.com/ nfccreator6 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Symbian Platform NFC API• Exposes NFC middleware at the platform level – Aimed at Symbian platform developers – Platform specific coding/skills needed – Low abstraction• Development – Carbide.c++ IDE – Symbian Belle SDK – Optional: Qt for Symbian7 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Qt Mobility NFC8 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • What is Qt? Using Qt SDK for – Dev. environment – Testing – Translation Publish to – Help – Nokia Store (Symbian, MeeGo) Developer App Source Code – Windows – Linux Using Qt framework for – Mac – User Interface – Embedded – Networking – Location (GPS) – Web integration – ...9 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Qt NFC Development • Requirements – Qt SDK 1.2 – Contains: Qt 4.7.4, Qt Mobility 1.2 – Windows: Nokia Suite • Symbian – Nokia C7 / 801T with Symbian Anna / Belle or 603 / 700 / 701 / 808 with Nokia Belle+ – Install Qt SDK’s Symbian Anna or Belle target * • MeeGo More information: bit.ly/StartNfc – Nokia N9 – Install Qt SDK’s MeeGo Harmattan target10 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl * Apps compiled with the Symbian Anna target are compatible to Symbian^3, Anna & Belle.
    • Qt Mobility Mobility 1.1 Mobility 1.0 Camera Bearer Management API Document Gallery Contacts Feedback Location Landmarks Messaging Maps/Navigation Multimedia Organizer Publish and Subscribe Service Framework – Out of process Service Framework Mobility 1.2 Sensors System Information Connectivity (Bluetooth, NFC) Versit11 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Qt Mobility 1.2 NFC• Interact with – NFC Forum tags – Target detection – NDEF message handlers – Reading and writing NDEF messages – Send tag specific commands – Register for app autostart on tag touch – NFC Forum devices – LLCP peer-to-peer sockets12 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • API Overview** Not a class diagram, but explains sequential usage order QNearFieldManager QLlcpServer Detects and filters Listen for new server targets socket connections. QNearFieldTarget QNdefMessage Query properties, QLlcpSocket Collection of 0 or more read/write messages, Read / write data. For records send commands or server & client sockets. establish a client socket QNdefRecord Generic NFC Access to NDEF data. Subclasses for handling Tag access specific details. Peer to peer 13 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Qt NFC Source Code• Qt Mobility is Open Source – How does a method work? How to make best use of it? Take a look at the source code!• Download complete source package – Latest source: http://qt.gitorious.org/qt-mobility/ – Find implementation in: C:QtMobilitysrcconnectivitynfc14 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Refresh your Qt Knowledge• The following tutorials require basic C++ & Qt skills• Need more?15 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Nfc Corkboard https://projects.developer.nokia.com/nfccorkboards Tasks – Extend Qt SDK example with NFC: Touch tag to create note – Qt Quick based UI – C++ based NFC – Integrate C++ with QML16 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Importing the Example• From Qt Creator’s Getting Started screen – Search for Corkboards example – Or open: C:QtSDKExamples4.7declarative toyscorkboardscorkboards.pro17 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Choosing Targets• Select at least the Symbian Anna target – Qt 4.7.4 & Qt Mobility 1.2 is required18 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Test!• Connect phone via USB ^ – Ovi/Nokia Suite mode – Start CODA on device• Check Selected Symbian target Device is recognized Play to compile and deploy!19 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • We will add this:App Overview ndefmanager.cpp/.h NFC Tag discovery and reading main.cpp corkboards.qml Day.qml Application startup UI definition Delegate for drawing Loads and shows Defines data model the UI for a single day corkboards.qml and view Interaction for notes20 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Model, View & Delegate ListModel ListView Delegate Defines free-form list Shows data from a Template defining each data source model in a list item instantiated by the view Container for Horizontal or vertical ListElement definitions in: corkboards.qml in: corkboards.qml in: Day.qml id: list id: flickable21 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Add Connectivity• Edit the Qt project file (corkboards.pro) – Uncomment & add mobility component: connectivity CONFIG += mobility MOBILITY += connectivity – Add LocalServices Capability (for Symbian) symbian:TARGET.CAPABILITY += NetworkServices LocalServices Allows Internet access Allows NFC22 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Good to Know: Symbian Security ** Qt apps are native apps; therefore, the security model of the target operating system applies.1. Determine the required security / privacy features – Most common: (See: developer.nokia.com/Community/Wiki/Capabilities) Feature Capability Internet access, telephony, messaging NetworkServices Access location (GPS, etc.) Location Camera, record audio UserEnvironment Basic / User Capabilities Contacts, Calendar ReadUserData / WriteUserData Bluetooth, NFC LocalServices Extended / System IMEI, model name, battery status ReadDeviceData Capabilities2. Add to Qt project file (.pro) symbian:TARGET.CAPABILITY += Location LocalServices23 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Good to Know: Symbian Security3. Get the right certificate during development No / Basic Capabilities Extended Capabilities Use auto-generated self signed certificate Sign up for Nokia Publish account (€1) (default, no action required) publish.nokia.com Request development certificate (free) developer.nokia.com/Distribute/Packaging_and_signing.xhtml Sign your app (Qt Creator build settings) Test on your develoment device(s)24 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Good to Know: Symbian Security 4. Publish No / Basic Capabilities Extended Capabilities Sign up for Nokia Publish account (€1) publish.nokia.com Request unique UID in 0x2... range and development certificate (free) developer.nokia.com/Distribute/Packaging_and_signing.xhtml Package your Qt app with the Smart Installer (Qt Creator build settings)Need Certified Signed capabilities? Publish to the Nokia Storedeveloper.nokia.com/Community/Wiki/Capabilities-> Purchase a Publisher ID ($200 / year)Submit to Certified Signed process @ www.symbiansigned.com 25 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • NdefManager• New C++ class – Right-click the project → Add New ... → C++ Class – Class name: NdefManager – Base class: QObject26 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Qt Meta-Object System• C++ extended with QObject – Introspection: meta-information at runtime – Inter-object communication: signals & slots – Parent / Child hierarchy: easier memory management27 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Include• Headers, define member variable ndefmanager.h #include <qnearfieldmanager.h> #include <qndeffilter.h> #include <qnearfieldtarget.h> #include <qndefmessage.h> #include <qndefrecord.h> #include <qndefnfcurirecord.h> #include <QUrl> #include <QDebug> // we will test first! QTM_USE_NAMESPACE // Use Qt Mobility namespace [...] private: QNearFieldManager *nfcManager;28 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Start Waitingndefmanager.cppNdefManager::NdefManager(QObject *parent) : QObject(parent){ // NdefManager (this) is the parent; will automatically delete nfcManager nfcManager = new QNearFieldManager(this); nfcManager->setTargetAccessModes(QNearFieldManager::NdefReadTargetAccess); // React only to Uri records (NfcRtd, "U") QNdefFilter filter; filter.appendRecord<QNdefNfcUriRecord>(); nfcManager->registerNdefMessageHandler(filter, this, SLOT(targetDetected(QNdefMessage,QNearFieldTarget*))); // Get notified when the tag gets out of range connect(nfcManager, SIGNAL(targetLost(QNearFieldTarget*)), this, SLOT(targetLost(QNearFieldTarget*)));} 29 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Signals & Slots• Signal – Emitted when a particular event occurs (e.g., clicked()) – Qt objects: predefined signals – Also create your own signals• Slot – Function called in response to a signal – Qt objects: predefined slots (e.g., quit()) – Also create your own slots• Connection signals  slots established by developer, handled by Qt framework 30 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Signals & Slots• Type safe – Signal signature must match signature of receiving slot – (Slot might also have shorter signature and ignore the rest of the arguments)• Loosely coupled – Emitter doesn’t know or care which slots receive signal – Information encapsulation• Integrated, independent components – Slots are normal C++ member functions – Don’t know if signals are connected to them31 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Lost & Found• Methods to handle lost & found tags = Slots ndefmanager.h private slots: void targetDetected(const QNdefMessage &message, QNearFieldTarget *target); void targetLost(QNearFieldTarget *target);• Tip – Alt + Enter, and Qt Creator writes the .cpp method definition!32 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • React• New target: write debug output to console for now ndefmanager.cpp void NdefManager::targetDetected(const QNdefMessage &message, QNearFieldTarget *target) { qDebug() << "Uri Target detected!"; }• Target out of range: delayed object delete ndefmanager.cpp void NdefManager::targetLost(QNearFieldTarget *target) { target->deleteLater(); }33 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Register C++ with QML• Make your C++ class available in QML – QML Name: NdefManager – QML Library: Nfc 1.0 main.cpp #include <QtDeclarative> #include "ndefmanager.h" int main(int argc, char *argv[]) { QApplication app(argc, argv); qmlRegisterType<NdefManager>("Nfc", 1, 0, "NdefManager"); [...] }34 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • NdefManager in QML• Import module corkboards.qml import Nfc 1.0• Create Instance corkboards.qml NdefManager { id: ndefManager }35 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Test! #2• Run the app• Touch a URI formatted NDEF tag• Observe the Application Output36 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Parse Tag & Emit Contents• Revisit and extend the target detection slot ndefmanager.cpp void NdefManager::targetDetected(const QNdefMessage &message, QNearFieldTarget *target) { qDebug() << "Uri Target detected!"; // Go through all records in the message foreach (const QNdefRecord &record, message) { // Check type again, just to make sure if (record.isRecordType<QNdefNfcUriRecord>()) { // Convert to the specialized URI record class QNdefNfcUriRecord uriRecord(record); // Emit a signal with the URI emit nfcReadTagUri(uriRecord.uri()); } } }37 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Define the Signal• Signals have no implementation – They represent information, not a method to execute ndefmanager.h signals: void nfcReadTagUri(const QUrl& nfcTagUri);38 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Create new Notes• Handle our new signal – on<signal> : <javascript code> – Get current corkboard page → append new notes element → key: “noteText”, value: URI from NDEF messagecorkboards.qmlNdefManager { id: ndefManager onNfcReadTagUri: list.get(flickable.currentIndex).notes.append({"noteText":nfcTagUri})}39 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Test! #3• Touch Uri-formatted NDEF NFC tags to create notes on the current page!40 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Interactive Nfc Corkboard https://projects.developer.nokia.com/nfccorkboards Tasks – Extend previous example – React to any kind of tags – Write tags by pressing the red flag while touching a tag41 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Overview – BeforeRegister NDEF filters and detect targetsQNdefFilter filter;filter.appendRecord<QNdefNfcUriRecord>();nfcManager->registerNdefMessageHandler(filter, this, SLOT(targetDetected(QNdefMessage,QNearFieldTarget*))); Signal is only emitted when a tag containing all records defined in the filter are found The slot directly gets the NDEF message void targetDetected(const QNdefMessage &message, QNearFieldTarget *target);42 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Overview – AfterDetect any kind of targetsconnect(nfcManager, SIGNAL(targetDetected(QNearFieldTarget*)), this, SLOT(targetDetected(QNearFieldTarget*)));nfcManager->startTargetDetection(); Signals is emitted for every target that is detected void targetDetected(QNearFieldTarget *target); { const bool hasNdefMessage = target->hasNdefMessage(); if (hasNdefMessage) { connect(target, SIGNAL(ndefMessageRead(QNdefMessage)), this, SLOT(ndefMessageRead(QNdefMessage))); target->readNdefMessages(); } } Another signal is emitted when reading the message from the target is finished void NdefManager::ndefMessageRead(const QNdefMessage &message) ;43 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • React to all targets• Generic target detection instead of listening to specific tag message(s) – Remove previous targetDetected() with two parametersndefmanager.hpublic slots: void nfcWriteTag(const QString& nfcTagText); // Newprivate slots: void targetDetected(QNearFieldTarget *target); // Modified from prev. void ndefMessageRead(const QNdefMessage &message); // Newprivate: QNearFieldTarget *cachedTarget; // New 44 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Start Generic Target Detection ndefmanager.cpp NdefManager::NdefManager(QObject *parent) : QObject(parent) { // [...] // React only to Uri records (NfcRtd, "U") QNdefFilter filter; filter.appendRecord<QNdefNfcUriRecord>(); nfcManager->registerNdefMessageHandler(filter, this, SLOT(targetDetected(QNdefMessage,QNearFieldTarget*))); // Get notified when the tag gets out of range connect(nfcManager, SIGNAL(targetLost(QNearFieldTarget*)), this, SLOT(targetLost(QNearFieldTarget*))); connect(nfcManager, SIGNAL(targetDetected(QNearFieldTarget*)), this, SLOT(targetDetected(QNearFieldTarget*))); nfcManager->startTargetDetection(); }45 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Read NDEF Message• Detected a target? Read its message. ndefmanager.cpp void NdefManager::targetDetected(QNearFieldTarget *target) { qDebug() << "Target detected!"; const bool hasNdefMessage = target->hasNdefMessage(); if (hasNdefMessage) { connect(target, SIGNAL(ndefMessageRead(QNdefMessage)), this, SLOT(ndefMessageRead(QNdefMessage))); target->readNdefMessages(); } // Cache target to member variable for writing cachedTarget = target; }46 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Target Lost• Set cached target to NULL ndefmanager.cpp void NdefManager::targetLost(QNearFieldTarget *target) { cachedTarget = NULL; // New target->deleteLater(); }47 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Parse NDEF Message• Same code as before, different method ndefmanager.cpp void NdefManager::ndefMessageRead(const QNdefMessage &message) { // Go through all records in the message foreach (const QNdefRecord &record, message) { // Check type if (record.isRecordType<QNdefNfcUriRecord>()) { // Convert to the specialized URI record class QNdefNfcUriRecord uriRecord(record); // Emit a signal with the URI emit nfcReadTagUri(uriRecord.uri()); } } }48 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Write URI Ndef Message ndefmanager.cpp void NdefManager::nfcWriteTag(const QString &nfcTagText) { // The device currently has a target in reach if (cachedTarget) { // Convert text to a URI, adding missing http:// if necessary QUrl convertedUrl = QUrl::fromUserInput(nfcTagText); // Check if it is a valid URL if (convertedUrl.isValid() && nfcTagText.contains(.)) { QNdefMessage message; // Create a URI NDEF record QNdefNfcUriRecord uriRecord; uriRecord.setUri(convertedUrl); message.append(uriRecord); qDebug() << "Writing URI ..."; // Write NDEF message to the tag cachedTarget->writeNdefMessages(QList<QNdefMessage>() << message); } else { qDebug() << "No valid URI"; } } else { qDebug() << "No cached target available"; } }49 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Extend UI with Write Button Day.qml, between lines 122 / 123 (below MouseArea with id: mouse) Image { id: writeButton source: "NfcFlag.png" rotation: -8 // Note image itself is rotated anchors { bottom: parent.bottom; right:parent.right } MouseArea { anchors.fill: parent onClicked: ndefManager.nfcWriteTag(myText.text) } } NfcFlag.png <project dir>qml50 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Test! https://projects.developer.nokia.com/nfccorkboards• Touch a tag, at the same time press the NFC flag of a note – Writes the note text to the tag The extended solution on Nokia Developer Projects handles – Remember to enter a valid URI! additional record types and potential errors.51 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Nfc Chat https://projects.developer.nokia.com/nfcchat Tasks – Develop an NFC chat from scratch – NFC Peer to Peer mode – LLCP Protocol (server & client sockets) – Qt Quick UI52 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • App Overview main.cpp main.qml nfcpeertopeer.cpp/.h Application startup UI definition Target discovery Loads and shows Defines data model NFC Peer to peer main.qml and view sockets (client & server)53 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • New Project• Qt Quick Application – Name: NfcChat – Built-in elements only – Targets: Symbian Device (including Symbian Anna) – Accept defaults for the rest54 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Add Connectivity• Edit the Qt project file (nfcchat.pro) – Uncomment & add mobility component: connectivity CONFIG += mobility MOBILITY += connectivity – Add LocalServices Capability symbian:TARGET.CAPABILITY += NetworkServices LocalServices Allows Internet access Allows NFC55 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • UI Design – NFC Send Button• Button Image – Copy NfcButton.png to the project’s qml folder C:QtdevNfcChatqmlNfcChatNfcButton.png• Open Switch to UI Designer for main.qml• Create the Button Image – From Library → Resources: drag the button image to the top right window corner – In Properties, change the id to “sendButton” – In Properties → Layout, set top and right anchors to “Parent (rectangle1)” (Margin: 0)• Interactivity – From Library → Items: drag the “Mouse Area” on top of the button image (gets a child in the Navigator – drag the “mouse_area1” on the “sendButton” if it isn’t) – In Properties Layout, set anchors to fill the parent 56 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • UI Design – Message Editor• Hello World cleanup – Delete the “Hello World” text and the window-wide mouse area• Text Edit element – From Library → Items: drag the “Text Edit” element to the top left window corner – In Properties, change the Id to “sendTextEdit” – In Properties → TextEdit, change the text to “Hello NFC” – In Properties → TextEdit, change the font size to 10 points – In Properties → Layout, set top and left anchors to “Parent (rectangle1)” and the right anchor to “sendButton” (Margin: 0) 57 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • UI Design – Message View• ListView – Will display messages stored in a data model – From Library → Items: drag the “List View” element to the window – In Properties, change the id to “messageView” – In Properties → Layout, set top anchor to “sendButton”. Other edges: “Parent (rectangle1)”. All Margin: 0. 58 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • NfcPeerToPeer• Go to the “Edit” view• New C++ class – Right-click the project → Add New ... → C++ Class – Class name: NfcPeerToPeer – Base class: QObject59 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Include• Headers, define member variable nfcpeertopeer.h #include <qnearfieldmanager.h> #include <qllcpserver.h> #include <qllcpsocket.h> QTM_USE_NAMESPACE // Use Qt Mobility namespace [...] private: QLatin1String nfcUri; QNearFieldManager *nfcManager; QLlcpServer *nfcServer; QLlcpSocket *nfcClientSocket; QLlcpSocket *nfcServerSocket;60 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Search for Targets• Save own unique service Uri and start target detectionnfcpeertopeer.cppNfcPeerToPeer::NfcPeerToPeer(QObject *parent) : QObject(parent), nfcUri("urn:nfc:xsn:nokia.com:nfcchat"){ nfcManager = new QNearFieldManager(this); connect(nfcManager, SIGNAL(targetDetected(QNearFieldTarget*)), this, SLOT(targetDetected(QNearFieldTarget*))); connect(nfcManager, SIGNAL(targetLost(QNearFieldTarget*)), this, SLOT(targetLost(QNearFieldTarget*))); // Only detect other NFC devices. Leave the phone to handle NFC tags. nfcManager->startTargetDetection(QNearFieldTarget::NfcForumDevice);}61 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Signals & Slots• Handle targets nfcpeertopeer.h private slots: void targetDetected(QNearFieldTarget *target); void targetLost(QNearFieldTarget *target);• Emit chat messages to the UI nfcpeertopeer.h signals: void chatMessage(const QString& nfcClientMessage);62 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • React• New target: emit info message nfcpeertopeer.cpp void NfcPeerToPeer::targetDetected(QNearFieldTarget *target) { emit chatMessage("Target detected"); }• Target out of range: emit message & delayed object delete nfcpeertopeer.cpp void NfcPeerToPeer::targetLost(QNearFieldTarget *target) { target->deleteLater(); emit chatMessage("Target lost"); }63 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Register C++ with QML• Make your C++ class available in QML – QML Name: NfcPeerToPeer – QML Library: NfcPeerToPeer 1.0 main.cpp #include <QtDeclarative> #include "nfcpeertopeer.h" int main(int argc, char *argv[]) { QApplication app(argc, argv); qmlRegisterType<NfcPeerToPeer>("NfcPeerToPeer", 1, 0, "NfcPeerToPeer"); [...] }64 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • NfcPeerToPeer in QML• Import module main.qml import NfcPeerToPeer 1.0• Update the list model when a NFC chat message arrives main.qml NfcPeerToPeer { id: nfcPeerToPeer onChatMessage: { messageModel.append( {"chatMessage": nfcClientMessage} ) } } ListModel { id: messageModel } ListView { model: messageModel delegate: Text { text: chatMessage } // [...] }65 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Test!• Run the app on two phones – Switch phones in the Run Settings• Touch both phones – Admire how they detect each other!66 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • NFC LLCP Server Socket• Define slots for new server connections & sending text nfcpeertopeer.h public slots: void sendText(const QString& text); private slots: void handleNewConnection();• Listen for new server connections nfcpeertopeer.cpp NfcPeerToPeer::NfcPeerToPeer(QObject *parent) // [...] nfcServer = new QLlcpServer(this); connect(nfcServer, SIGNAL(newConnection()), this, SLOT(handleNewConnection())); nfcServer->listen(nfcUri); }67 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Connections & Sending• Create a socket for a new server connection nfcpeertopeer.cpp void NfcPeerToPeer::handleNewConnection() { if (nfcServerSocket) { nfcServerSocket->deleteLater(); } nfcServerSocket = nfcServer->nextPendingConnection(); }• Slot to send chat messages over the server socket nfcpeertopeer.cpp void NfcPeerToPeer::sendText(const QString& text) { if (nfcServerSocket && nfcServerSocket->isOpen()) { nfcServerSocket->write(text.toUtf8()); emit chatMessage("Message sent"); } }68 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Sending Chat Messages• Call the sendText() slot in MouseArea’s onClicked handler main.qml onClicked: nfcPeerToPeer.sendText(sendTextEdit.text)69 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • NFC LLCP Client Socket• Define slot to read incoming text nfcpeertopeer.h private slots: void readText();• Create the client socket (to be connected to NFC targets) nfcpeertopeer.cpp NfcPeerToPeer::NfcPeerToPeer(QObject *parent) // [...] nfcClientSocket = new QLlcpSocket(this); connect(nfcClientSocket, SIGNAL(readyRead()), this, SLOT(readText())); }70 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Connections & Reading• Connect the socket to a target in targetDetected() nfcpeertopeer.cpp nfcClientSocket->connectToService(target, nfcUri);• Read text from the socket and emit a signal nfcpeertopeer.cpp void NfcPeerToPeer::readText() { QByteArray rawData = nfcClientSocket->readAll(); QString data = QString::fromUtf8(rawData.constData(), rawData.size()); emit chatMessage(data); }• Cleanup in targetLost() nfcpeertopeer.cpp nfcClientSocket->disconnectFromService(); 71 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Test! #2 https://projects.developer.nokia.com/nfcchat The extended solution on Nokia Developer Projects includes MeeGo support, cached text sending, error handling and is based on• Touch upper back of two phones Qt Quick Components. Note: if installing the solution, uninstall your own app first to avoid a name conflict.. – While touching, press the send button72 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • NFC Summary73 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Nfc Examples http://www.nfcinteractor.com/ Tech. Tag / p2p Showcase Powerful tag & NDEF reading, dynamic NDEF message Nfc Interactor Qt Tag composer, reusable tag handling classes, Nfc detection Higher-level tag reading / writing, app autostart, Nfc Nfc Corkboard Qt Tag detection Nfc Chat Qt p2p p2p data transfer, Nfc detection Nfc Creator Java ME Tag Tag reading / writing Nfc Settings Qt Quick Qt - Nfc detection Nfc Content Handler Plug-in Symbian Tag App autostart Nfc NPP Example Qt p2p p2p data transfer (Google NPP protocol) Nfc Peer-to-Peer Example Qt p2p p2p data transfer Simple LLCP Chat Java ME p2p p2p data transfer http://www.developer.nokia.com/Develop/NFC/Code_examples/74 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Summary developer.nokia.com/NFC Design Develop Distribute Guidelines75 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
    • Thank You.Andreas Jakl NFC Introduction Related Presentations bit.ly/NfcIntro[@mopius] Windows (Phone) 8 NFC App Scenariosnfcinteractor.com bit.ly/NFCAppScenariosTechnology WizardNokia NFC Development on the Windows 8 Platform bit.ly/Win8NFC 76 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl