SlideShare a Scribd company logo
NFC Development
with Qt on Symbian and MeeGo


Andreas Jakl                                                      NFC Introduction



                                          Related Presentations
                                                                  bit.ly/NfcIntro
[@mopius]
                                                                  Windows (Phone) 8 NFC App Scenarios
nfcinteractor.com                                                 bit.ly/NFCAppScenarios
Technology Wizard
Nokia                                                             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 Development


2   © 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 8
Works 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, platform
smartphone 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 SDK




4   © 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_development
5   © 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/
                                                 nfccreator



6   © 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 Symbian
7      © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
Qt Mobility NFC


8   © 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 target

10    © 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)
     Versit


11       © 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 sockets

12     © 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:QtMobilitysrcconnectivitynfc

14      © 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 QML




16   © 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.pro




17      © 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 required




18      © 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 notes

20         © 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: flickable



21   © 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 NFC


22      © 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
                                                                                                      Capabilities
2. Add to Qt project file (.pro)
      symbian:TARGET.CAPABILITY += Location LocalServices

23          © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
Good to Know: Symbian Security
3. 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 Store
developer.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: QObject



26      © 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
      management




27      © 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 Waiting
ndefmanager.cpp
NdefManager::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 them

31      © 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 Output




36    © 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 message
corkboards.qml
NdefManager {
    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 tag




41   © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
Overview – Before
Register NDEF filters and detect targets

QNdefFilter 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 – After
Detect any kind of targets
connect(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 parameters
ndefmanager.h
public slots:
    void nfcWriteTag(const QString& nfcTagText);                                           // New
private slots:
    void targetDetected(QNearFieldTarget *target);                                         // Modified from prev.
    void ndefMessageRead(const QNdefMessage &message);                                     // New
private:
    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>qml
50   © 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 UI




52   © 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 rest



54      © 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 NFC


55      © 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: QObject

59      © 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 detection
nfcpeertopeer.cpp
NfcPeerToPeer::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 button




72      © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
NFC Summary


73   © 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
     Guidelines




75   © 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 Scenarios
nfcinteractor.com                                                bit.ly/NFCAppScenarios
Technology Wizard
Nokia                                                            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

More Related Content

What's hot (20)

PPTX
Near Field Communication by Mohammed Mudassir
Mohammed Mudassir
 
PPTX
La technologie NFC
Poken_fr
 
PPTX
Near Field Communication (NFC Architecture and Operating Modes)
Deepak Kl
 
PPTX
Webinar on Insider's Insight into NFC
Endeavour Software Technologies
 
PDF
Windows Phone 8 NFC Quickstart
Andreas Jakl
 
PDF
Wireless sensor networks using android virtual devices and near field
Nicolas Kockel
 
PDF
Designing low costs sensor system for the Internet of Things
Andreas Schaller
 
PDF
New use cases thanks to adding crypto to RFID tags
Ihar Bayarenka
 
PDF
Near Field Communication (NFC)
Seminar Links
 
PPTX
Android Basic Presentation (Introduction)
RAHUL TRIPATHI
 
PPTX
NFC TECHNOLOGY
GOPINATH MAHAKUD
 
PPTX
Near field communication
Jwal Dakwala
 
DOC
Near Field Communication (NFC) technology
Ishtdeep Hora
 
PPTX
Near Field Communication(NFC)
Amit Patel
 
PPTX
Near field communication
Rahul Patil
 
PDF
Nfc security shane_turner_spring2013
Shane Turner
 
PPTX
Near field communication
Sanchit Chopra
 
PPT
NFC Basic Concepts
Ade Okuboyejo
 
PPT
Nfc kdr
Shahul Hameed
 
Near Field Communication by Mohammed Mudassir
Mohammed Mudassir
 
La technologie NFC
Poken_fr
 
Near Field Communication (NFC Architecture and Operating Modes)
Deepak Kl
 
Webinar on Insider's Insight into NFC
Endeavour Software Technologies
 
Windows Phone 8 NFC Quickstart
Andreas Jakl
 
Wireless sensor networks using android virtual devices and near field
Nicolas Kockel
 
Designing low costs sensor system for the Internet of Things
Andreas Schaller
 
New use cases thanks to adding crypto to RFID tags
Ihar Bayarenka
 
Near Field Communication (NFC)
Seminar Links
 
Android Basic Presentation (Introduction)
RAHUL TRIPATHI
 
NFC TECHNOLOGY
GOPINATH MAHAKUD
 
Near field communication
Jwal Dakwala
 
Near Field Communication (NFC) technology
Ishtdeep Hora
 
Near Field Communication(NFC)
Amit Patel
 
Near field communication
Rahul Patil
 
Nfc security shane_turner_spring2013
Shane Turner
 
Near field communication
Sanchit Chopra
 
NFC Basic Concepts
Ade Okuboyejo
 
Nfc kdr
Shahul Hameed
 

Viewers also liked (18)

PPTX
NFC technical presentation
Akshat Rohatgi
 
PPTX
Near field communication (nfc) technology
Ankur Sharma
 
KEY
NFC & RFID on Android
todbotdotcom
 
PPTX
Tap into NFC Meetup - Boston
NFC Forum
 
PPT
Architecture and Development of NFC Applications
Thomas de Lazzari
 
PPTX
Near field communication
Nagesh Mishra
 
PPTX
Nfc technology ppt
Symbioun Technologies Inc.USA
 
PPTX
NFC Technology
Neha Singh
 
PPTX
NEAR FIELD COMMUNICATION
Harisankar U K
 
PPTX
Vodafone Cash Service - NFC tag
Deyaa Ahmed
 
PPTX
Nfc tutorial
Roy Chen
 
PDF
Guide du tag NFC : quels usages dans quels contextes ?
Olivier Devillers
 
PDF
droidcon 2012: What's the Hack is NFC .., Hauke Meyn, NXP
Droidcon Berlin
 
PPTX
Nfc
Rahul Anand
 
PPSX
Nfc-Full Presentation
DILIN RAJ DS
 
PPTX
NFC(Near Field Communication)
ADARSH KUMAR
 
PPTX
Near field communication new
Sanu Varghese
 
PPTX
Near field Technology
shrien_sahi
 
NFC technical presentation
Akshat Rohatgi
 
Near field communication (nfc) technology
Ankur Sharma
 
NFC & RFID on Android
todbotdotcom
 
Tap into NFC Meetup - Boston
NFC Forum
 
Architecture and Development of NFC Applications
Thomas de Lazzari
 
Near field communication
Nagesh Mishra
 
Nfc technology ppt
Symbioun Technologies Inc.USA
 
NFC Technology
Neha Singh
 
NEAR FIELD COMMUNICATION
Harisankar U K
 
Vodafone Cash Service - NFC tag
Deyaa Ahmed
 
Nfc tutorial
Roy Chen
 
Guide du tag NFC : quels usages dans quels contextes ?
Olivier Devillers
 
droidcon 2012: What's the Hack is NFC .., Hauke Meyn, NXP
Droidcon Berlin
 
Nfc-Full Presentation
DILIN RAJ DS
 
NFC(Near Field Communication)
ADARSH KUMAR
 
Near field communication new
Sanu Varghese
 
Near field Technology
shrien_sahi
 
Ad

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

PDF
Qt App Development for Symbian & MeeGo - v3.4.6 (17. January 2012)
Andreas Jakl
 
PDF
Meego Italian Day 2011 – Andrea Grandi
Francesco Baldassarri
 
PDF
Dominik Gusenbauer Qt Mobility
NokiaAppForum
 
PDF
Nokia Developer Offering Update
Janaina Pilomia
 
PDF
Quickstart: Qt for Windows, Symbian and Maemo / Meego v2.0.8 (January 10th, 2...
Andreas Jakl
 
PDF
Nicholas Foo
riteshrajgupta
 
PDF
Nicholas Foo
fndc
 
PDF
Qt in depth - presentation for Symbian expo 2009
Nokia
 
PDF
Symbian OS - Mopoid Next Gen - Slides
Andreas Jakl
 
PPT
Mobile Bootcamp Presentation: Mobile Application Development Platforms
Wilfred Mutua Mworia
 
PPTX
Bam amor mobile development tools
Bam Amor
 
PDF
Mobile stategy
Burhan Surti
 
PDF
Google Android Naver 1212
Yoojoo Jang
 
PDF
Introduction to nfc_v1_1_en
open-src
 
PDF
Introduction to nfc_v1_1_en
Somasundaram Jambunathan
 
PPT
Introduction to android
Jawad Mohmand
 
PDF
Software development with qt
NokiaAppForumBulgaria
 
PDF
Software development with qt
NokiaAppForumSerbia
 
PPTX
Android Development Workshop
Muthu Kumar
 
PPSX
Android Introduction
Sharmistha Mandal
 
Qt App Development for Symbian & MeeGo - v3.4.6 (17. January 2012)
Andreas Jakl
 
Meego Italian Day 2011 – Andrea Grandi
Francesco Baldassarri
 
Dominik Gusenbauer Qt Mobility
NokiaAppForum
 
Nokia Developer Offering Update
Janaina Pilomia
 
Quickstart: Qt for Windows, Symbian and Maemo / Meego v2.0.8 (January 10th, 2...
Andreas Jakl
 
Nicholas Foo
riteshrajgupta
 
Nicholas Foo
fndc
 
Qt in depth - presentation for Symbian expo 2009
Nokia
 
Symbian OS - Mopoid Next Gen - Slides
Andreas Jakl
 
Mobile Bootcamp Presentation: Mobile Application Development Platforms
Wilfred Mutua Mworia
 
Bam amor mobile development tools
Bam Amor
 
Mobile stategy
Burhan Surti
 
Google Android Naver 1212
Yoojoo Jang
 
Introduction to nfc_v1_1_en
open-src
 
Introduction to nfc_v1_1_en
Somasundaram Jambunathan
 
Introduction to android
Jawad Mohmand
 
Software development with qt
NokiaAppForumBulgaria
 
Software development with qt
NokiaAppForumSerbia
 
Android Development Workshop
Muthu Kumar
 
Android Introduction
Sharmistha Mandal
 
Ad

More from Andreas Jakl (20)

PDF
Create Engaging Healthcare Experiences with Augmented Reality
Andreas Jakl
 
PDF
AR / VR Interaction Development with Unity
Andreas Jakl
 
PDF
Android Development with Kotlin, Part 3 - Code and App Management
Andreas Jakl
 
PDF
Android Development with Kotlin, Part 2 - Internet Services and JSON
Andreas Jakl
 
PDF
Android Development with Kotlin, Part 1 - Introduction
Andreas Jakl
 
PDF
Android and NFC / NDEF (with Kotlin)
Andreas Jakl
 
PDF
Basics of Web Technologies
Andreas Jakl
 
PDF
Bluetooth Beacons - Bluetooth 5, iBeacon, Eddystone, Arduino, Windows 10 & More
Andreas Jakl
 
PDF
Which new scenarios are enabled by Windows 10 for NFC, Bluetooth LE & Beacons?
Andreas Jakl
 
PDF
Mobile Test Automation
Andreas Jakl
 
PDF
Qt App Development - Cross-Platform Development for Android, iOS, Windows Pho...
Andreas Jakl
 
PDF
WinJS, Apache Cordova & NFC - HTML5 apps for Android and Windows Phone
Andreas Jakl
 
PDF
Nokia New Asha Platform Developer Training
Andreas Jakl
 
PDF
Windows (Phone) 8 NFC App Scenarios
Andreas Jakl
 
PDF
Windows 8 Platform NFC Development
Andreas Jakl
 
PDF
06 - Qt Communication
Andreas Jakl
 
PDF
05 - Qt External Interaction and Graphics
Andreas Jakl
 
PDF
04 - Qt Data
Andreas Jakl
 
PDF
03 - Qt UI Development
Andreas Jakl
 
PDF
02 - Basics of Qt
Andreas Jakl
 
Create Engaging Healthcare Experiences with Augmented Reality
Andreas Jakl
 
AR / VR Interaction Development with Unity
Andreas Jakl
 
Android Development with Kotlin, Part 3 - Code and App Management
Andreas Jakl
 
Android Development with Kotlin, Part 2 - Internet Services and JSON
Andreas Jakl
 
Android Development with Kotlin, Part 1 - Introduction
Andreas Jakl
 
Android and NFC / NDEF (with Kotlin)
Andreas Jakl
 
Basics of Web Technologies
Andreas Jakl
 
Bluetooth Beacons - Bluetooth 5, iBeacon, Eddystone, Arduino, Windows 10 & More
Andreas Jakl
 
Which new scenarios are enabled by Windows 10 for NFC, Bluetooth LE & Beacons?
Andreas Jakl
 
Mobile Test Automation
Andreas Jakl
 
Qt App Development - Cross-Platform Development for Android, iOS, Windows Pho...
Andreas Jakl
 
WinJS, Apache Cordova & NFC - HTML5 apps for Android and Windows Phone
Andreas Jakl
 
Nokia New Asha Platform Developer Training
Andreas Jakl
 
Windows (Phone) 8 NFC App Scenarios
Andreas Jakl
 
Windows 8 Platform NFC Development
Andreas Jakl
 
06 - Qt Communication
Andreas Jakl
 
05 - Qt External Interaction and Graphics
Andreas Jakl
 
04 - Qt Data
Andreas Jakl
 
03 - Qt UI Development
Andreas Jakl
 
02 - Basics of Qt
Andreas Jakl
 

Recently uploaded (20)

PPTX
cloud computing vai.pptx for the project
vaibhavdobariyal79
 
PPTX
Agentic AI in Healthcare Driving the Next Wave of Digital Transformation
danielle hunter
 
PPTX
What-is-the-World-Wide-Web -- Introduction
tonifi9488
 
PDF
State-Dependent Conformal Perception Bounds for Neuro-Symbolic Verification
Ivan Ruchkin
 
PDF
OFFOFFBOX™ – A New Era for African Film | Startup Presentation
ambaicciwalkerbrian
 
PPTX
Simple and concise overview about Quantum computing..pptx
mughal641
 
PDF
Tea4chat - another LLM Project by Kerem Atam
a0m0rajab1
 
PDF
Peak of Data & AI Encore - Real-Time Insights & Scalable Editing with ArcGIS
Safe Software
 
PDF
Build with AI and GDG Cloud Bydgoszcz- ADK .pdf
jaroslawgajewski1
 
PDF
Google I/O Extended 2025 Baku - all ppts
HusseinMalikMammadli
 
PDF
Structs to JSON: How Go Powers REST APIs
Emily Achieng
 
PDF
Per Axbom: The spectacular lies of maps
Nexer Digital
 
PPTX
AI Code Generation Risks (Ramkumar Dilli, CIO, Myridius)
Priyanka Aash
 
PPTX
Introduction to Flutter by Ayush Desai.pptx
ayushdesai204
 
PPTX
The Future of AI & Machine Learning.pptx
pritsen4700
 
PPTX
OA presentation.pptx OA presentation.pptx
pateldhruv002338
 
PPTX
AVL ( audio, visuals or led ), technology.
Rajeshwri Panchal
 
PDF
The Future of Mobile Is Context-Aware—Are You Ready?
iProgrammer Solutions Private Limited
 
PDF
Responsible AI and AI Ethics - By Sylvester Ebhonu
Sylvester Ebhonu
 
PDF
Research-Fundamentals-and-Topic-Development.pdf
ayesha butalia
 
cloud computing vai.pptx for the project
vaibhavdobariyal79
 
Agentic AI in Healthcare Driving the Next Wave of Digital Transformation
danielle hunter
 
What-is-the-World-Wide-Web -- Introduction
tonifi9488
 
State-Dependent Conformal Perception Bounds for Neuro-Symbolic Verification
Ivan Ruchkin
 
OFFOFFBOX™ – A New Era for African Film | Startup Presentation
ambaicciwalkerbrian
 
Simple and concise overview about Quantum computing..pptx
mughal641
 
Tea4chat - another LLM Project by Kerem Atam
a0m0rajab1
 
Peak of Data & AI Encore - Real-Time Insights & Scalable Editing with ArcGIS
Safe Software
 
Build with AI and GDG Cloud Bydgoszcz- ADK .pdf
jaroslawgajewski1
 
Google I/O Extended 2025 Baku - all ppts
HusseinMalikMammadli
 
Structs to JSON: How Go Powers REST APIs
Emily Achieng
 
Per Axbom: The spectacular lies of maps
Nexer Digital
 
AI Code Generation Risks (Ramkumar Dilli, CIO, Myridius)
Priyanka Aash
 
Introduction to Flutter by Ayush Desai.pptx
ayushdesai204
 
The Future of AI & Machine Learning.pptx
pritsen4700
 
OA presentation.pptx OA presentation.pptx
pateldhruv002338
 
AVL ( audio, visuals or led ), technology.
Rajeshwri Panchal
 
The Future of Mobile Is Context-Aware—Are You Ready?
iProgrammer Solutions Private Limited
 
Responsible AI and AI Ethics - By Sylvester Ebhonu
Sylvester Ebhonu
 
Research-Fundamentals-and-Topic-Development.pdf
ayesha butalia
 

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

  • 1. NFC Development with Qt on Symbian and MeeGo Andreas Jakl NFC Introduction Related Presentations bit.ly/NfcIntro [@mopius] Windows (Phone) 8 NFC App Scenarios nfcinteractor.com bit.ly/NFCAppScenarios Technology Wizard Nokia 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.
  • 2. NFC Development 2 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 3. NFC Development Alternatives Java ME Qt Mobility Symbian Native Windows Phone 8 Works 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, platform smartphone 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
  • 4. 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 SDK 4 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 5. 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_development 5 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 6. Contactless Communication API • JSR 257 – Tag discovery and data exchange – NDEF messages • Example project: Nfc Creator – https://projects.developer.nokia.com/ nfccreator 6 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 7. 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 Symbian 7 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 8. Qt Mobility NFC 8 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 9. 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
  • 10. 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 target 10 © 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.
  • 11. 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) Versit 11 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 12. 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 sockets 12 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 13. 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
  • 14. 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:QtMobilitysrcconnectivitynfc 14 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 15. 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
  • 16. 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 QML 16 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 17. Importing the Example • From Qt Creator’s Getting Started screen – Search for Corkboards example – Or open: C:QtSDKExamples4.7declarative toyscorkboardscorkboards.pro 17 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 18. Choosing Targets • Select at least the Symbian Anna target – Qt 4.7.4 & Qt Mobility 1.2 is required 18 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 19. 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
  • 20. 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 notes 20 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 21. 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: flickable 21 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 22. 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 NFC 22 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 23. 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 Capabilities 2. Add to Qt project file (.pro) symbian:TARGET.CAPABILITY += Location LocalServices 23 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 24. Good to Know: Symbian Security 3. 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
  • 25. 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 Store developer.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
  • 26. NdefManager • New C++ class – Right-click the project → Add New ... → C++ Class – Class name: NdefManager – Base class: QObject 26 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 27. Qt Meta-Object System • C++ extended with QObject – Introspection: meta-information at runtime – Inter-object communication: signals & slots – Parent / Child hierarchy: easier memory management 27 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 28. 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
  • 29. Start Waiting ndefmanager.cpp NdefManager::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
  • 30. 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
  • 31. 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 them 31 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 32. 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
  • 33. 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
  • 34. 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
  • 35. 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
  • 36. Test! #2 • Run the app • Touch a URI formatted NDEF tag • Observe the Application Output 36 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 37. 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
  • 38. 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
  • 39. 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 message corkboards.qml NdefManager { 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
  • 40. 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
  • 41. 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 tag 41 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 42. Overview – Before Register NDEF filters and detect targets QNdefFilter 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
  • 43. Overview – After Detect any kind of targets connect(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
  • 44. React to all targets • Generic target detection instead of listening to specific tag message(s) – Remove previous targetDetected() with two parameters ndefmanager.h public slots: void nfcWriteTag(const QString& nfcTagText); // New private slots: void targetDetected(QNearFieldTarget *target); // Modified from prev. void ndefMessageRead(const QNdefMessage &message); // New private: QNearFieldTarget *cachedTarget; // New 44 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 45. 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
  • 46. 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
  • 47. 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
  • 48. 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
  • 49. 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
  • 50. 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>qml 50 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 51. 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
  • 52. 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 UI 52 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 53. 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
  • 54. New Project • Qt Quick Application – Name: NfcChat – Built-in elements only – Targets: Symbian Device (including Symbian Anna) – Accept defaults for the rest 54 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 55. 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 NFC 55 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 56. 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
  • 57. 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
  • 58. 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
  • 59. NfcPeerToPeer • Go to the “Edit” view • New C++ class – Right-click the project → Add New ... → C++ Class – Class name: NfcPeerToPeer – Base class: QObject 59 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 60. 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
  • 61. Search for Targets • Save own unique service Uri and start target detection nfcpeertopeer.cpp NfcPeerToPeer::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
  • 62. 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
  • 63. 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
  • 64. 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
  • 65. 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
  • 66. 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
  • 67. 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
  • 68. 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
  • 69. 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
  • 70. 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
  • 71. 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
  • 72. 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 button 72 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 73. NFC Summary 73 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 74. 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
  • 75. Summary developer.nokia.com/NFC Design Develop Distribute Guidelines 75 © 2012 Nokia Nokia NFC Development with Qt v2.2.0 November 5, 2012 Andreas Jakl
  • 76. Thank You. Andreas Jakl NFC Introduction Related Presentations bit.ly/NfcIntro [@mopius] Windows (Phone) 8 NFC App Scenarios nfcinteractor.com bit.ly/NFCAppScenarios Technology Wizard Nokia 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