[Plan du site]
Vous êtes ici ---
> Le Site du Zéro
> Les tutoriels
> Non-Officiels
> Programmation
> Bibliothèques
> Qt
> QScintilla
> Lecture du tutoriel
QScintilla
Vous vous apprêtez à lire un tutoriel rédigé par un membre de ce site. Malgré tout le soin que ce membre a pu apporter au tutoriel, nous ne pouvons pas garantir que les informations contenues sur cette page sont exactes à 100%. Merci de garder cela en tête lorsque vous lirez cette page ;o)
Vous suivez les tutoriels de Qt, vous voulez faire un éditeur de texte, mettre en couleur Zero Class Generator, ou mettre en couleur un texte sans utiliser
QSyntaxHighlighter trop compliqué, et avec des bugs de couleur quelquefois ?
QScintilla est là pour vous !
Exemple
Pour télécharger QScintilla (qui est placé sous licence GNU GPL), il faut se rendre sur le site de son créateur :
Riverbank.
Dans le menu
Software -> QScintilla2 Download.
Au cas où il y aurait un problème sur RiverBank j'ai ajouté les fichier compresser de QScintilla dans mon ftp de developpez.com :
Windows (.zip) :
QScintilla-gpl-2.3.2.zip
Linux, MacOS(X) (.tar.gz) :
QScintilla-gpl-2.3.2.tar.gz
Prenez le fichier qui convient à votre OS dans Source Packages.
Pour les Linuxiens vous pouvez aussi télécharger le paquet :
libqscintilla2-dev (merci à
Kycs pour cette information)
Une fois téléchargé, extrayez le fichier.
QScintilla peut s'installer en librairie dynamique (dll pour Windows) ou librairie statique (.a, .lib).
Personnellement je préfère les librairies statiques, car on n'a pas besoin de mettre des fichiers supplémentaires.
Je vais donc vous apprendre à installer QScintilla en librairie statique.
- Ouvrez le dossier "QScintilla-gpl-2.3".
- Puis ouvrez le dossier "Qt4".
- Ouvrez le fichier "qscintilla.pro".
- Vous vous retrouvez avec un beau bazar.
- Faites une recherche de "CONFIG += qt warn_off release dll".
- Changez "dll" par "staticlib".
- Faites une autre recherche de "DEFINES = QSCINTILLA_MAKE_DLL".
- Supprimez "QSCINTILLA_MAKE_DLL".
- Ou alors télécharger le fichier que j'ai pré-fait pour vous et remplacer le par l'autre : qscintilla.pro
- Ouvrez une console Qt.
- Déplacez-vous dans le dossier "Qt4" de "QScintilla-gpl-2.3".
- Faites :
- "qmake",
- "make",
- "make install".
- Ou alors : "qmake & make & make install" (mais seulement sur Windows)
Normalement QScintilla est installé, à la phase
make install, il devrait y avoir des erreurs ignoré, c'est tous à fais normal

.
Si vous avez une erreur dans ce style la :
Code : Console | qsciscintilla.cpp: In member function `bool QsciScintilla::isModified() const':
qsciscintilla.cpp:1674: error: 'const class QsciDocument' has no member named 'isModified'
qsciscintilla.cpp: In member function `void QsciScintilla::handleSavePointReached()':
qsciscintilla.cpp:1712: error: 'class QsciDocument' has no member named 'setModified'
qsciscintilla.cpp: In member function `void QsciScintilla::handleSavePointLeft()':
qsciscintilla.cpp:1720: error: 'class QsciDocument' has no member named 'setModified'
qsciscintilla.cpp: In member function `bool QsciScintilla::write(QIODevice*) const':
qsciscintilla.cpp:3409: error: `SCI_GETCHARACTERPOINTER' undeclared (first use this function)
qsciscintilla.cpp:3409: error: (Each undeclared identifier is reported only once for each function it appears in.)
mingw32-make[1]: *** [release/qsciscintilla.o] Error 1mingw32-make[1]: Leaving directory `C:/cygwin/QScintilla-gpl-2.3.1/Qt4'
mingw32-make: *** [release] Error 2 |
(Erreur que j'ai eu

, désinstaller Qt (en entier : en désinstallent l'ancien QScintilla si vous l'aviez) puis réinstaller le.
Avant de commencer à coder, voici la
documentation de QScintilla.
QScintilla a une documentation aussi bien conçue que celle de Qt.
Ensuite pour mettre de la couleur à un texte, on ne va pas utiliser l'habituel QTextEdit mais un
QsciScintilla !
Pour commencer à coder :
L'include :
Code : C++1 | #include <Qsci/qsciscintilla.h>
|
Puis l'objet :
Code : C++1 | QsciScintilla (QWidget *parent=0)
|
On peut tester QsciScintilla dans un petit code avec juste un "main".
Code : C++ 1
2
3
4
5
6
7
8
9
10
11
12 | #include <QApplication>
#include <Qsci/qsciscintilla.h>
int main(int argc, char* argv[])
{
QApplication app(argc, argv);
QsciScintilla *scintilla = new QsciScintilla;
scintilla->show();
return app.exec();
}
|
Pas très compliqué à comprendre normalement.
On compile.
Code : Console | qmake -project
qmake
make |
Et que voit-on ? Une erreur (fallait même pas s'en douter -_-') !
Il faut linker la librairie QsciScintilla.
Donc on ouvre le
.pro et on ajoute
avant # Input
Avant car sinon on compile avant d'avoir linker la librairie.
On refait :
qmake
make
Pas qmake -project sinon il faudra re-linker QScintilla
Et on obtient un truc ni très joli ni très beau :
(Oui je sais j'aime les jolies noms de fenêtre
.)
On a beau s'acharner à marquer
int void
ou
char
rien ne se colorie.
Normal, pour que ce soit encore mieux il y a
des classes pour colorier un QsciScintilla !
Ho j'ai fait une rime
!
Comme je l'ai dit dans la dernière partie, il y a plusieurs classes pour colorier un QsciScintilla : il y en a un peu pour tous les langages utilisés (je ne parle pas de
Ook) :
- Bash,
- Batch,
- CMake,
- CPP,
- CSharp,
- CSS,
- D,
- Diff,
- Fortran,
- Fortran77,
- HTML,
- IDL,
- Java,
- JavaScript,
- Lua,
- Makefile,
- Pascal,
- Perl,
- PostScript,
- POV,
- Properties,
- Python,
- Ruby,
- SQL,
- TCL,
- TeX,
- VHDL.
- XML,
- YAML,
Dans QScintilla l'objet pour colorier la syntaxe d'un QsciScintilla s'appelle un
lexer.
Le lexer de C++ est :
QsciLexerCPP
Le fichier à inclure est donc :
#include<Qsci/qscilexercpp.h>
.
Pour le langage Java c'est pareil :
Le lexer est :
QsciLexerJava
.
Et le fichier à inclure est :
#include<Qsci/qscilexerjava.h>
Pour tous les autres langages aussi c'est pareil.
Pour attribuer un lexer à un QsciScintilla il faut utiliser la méthode
virtual void QsciScintilla::setLexer (QsciLexer *lexer=0)
On va tester ça dans un petit code (essayer de le faire tout seuls pour l'entrainement

):
Secret (cliquez pour afficher)Code : C++ 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16 | #include <QApplication>
#include <Qsci/qsciscintilla.h>
#include <Qsci/qscilexercpp.h>
int main(int argc, char* argv[])
{
QApplication app(argc, argv);
QsciScintilla *scintilla = new QsciScintilla;
QsciLexerCPP *lexerCPP = new QsciLexerCPP;
scintilla->setLexer(lexerCPP);
scintilla->show();
return app.exec();
}
|
Cette fois-ci on se retrouve avec ça :
Il est aussi possible de modifier les couleurs des lexers.
Quand on va sur la documentation de
QsciLexerCPP, dans Public Types il y a une énumération :
Code : Autre1
2
3
4
5
6
7
| Default = 0, Comment = 1, CommentLine = 2,
CommentDoc = 3, Number = 4, Keyword = 5,
DoubleQuotedString = 6, SingleQuotedString = 7, UUID = 8,
PreProcessor = 9, Operator = 10, Identifier = 11,
UnclosedString = 12, VerbatimString = 13, Regex = 14,
CommentLineDoc = 15, KeywordSet2 = 16, CommentDocKeyword = 17,
CommentDocKeywordError = 18, GlobalClass = 19 |
En fait, cette énumération contient tous les mots que l'on peut colorer (je ne mets la traduction que des plus utiles) :
- Default = azertyuiopqsdfghjklmwxcvbn
;
- Comment = /* azertyuiopqsdfghjklmwxcvbn */
;
- CommentLine = // azertyuiopqsdfghjklmwxcvbn
;
- Number = 0123456789
;
- Keyword = int const mutable void operator
;
- DoubleQuotedString = ""
;
- SingleQuotedString = ' '
;
- PreProcessor = #include #define #ifndef
;
- Operator = + - * / << >>
;
- UnclosedString = Quand un chaine n'est pas fermer "
.
Pour changer la couleur il faut utiliser la méthode :
virtual void setColor (const QColor &c, int style=-1)
On peut prendre du temps pour choisir la couleur avec QColor, mais nous on va faire vite avec les
énumération de Qt.
Exemple pour avoir les mots-clés violets :
Code : C++1
2 | QsciLexerCPP lexer;
lexer.setColor(Qt::magenta, QsciLexerCPP::Keyword);
|
Juste avant de quitter : si on regarde la documentation du
lexer de Java, on s'aperçoit qu'il n'y a pas d'énumération, un petit conseil : regardez toujours les classes parentes (Inherits).
QsciScintilla ressemble beaucoup à QTextEdit, mais il y a quelques différences.
setPlainText
n'existe pas dans QsciScintilla, on va utiliser à la place
setText
.
On peut aussi mettre le numéro de la ligne dans la marge avec :
virtual void setMarginLineNumbers(int margin, bool lnrs)
.
margin
c'est le numéro de la marge (oui on peut en mettre plusieurs mais ce n'est pas utile).
lnrs
c'est si on affiche la marge ou pas.
On va tester ça (une fois de plus essayez de faire le code tout seuls) :
Secret (cliquez pour afficher)Code : C++ 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17 | #include <QApplication>
#include <Qsci/qsciscintilla.h>
#include <Qsci/qscilexercpp.h>
int main(int argc, char* argv[])
{
QApplication app(argc, argv);
QsciScintilla *scintilla = new QsciScintilla;
QsciLexerCPP *lexerCPP = new QsciLexerCPP;
scintilla->setLexer(lexerCPP);
scintilla->setMarginLineNumbers(1,true);
scintilla->show();
return app.exec();
}
|
Résultat
Par défaut la marge n'est pas très large, on peut à peine entrer 10 lignes.
Heureusement que
setMarginWidth
existe.
Sur cette méthode il y a une petite surcharge :
virtual void setMarginWidth (int margin, int width)
width
c'est la largeur en pixel de la marge.
virtual void setMarginWidth (int margin, const QString &s)
On se dit : "qu'est-ce que fait une chaine dans la largeur d'une marge

?".
En fait c'est la largeur en caractère (il faut toujours mettre un caractère en plus).
Exemple :
setMarginWidth(1, "-----")
Ce qui se traduit par "je veux que la marge 1 fasse 4 caractères de large" (toujours un caractère en plus).
La 2ème est la meilleure de mon point de vue

.
On teste ça :
Secret (cliquez pour afficher)Code : C++ 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20 | #include <QApplication>
#include <Qsci/qsciscintilla.h>
#include <Qsci/qscilexercpp.h>
int main(int argc, char* argv[])
{
QApplication app(argc, argv);
QsciScintilla *scintilla = new QsciScintilla;
QsciLexerCPP *lexerCPP = new QsciLexerCPP;
scintilla->setLexer(lexerCPP);
scintilla->setMarginLineNumbers (1, true);
scintilla->setMarginWidth(1, "-----");
// scintilla->setMarginWidth(1, 50);
// 50 pixel est égale à environ 4 caractères.
scintilla->show();
return app.exec();
}
|
Résultat
Il existe aussi plein de méthodes utiles et inutiles, je ne vais pas toutes vous les montrer mais si vous voulez les connaitre allez sur la doc de
QsciScintilla.
Énoncé
Vous connaissez le TP
ZeroClassGenerator ? Quand on fait la génération on obtient un beau code pas coloré. Vous savez ce qu'il vous reste à faire -_- ?
Mais avec quelque consignes en plus. Je veux que vous coloriez les :
- Mots clés -> Jaune foncé
- Pré Processeur -> Bleu
- Commentaires -> Rouge foncé
Et que vous fassiez une marge de taille correcte avec le numéro des lignes.
Le résultat devrait être :
Correction
Secret (cliquez pour afficher)
Je mets juste le code de
FenCodeGenere.cpp et
FenCodeGenere.h pour le reste, il n'y a pas besoin de QsciScintilla donc ça sert à rien que je le mette.
FenCodeGenere.h
Code : C++ 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19 | #ifndef HEADER_FENCODEGENERE
#define HEADER_FENCODEGENERE
#include <QtGui>
#include <Qsci/qsciscintilla.h>
#include <Qsci/qscilexercpp.h>
class FenCodeGenere : public QDialog
{
public:
FenCodeGenere(QString &code, QWidget *parent);
private:
QsciScintilla *codeGenere;
QsciLexerCPP *lexer;
QPushButton *fermer;
};
#endif
|
FenCodeGenere.cpp
Code : C++ 1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29 | #include "FenCodeGenere.h"
FenCodeGenere::FenCodeGenere(QString &code, QWidget *parent = 0) : QDialog(parent)
{
lexer = new QsciLexerCPP;
lexer->setColor(Qt::darkYellow,QsciLexerCPP::Keyword);
lexer->setColor(Qt::blue,QsciLexerCPP::PreProcessor);
lexer->setColor(Qt::darkRed,QsciLexerCPP::Comment);
lexer->setColor(Qt::darkRed,QsciLexerCPP::CommentLine);
codeGenere = new QsciScintilla();
codeGenere->setText(code);
codeGenere->setReadOnly(true);
codeGenere->setLexer(lexer);
codeGenere->setMarginLineNumbers(1,true);
codeGenere->setMarginWidth(1, "----") ;
fermer = new QPushButton("Fermer");
QVBoxLayout *layoutPrincipal = new QVBoxLayout;
layoutPrincipal->addWidget(codeGenere);
layoutPrincipal->addWidget(fermer);
resize(350, 450);
setLayout(layoutPrincipal);
connect(fermer, SIGNAL(clicked()), this, SLOT(accept()));
}
|
Devinez le meilleur. Il est possible de mettre QsciScintilla dans Qt Designer !
Pour cela il faut le dossier téléchargé de QScintilla, si vous l'avez supprimé ce n'est pas grave,
retéléchargez-le et c'est bon

.
- Avec la console de Qt déplacez-vous dans le dossier "designer-Qt4" de "QScintilla-gpl-2.3" (oui déjà c'est plus rapide
).
- Faites :
- qmake,
- make,
- make install.
- Ou bien : qmake & make & make install (mais seulement sur Windows)
Ouvrez Qt Designer cherchez un peu dans les widgets, et magie dans Input Widget il y a QsciScintilla :
Pour ajouter des lexers il faut le coder (ce serait trop beau sinon).
C'est la fin de ce tutoriel. J'espère qu'il vous aura plu ;).
Maintenant, vous pouvez vous lancer dans la création d'un éditeur de texte

.
PS : si vous avez un problème envoyez-moi un MP ou postez dans les commentaires j'essaierai d'y répondre.