Pixmaps

Les pixmaps sont des structures de données qui contiennent des images. Ces images peuvent être utilisées en un nombre varié d'endroits, mais le plus souvent on les utilise comme icône ou curseur.

Un pixmap à deux couleurs s'appelle un bitmap, il existe des routines supplémentaires pour manipuler ce cas particulier.

Pour comprendre les pixmaps, il peut être utile de comprendre comment fonctionne le système X window. Sous X, les applications n'ont pas besoin de tourner sur l'ordinateur sur lequel vous utilisez celle-ci. En revanche, de nombreuses applications, appelées ``clientes'' , communiquent toutes avec un programme qui gèrent l'affichage, la souris et le clavier. Ce programme qui interagit directement avec l'utilisateur est appelé un ``serveur d'affichage `` ou ``serveur X''. Puisque les communications peuvent avoir lieu sur un réseau, il est important de conserver des informations à l'aide du serveur X. Les pixmaps, par exemple; sont stockés dans la mémoire du serveur X. Cela signifie, qu'une fois que les valeurs du pixmaps sont définies, vous n'avez pas à passer votre temps à les transmettre sur le réseau ; on envoie en revanche la commande `` afficher le pixmap numéro XYZ ici ''. Même si pour le moment vous n'utilisez pas X avec GTK, utiliser des constructions comme les pixmaps feront que vos programmes fonctionneront acceptablement sous X.

Pour utiliser des pixmaps en GTK, vous devrez d'abord construire une structure de Pixmap en utilisant des routines du niveau GDK. Les Pixmaps peuvent être créés à partir de données stockées en mémoire ou bien lus à partir d'un fichier. Nous parcourrons les deux méthodes pour créer nos pixmaps.

  
      $gdkpixmap = Gtk::Gdk::Pixmap->create_from_data( $window,
                                                   $data,
                                                   $width,
                                                   $height );

Cette routine sert à créer une pixmap de simple niveau ( 2 couleurs ) à partir de données stockées en mémoire. Chaque bit de la donnée indique si ce pixel est allumé ou non. La largeur et la hauteur sont en pixels. Le pointeur GdkWindow est sur la fenêtre courante puisque les ressources d'un pixmap n'ont de signification que dans le contexte de l'écran où il est affiché.

  
      $gdkpixmap = Gtk::Gdk::Pixmap->create_from_data( $window,
                                                   $data,
                                                   $width,
                                                   $height,
                                                   $depth,
                                                   $foreground,
                                                   $background );

Celle-ci permet de créer un pixmap de profondeur donnée ( nombre de couleurs ) à partir de données bitmap spécifiées. $foreground et $background sont les couleurs de premier plan et d'arrière plan à utiliser.

  
      $gdkpixmap = Gtk::Gdk::Pixmap->create_from_xpm( $window,
                                                  $mask,
                                                  $transparent_color,
                                                  $filename );

Le format XPM est une représentation lisible d'un pixmap pour le système X Window. Il est largement utilisé et beaucoup d'utilitaires différents sont disponibles pour créer des fichiers images dans ce format. Le fichier spécifié par $filename doit contenir une image dans ce format et il sera chargé dans la structure du pixmap. Le $mask précise quels bits du pixmaps doivent être opaques. Tous les autres bits sont colorés en utilisant la couleur spécifiée par $transparent_color. Un exemple utilisant cette méthode est présent plus loin.

  
      $gdkpixmap = Gtk::Gdk::Pixmap->create_from_xpm_d( $window,
                                                     $mask,
                                                     $transparent_color,
                                                     $data );

De petites images peuvent être incorporées à un programme en tant que donnée au format XPM. Un pixmap est créé en utilisant cette donnée, plutôt que de la lire dans un fichier. Voici un exemple :

  
      my @xpm_data = ( "16 16 3 1",
                   "       c None",
                   ".      c #000000000000",
                   "X      c #FFFFFFFFFFFF",
                   "                ",
                   "   ......       ",
                   "   .XXX.X.      ",
                   "   .XXX.XX.     ",
                   "   .XXX.XXX.    ",
                   "   .XXX.....    ",
                   "   .XXXXXXX.    ",
                   "   .XXXXXXX.    ",
                   "   .XXXXXXX.    ",
                   "   .XXXXXXX.    ",
                   "   .XXXXXXX.    ",
                   "   .XXXXXXX.    ",
                   "   .XXXXXXX.    ",
                   "   .........    ",
                   "                ",
                   "                " );

Une fois que vous avez créé un pixmap, nous pouvons l'afficher dans un widget GTK. Nous devons créer un widget pixmap GTK pour contenir le pixmap GDK. On y arrive avec :

  
      $pixmap = new Gtk::Pixmap( $gdkpixmap, $mask );

Les autres appels de widget pixmap sont :

  
      $pixmap->get_type();
      $pixmap->set( $val, $mask );
      $pixmap->get( $val, $mask );

set() est utilisé pour changer le pixmap dont le widget s'occupe actuellement. $val est le pixmap créé en utilisant GDK.

Un exemple

L'exemple suivant utilise un pixmap dans un bouton ( voir également l'exemple sur un bouton pixmap plus loin ).

  
#!/usr/bin/perl -w
 
 

use Gtk;

use strict;
 

init Gtk;
 

my $false = 0;

my $true = 1;
 
 

# Donnée XPM d'un icône Ouvrir-Fichier

my @xpm_data = ( "16 16 4 1",
                 "       c None s None",
                 ".      c black",
                 "X      c #808080",
                 "o      c white",
                 "                ",
                 "  ..            ",
                 " .Xo.    ...    ",
                 " .Xoo. ..oo.    ",
                 " .Xooo.Xooo...  ",
                 " .Xooo.oooo.X.  ",
                 " .Xooo.Xooo.X.  ",
                 " .Xooo.oooo.X.  ",
                 " .Xooo.Xooo.X.  ",
                 " .Xooo.oooo.X.  ",
                 "  .Xoo.Xoo..X.  ",
                 "   .Xo.o..ooX.  ",
                 "    .X..XXXXX.  ",
                 "    ..X.......  ",
                 "     ..         ",
                 "                ");
 

my $window;

my $pixmapwid;

my $button;

my $pixmap;

my $mask;

my $style;
 

$window = new Gtk::Window( "toplevel" );

$window->signal_connect( "delete_event", sub { Gtk->exit( 0 ); } );

$window->border_width( 10 );

$window->show();
 

# maintenant le pixmap de gdk

$style = $window->get_style()->bg( 'normal' );

( $pixmap, $mask ) = Gtk::Gdk::Pixmap->create_from_xpm_d( $window->window,
                                                          $style,
                                                          @xpm_data );
 

# un widget pixmap pour contenir le pixmap

$pixmapwid = new Gtk::Pixmap( $pixmap, $mask );

$pixmapwid->show();
 

# un bouton pour contenir le widget pixmap

$button = new Gtk::Button();

$button->add( $pixmapwid );

$button->show();

$button->signal_connect( "clicked", sub { print( "button clicked\n" ); } );

$window->add( $button );
 

main Gtk;

exit( 0 );

Pour charger un fichier à partir d'un fichier appelé icon0.xpm placé dans le répertoire courant, on créerait le pixmap ainsi :

  
      ( $pixmap, $mask ) = Gtk::Gdk::Pixmap->create_from_xpm( $window->window,
                                                          $style;
                                                          "./icon0.xpm" );
      $pixmapwid = new Gtk::Pixmap( $pixmap, $mask );
      $pixmapwid->show();

Les fenêtres taillées : la brouette

Le désavantage d'utiliser les pixmaps est que l'objet affiché est toujours rectangulaire, quelque soit l'image. Nous aimerions créer des bureaux et des applications avec des icônes ayant des formes plus naturelles. Par exemple, pour l'interface d'un jeu, nous aimerions avoir des boutons ronds à pousser. La manière de faire cela est d'utiliser les fenêtres taillées.

Une fenêtre taillée est simplement un pixmap dont les pixels du fond sont transparents. De cette manière, quand l'image du fond est une image multicolore, on ne l'efface pas avec des coins rectangulaires autour de notre icône. L'exemple suivant affiche une brouette sur le bureau.

  
#!/usr/bin/perl -w
 

use Gtk;

use strict;
 

init Gtk;
 

my $false = 0;

my $true = 1;
 

my @wheelbarrowFull = ( '48 48 64 1',
                        '       c None',
                        '.      c #DF7DCF3CC71B',
                        'X      c #965875D669A6',
                        'o      c #71C671C671C6',
                        'O      c #A699A289A699',
                        '+      c #965892489658',
                        '@      c #8E38410330C2',
                        '#      c #D75C7DF769A6',
                        '$      c #F7DECF3CC71B',
                        '%      c #96588A288E38',
                        '&      c #A69992489E79',
                        '*      c #8E3886178E38',
                        '=      c #104008200820',
                        '-      c #596510401040',
                        ';      c #C71B30C230C2',
                        ':      c #C71B9A699658',
                        '>      c #618561856185',
                        ',      c #20811C712081',
                        '<      c #104000000000',
                        '1      c #861720812081',
                        '2      c #DF7D4D344103',
                        '3      c #79E769A671C6',
                        '4      c #861782078617',
                        '5      c #41033CF34103',
                        '6      c #000000000000',
                        '7      c #49241C711040',
                        '8      c #492445144924',
                        '9      c #082008200820',
                        '0      c #69A618611861',
                        'q      c #B6DA71C65144',
                        'w      c #410330C238E3',
                        'e      c #CF3CBAEAB6DA',
                        'r      c #71C6451430C2',
                        't      c #EFBEDB6CD75C',
                        'y      c #28A208200820',
                        'u      c #186110401040',
                        'i      c #596528A21861',
                        'p      c #71C661855965',
                        'a      c #A69996589658',
                        's      c #30C228A230C2',
                        'd      c #BEFBA289AEBA',
                        'f      c #596545145144',
                        'g      c #30C230C230C2',
                        'h      c #8E3882078617',
                        'j      c #208118612081',
                        'k      c #38E30C300820',
                        'l      c #30C2208128A2',
                        'z      c #38E328A238E3',
                        'x      c #514438E34924',
                        'c      c #618555555965',
                        'v      c #30C2208130C2',
                        'b      c #38E328A230C2',
                        'n      c #28A228A228A2',
                        'm      c #41032CB228A2',
                        'M      c #104010401040',
                        'N      c #492438E34103',
                        'B      c #28A2208128A2',
                        'V      c #A699596538E3',
                        'C      c #30C21C711040',
                        'Z      c #30C218611040',
                        'A      c #965865955965',
                        'S      c #618534D32081',
                        'D      c #38E31C711040',
                        'F      c #082000000820',
                        '                                                ',
                        '          .XoO                                  ',
                        '         +@#$%o&                                ',
                        '         *=-;#::o+                              ',
                        '           >,<12#:34                            ',
                        '             45671#:X3                          ',
                        '               +89<02qwo                        ',
                        'e*                >,67;ro                       ',
                        'ty>                 459@>+&&                    ',
                        '$2u+                  ><ipas8*                  ',
                        '%$;=*                *3:.Xa.dfg>                ',
                        'Oh$;ya             *3d.a8j,Xe.d3g8+             ',
                        ' Oh$;ka          *3d$a8lz,,xxc:.e3g54           ',
                        '  Oh$;kO       *pd$%svbzz,sxxxxfX..&wn>         ',
                        '   Oh$@mO    *3dthwlsslszjzxxxxxxx3:td8M4       ',
                        '    Oh$@g& *3d$XNlvvvlllm,mNwxxxxxxxfa.:,B*     ',
                        '     Oh$@,Od.czlllllzlmmqV@V#V@fxxxxxxxf:%j5&   ',
                        '      Oh$1hd5lllslllCCZrV#r#:#2AxxxxxxxxxcdwM*  ',
                        '       OXq6c.%8vvvllZZiqqApA:mq:Xxcpcxxxxxfdc9* ',
                        '        2r<6gde3bllZZrVi7S@SV77A::qApxxxxxxfdcM ',
                        '        :,q-6MN.dfmZZrrSS:#riirDSAX@Af5xxxxxfevo',
                        '         +A26jguXtAZZZC7iDiCCrVVii7Cmmmxxxxxx%3g',
                        '          *#16jszN..3DZZZZrCVSA2rZrV7Dmmwxxxx&en',
                        '           p2yFvzssXe:fCZZCiiD7iiZDiDSSZwwxx8e*>',
                        '           OA1<jzxwwc:$d%NDZZZZCCCZCCZZCmxxfd.B ',
                        '            3206Bwxxszx%et.eaAp77m77mmmf3&eeeg* ',
                        '             @26MvzxNzvlbwfpdettttttttttt.c,n&  ',
                        '             *;16=lsNwwNwgsvslbwwvccc3pcfu<o    ',
                        '              p;<69BvwwsszslllbBlllllllu<5+     ',
                        '              OS0y6FBlvvvzvzss,u=Blllj=54       ',
                        '               c1-699Blvlllllu7k96MMMg4         ',
                        '               *10y8n6FjvllllB<166668           ',
                        '                S-kg+>666<M<996-y6n<8*          ',
                        '                p71=4 m69996kD8Z-66698&&        ',
                        '                &i0ycm6n4 ogk17,0<6666g         ',
                        '                 N-k-<>     >=01-kuu666>        ',
                        '                 ,6ky&      &46-10ul,66,        ',
                        '                 Ou0<>       o66y<ulw<66&       ',
                        '                  *kk5       >66By7=xu664       ',
                        '                   <<M4      466lj<Mxu66o       ',
                        '                   *>>       +66uv,zN666*       ',
                        '                              566,xxj669        ',
                        '                              4666FF666>        ',
                        '                               >966666M         ',
                        '                                oM6668+         ',
                        '                                  *4            ',
                        '                                                ',
                        '                                                ' );
 

my $window;

my $pixmap;

my $fixed;

my $gdkpixmap;

my $mask;

my $style;

my $gc;
 

# Crée la fenêtre principale et attache le signal delete_event pour

# terminer l'application. Notez que la fenêtre principale n'aura pas

# de barre de titre puisque nous l'avons fait ``popup''

$window = new Gtk::Window( "popup" );

$window->signal_connect( "delete_event", sub { Gtk->exit( 0 ); } );

$window->show();
 

# maintenant le pixmap et le widget pixmap

$style = Gtk::Widget->get_default_style();

$gc = $style->black_gc;

( $gdkpixmap, $mask ) = Gtk::Gdk::Pixmap->create_from_xpm_d( $window->window,
                                                             $style->bg( 'normal' ),
                                                             @wheelbarrowFull );

$pixmap = new Gtk::Pixmap( $gdkpixmap, $mask );

$pixmap->show();
 

# nous utilisons un widget fixed pour afficher le pixmap

$fixed = new Gtk::Fixed();

$fixed->set_usize( 200, 200 );

$fixed->put( $pixmap, 0, 0 );

$window->add( $fixed );

$fixed->show();
 

# Cela masque tout sauf l'image elle-même

$window->shape_combine_mask( $mask, 0, 0 );
 

# montre la fenêtre

$window->set_uposition( 400, 400 );

$window->show();

main Gtk;

exit( 0 );

Pour rendre la brouette sensible, nous pourrions lui attacher le signal button press event. Les quelques lignes suivantes rende l'image sensible au bouton de la souris, quand on clique dessus, l'application se termine.

  
      $window->set_events( [ $window->get_events(), 'button_press_mask' ] );
      $window->signal_connect( "button_press_event", sub { Gtk->exit( 0 ); } );

Exemple de bouton pixmap

  
#!/usr/bin/perl -w
 

use Gtk;

use strict;
 

init Gtk;
 

my $false = 0;

my $true = 1;
 

my $window;

my $box;

my $button;
 

$window = new Gtk::Window( "toplevel" );

$window->set_title( "Pixmap'd Buttons!" );

$window->border_width( 10 );

$window->realize();

$window->signal_connect( "destroy", sub { Gtk->exit( 0 ); } );

$window->signal_connect( "delete_event", sub { Gtk->exit( 0 ); } );
 

# Ceci appelle notre fonction créatrice de boîte.

$box = xpm_label_box( $window, "info.xpm", "cool button" );
 

$button = new Gtk::Button();

$button->signal_connect( "clicked", sub {
                           print( "The cool button was pressed\n" ); } );
 

# Regroupe et montre tous nos widgets

$box->show();

$button->add( $box );

$button->show();

$window->add( $button );

$window->show();
 

# Reste dans main et attend que le jeu commence !

main Gtk;

exit( 0 );
 
 
 

# Crée une nouvelle hbox avec une image et un label à l'intérieur

# et retourne la boîte

sub xpm_label_box
  {
    my ( $parent, $xpm_filename, $label_text ) = @_;
    
    my $box;
    my $style;
    my $pixmap;
    my $mask;
    my $pixmapwid;
    my $label;
    
    # Crée une boîte pour xpm et le label
    $box = new Gtk::HBox( $false, 0 );
    
    # Récupère le style du bouton pour l'appliquer à la couleur du fond
    $style = $parent->get_style()->bg( 'normal' );
    
    # Maintenant le XPM
    ( $pixmap, $mask ) = Gtk::Gdk::Pixmap->create_from_xpm( $parent->window,
                                                            $style,
                                                            $xpm_filename );
    $pixmapwid = new Gtk::Pixmap( $pixmap, $mask );
    
    # Crée une label pour le bouton
    $label = new Gtk::Label( $label_text );
    
    # Place le label et le pixmap dans la boîte
    $box->pack_start( $pixmapwid, $false, $false, 3 );
    $box->pack_start( $label, $false, $false, 3 );
    
    $box->border_width( 2 );
    $pixmapwid->show();
    $label->show();
    
    return ( $box );
  }

Avant de faire fonctionner le programme précédent, vous devrez charger cette image et la placer dans le répertoire contenant le code ci-dessus. Si vous ne faîtes pas cela, $pixmap ne contiendra pas de pixmap et le programme ne fonctionnera pas normalement. Une fois que vous avez fait cela, le programme ressemble à ça :

La fonction créée xpm_label_box() peut être utilisée pour placer des xpm et des labels dans n'importe quel widget qui peut être un conteneur.

Notez dans xpm_label_box(), l'appel get_style(). Tous les widgets possèdent un ``style'', consistant en des couleurs de premier plan, de fond pour une variété de situations, une sélection de police, et d'autres données graphiques en rapport avec le widget. Ces valeurs de style sont définiées par défaut dans chacun des widgets, et sont requises par certains appels de fonction GDK comme $pixmap->create_from_xpm(), à qui ici on donne la couleur du fond ``normale''. Utilisant les fichiers de ressources, les données de style de widget peuvent être personnalisées.

Remarquez également l'appel de la fonction realize() après avoir déclaré la largeur des bords de la fenêtre. Cette fonction utilise GDK pour créer les fenêtres X reliées au widget. Cette fonction est appelée automatiquement quand on invoque la fonction show() pour un widget, et d'ailleurs on ne l'a pas utilisé dans les exemples précédents. Mais l'appel de la fonction create_from_xpm() requiert que son argument window fasse référence à une réelle fenêtre X, c'est pourquoi il est nécessaire de réaliser ce widget avant cet appel GDK.