Utilisation du FW GraphTool

muqaddarmuqaddar Administrateur
février 2007 modifié dans API AppKit #1
Mala qui vient de nous fournir le framework GraphTool nous a aussi envoyé un tutoriel d'utilisation de son petit bébé. Voici donc un exemple concret qui va vous prendre par la main, afin de vous apprendre à  vous servir de ce framework servant à  la création de graphiques.

Intégration du framework privé dans votre application


Avant de commencer, sachez que ce framework est disponible dans la partie ressources.
Vous y trouverez une documentation HTML complète en plus du framework à  proprement parlé.

C'est parti pour l'installation du framework dans votre application.

GraphTool est un framework que nous allons intégrer au coeur même de notre logiciel. Il sera ainsi installé et utilisé de manière totalement transparente. Le principe est donc de recopier systématiquement le framework dans le package de notre application.

La première étape consiste à  importer le framework GraphTool. L'opération est simple. Dans l'arborescence de notre projet, on ouvre le dossier " Frameworks/Linked frameworks/ " et un clique bouton droit nous permet d'accéder au menu déroulant "Add->Existing Frameworks". On sélectionne alors le framework (nommé "GraphTool.framework") que l'on a préalablement décompressé et copié dans un endroit connu (on peut par exemple se créer un répertoire GraphTool dans le repertoire de notre projet et y copier le framework).

[Fichier joint supprimé par l'administrateur]

Réponses

  • muqaddarmuqaddar Administrateur
    00:24 modifié #2
    Le framework est dorénavant présent dans notre projet. Il contient un répertoire "Header" servant à  stocker les fichiers d'entête des classes qu'il contient. Pour GraphTool, nous avons une classe "Tableau" et une classe "Graphique". Dans la pratique, au niveau de notre application, seule la classe "Graphique" qui hérite d'une NSView nous sera utile. La seconde classe n'est en fait utilisée qu'en interne pour gérer les données des courbes.

    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #3
    Maintenant que nous avons accès à  notre framework, la seconde étape consiste à  ajouter une opération de copie dans notre " target " de compilation. Le framework sera ainsi livré automatiquement dans notre application (c'est ce que l'on appelle un framework privé). L'opération est là  aussi très simple. On clique sur le nom du " target " puis clique bouton droit pour accéder au menu déroulant " Add->New Build Phase->New Copy Files Build Phase ".


    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #4
    La destination de notre "Copy Files Build Phase" est à  régler sur " Frameworks ". On peut maintenant fermer la fenêtre pour valider.


    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #5
    Il ne nous reste plus qu'a faire un glisser/déplacer du framework GraphTool vers notre nouveau dossier " Copy files ".

    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #6
    Pour vérifier que tout est ok, on peut maintenant lancer une compilation et vérifier ensuite, en affichant le contenu du paquet de notre application, que nous avons bien une copie du framework dans le répertoire "Contents/Frameworks".

    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #7
    Utilisation du framework GraphTool

    Maintenant que nous avons accès à  notre framework, passons aux choses sérieuses avec un petit exemple d'utilisation. On ouvre le fichier nib de notre application dans Interface Builder et on vient glisser sur notre interface une CustomView.

    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #8
    Ensuite, on va dans l'explorateur de classe et l'on vient lire le fichier d'entête "Graphique.h" situé dans le répertoire "GraphTool.framework/Headers/".

    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #9
    Nous avons maintenant accès à  notre classe. Il ne reste plus qu'à  l'associer à  notre CustomView.

    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #10
    On clique donc sur notre CustomView et, dans l'éditeur de propriétés, on se met sur "Custom Class". Il suffit alors de sélectionner "Graphique".

    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #11
    Il ne reste plus qu'à  créer un outlet dans notre contrôleur pour accéder à  notre graphique.

    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #12
    On lui donne le type Graphique.

    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #13
    Et on vient le joindre à  notre élément d'interface.

    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #14
    Voilà , on est connecté.

    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #15
    Il ne nous reste qu'à  ajouter le code correspondant dans le code du controleur ou bien à  demander à  interface Builder de le générer.
    Au passage, ne pas oublier d'ajouter l'import (#import ) car Interface Builder ne le fait pas tout seul.

    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #16
    Et c'est parti, on dispose dorénavant d'un joli graphique que l'on peut paramétrer sans trop se compliquer la vie.

    [Fichier joint supprimé par l'administrateur]
  • muqaddarmuqaddar Administrateur
    00:24 modifié #17
    Voici un exemple de code :

    - (void)awakeFromNib<br />{<br />&nbsp; &nbsp; // Creation d&#39;une courbe de test<br /><br />&nbsp; &nbsp; [myOutletGraphique definirTitreGraphique:@&quot;Graphique de test&quot;];<br />&nbsp; &nbsp; [myOutletGraphique afficherTitreGraphique:YES];<br /><br />&nbsp; &nbsp; [myOutletGraphique definirTitreAxeX:@&quot;X&quot;];<br />&nbsp; &nbsp; [myOutletGraphique afficherTitreAxeX:YES];<br /><br />&nbsp; &nbsp; [myOutletGraphique definirTitreAxeY:@&quot;Y&quot;];<br />&nbsp; &nbsp; [myOutletGraphique afficherTitreAxeY:YES];<br /><br />&nbsp; &nbsp; [myOutletGraphique forcerEchelleEnXAvecPas:1];<br />&nbsp; &nbsp; [myOutletGraphique forcerEchelleEnYAvecPas:1];<br /><br />&nbsp; &nbsp; [myOutletGraphique afficherFlecheEnY:NO];<br /><br />&nbsp; &nbsp; // On donne un nom à  la courbe et on définit la couleur ainsi que la transparence du remplissage<br />&nbsp; &nbsp; [myOutletGraphique creerCourbe:@&quot;Graph&quot; avecCouleur:[NSColor blueColor] etRemplissage:0.1];<br /><br />&nbsp; &nbsp; // On ajoute des points à  la courbe de test<br />&nbsp; &nbsp; [myOutletGraphique ajouterPoint:-1 :1 dansCourbe:@&quot;Graph&quot;];<br />&nbsp; &nbsp; [myOutletGraphique ajouterPoint:1 :-2 dansCourbe:@&quot;Graph&quot;];<br />&nbsp; &nbsp; [myOutletGraphique ajouterPoint:2 :-4 dansCourbe:@&quot;Graph&quot;];<br />&nbsp; &nbsp; [myOutletGraphique ajouterPoint:4 :-10 dansCourbe:@&quot;Graph&quot;];<br />&nbsp; &nbsp; [myOutletGraphique ajouterPoint:5 :-10.2 dansCourbe:@&quot;Graph&quot;];<br />&nbsp; &nbsp; [myOutletGraphique ajouterPoint:6 :-8 dansCourbe:@&quot;Graph&quot;];<br />&nbsp; &nbsp; [myOutletGraphique ajouterPoint:7 :-7 dansCourbe:@&quot;Graph&quot;];<br />&nbsp; &nbsp; [myOutletGraphique ajouterPoint:8 :0 dansCourbe:@&quot;Graph&quot;];<br /><br />}
    


    Et bien voilà , c'est à  vous de jouer maintenant !
Connectez-vous ou Inscrivez-vous pour répondre.