Monday, April 01, 2013

Buttons mit Bild in Perl/Tk und Tkx

Heute stand ich vor der Aufgabe in Tkx einen Button mit Bild umzusetzen. Wie das in Tk geht, wusste ich noch. Bei Tkx betrat ich Neuland. Wie es gemacht werden kann, wird in diesem kurzen Artikel aufgezeigt.

Button mit Bild in Perl/Tk

 "Wie das in Tk geht, wusste ich noch." 

#!perl

use strict;
use warnings;
use Tk;
use Tk::PNG;

my $png_image_file = 'media-playback-start-7.png';

my $mw = Tk::MainWindow->new();

my $pic = $mw->Photo(-file => $png_image_file);
my $btn = $mw->Button(

    -text => "Button mit PNG-Datei als Bild",
    -compound => 'top',
    -image => $pic,
);
$btn->pack(-padx => 10, -pady => 10,);

$mw->MainLoop();
exit(0);


Da das Bild eine PNG-Datei war, muss ein entsprechender Loader für Tk eingebunden werden:

use Tk::PNG;

Anschließend wird per Tk::Photo ein Bild-Objekt erzeugt: 

my $pic = $mw->Photo(-file => $png_image_file);

Damit sowohl der Text als auch das Bild angezeigt werden, wird die compound-Option des Buttons angegeben. Der Wert 'top' gibt an, dass sich das Bild oberhalb des Textes befinden soll:

my $btn = $mw->Button(
    -text => "Button mit PNG-Datei als Bild",

    -compound => 'top',
    -image => $pic,
);


Das Ergebnis sieht wie folgt aus:





Button mit Bild in Tkx

Die größte Herausforderung für mich bestand darin, herauszufinden, wie man den Loader für PNG-Dateien in Tkx angibt. Ohne diesen Loader erhält man folgende Fehlermeldung:

couldn't recognize data in image file "<some_png_file_name.png>" at <path_to_script.pl> line <line_number>.

Die Meldung von Perl/Tk gestaltet sich ähnlich: " couldn't recognize data in image file"

Ist die Hürde jedoch überwunden, kann man mit nachfolgendem Code wunderschöne Bilder-Buttons erstellen:

#!perl

use strict;
use warnings;
use Tkx;
Tkx::package_require('img::png');

my $png_image_file = 'media-playback-start-7.png';

my $mw = Tkx::widget->new(".");

Tkx::image_create_photo( 'pic', -file => $png_image_file);
my $btn = $mw->new_ttk__button(

    -text => "Button mit PNG-Datei als Bild",
    -compound => 'top',
    -image => 'pic',
);
$btn->g_pack(-padx => 10, -pady => 10,);

Tkx::MainLoop();
exit(0);


Das Button mit Bild in Perl/Tkx sieht auf Windows 8 so aus:


Quellen

Das Bild stammt aus der Open Icon Library: http://openiconlibrary.sourceforge.net

1 comment:

Anonymous said...

Hey!
Ich lerne Perl und ich "got stuck" mit diesem Button-mit-Bild, perl/Tkx, aber zum Glück habe ich diesen Artikel gefunden :)
Dankeschön dafür!