Widgets 2 : Frame, Text, Scrollbar, Scale

Frame

A frame is a simple widget. Its primary purpose is to act as a spacer or container for complex window layouts. The only features of a frame are its background color and an optional 3-D border to make the frame appear raised or sunken. Frame can be created just like any other widget -
my $frm = $mw -> Frame();
To place other widgets in this frame, you should use the frame widget variable as its parent. Normally the parent is '$mw' or the MainWindow. But if we wish to put a widget inside a frame, use the frame variable('$frm' in this case) in place of '$mw'. Like this...
my $lab = $frm_name -> Label(-text=>"Name:") -> pack();

Some Options

-relief=>STYLE

Specifies the 3-D effect desired for the widget. Acceptable values are raised, sunken, flat, ridge, solid, and groove. The value indicates how the interior of the widget should appear relative to its exterior; for example, raised means the interior of the widget should appear to protrude from the screen, relative to the exterior of the widget.

Example

#!/usr/local/bin/perl
use Tk;

my $mw = new MainWindow; # Main Window

my $frm_name = $mw -> Frame() -> pack(); #New Frame
my $lab = $frm_name -> Label(-text=>"Name:") -> pack();
my $ent = $frm_name -> Entry() -> pack();

my $but = $mw -> Button(-text=>"Push Me", -command =>\&push_button) -> pack();

MainLoop;

#This function will be executed when the button is pushed
sub push_button {
	$ent -> insert(0,"Hello, ");
}

---

Text

A text widget displays one or more lines of text and allows that text to be edited. Similar to the entry widget but a larger version of it.

Some Options

-xscrollcommand => COMMAND	This is to enable communication between a text widget and a scroll bar widget. There is a -yscrollcommand similler to this one.
-font => FONTNAME	Specifies the font to use when drawing text inside the widget.
-width => NUMBER	Specifies the width of the widget
-height => NUMBER	Specifies the, you guessed it, height of the widget

Syntax	Description	Example
$widget -> get(index1, ?index2 ...?);	Return a range of characters from the text. The return value will be all the characters in the text starting with the one whose index is index1 and ending just before the one whose index is index2 (the character at index2 will not be returned). If index2 is omitted then the single character at index1 is returned. Note that the index of text is different from that of the entry widget. The index of text widget is in the form LINE_NO.CHARECTER_NO. This means that 1.0 means the first character in the first line.	$contents = $txt -> get(1.0,'end');
$widget -> insert(index,DATA);	Inserts all of the chars arguments just before the character at index. If index refers to the end of the text (the character after the last newline) then the new text is inserted just before the last newline instead.	$txt -> inset('end',"Hello World");

Example

#!/usr/local/bin/perl
use Tk;

my $mw = new MainWindow; # Main Window

my $frm_name = $mw -> Frame() -> pack();
my $lab = $frm_name -> Label(-text=>"Name:") -> pack();
my $ent = $frm_name -> Entry() -> pack();

my $but = $mw -> Button(-text=>"Push Me", -command =>\&push_button) -> pack();
#Text Area
my $txt = $mw -> Text(-width=>40, -height=>10) -> pack();

MainLoop;

#This function will be executed when the button is pushed
sub push_button {
	my $name = $ent -> get();
	$txt -> insert('end',"Hello, $name.");
}

---

Scrollbar
A scroll bar is a widget that displays two arrows, one at each end of the scroll bar, and a slider in the middle portion of the scroll bar. It provides information about what is visible in an associated window that displays an document of some sort (such as a file being edited or a drawing). The position and size of the slider indicate which portion of the document is visible in the associated window. For example, if the slider in a vertical scroll bar covers the top third of the area between the two arrows, it means that the associated window displays the top third of its document. It is made to work with other widgets like text. Some Options

-orient=>DIRECTION	For widgets that can lay themselves out with either a horizontal or vertical orientation, such as scroll bars, this option specifies which orientation should be used. DIRECTION must be either horizontal or vertical or an abbreviation of one of these.
-command => COMMAND	This command gets executed when the scroll bar is moved. This option almost always has a value such as .t xview or .t yview, consisting of the name of a widget and either xview (if the scroll bar is for horizontal scrolling) or yview (for vertical scrolling). All scrollable widgets have xview and yview commands that take exactly the additional arguments appended by the scroll bar.

Example

#!/usr/local/bin/perl
use Tk;

my $mw = new MainWindow; # Main Window

my $frm_name = $mw -> Frame();
my $lab = $frm_name -> Label(-text=>"Name:");
my $ent = $frm_name -> Entry();

my $but = $mw -> Button(-text=>"Push Me", -command =>\&push_button);

my $textarea = $mw -> Frame(); #Creating Another Frame
my $txt = $textarea -> Text(-width=>40, -height=>10);
my $srl_y = $textarea -> Scrollbar(-orient=>'v',-command=>[yview => $txt]);
my $srl_x = $textarea -> Scrollbar(-orient=>'h',-command=>[xview => $txt]);
$txt -> configure(-yscrollcommand=>['set', $srl_y], 
		-xscrollcommand=>['set',$srl_x]);

$lab -> grid(-row=>1,-column=>1);
$ent -> grid(-row=>1,-column=>2);
$frm_name -> grid(-row=>1,-column=>1,-columnspan=>2);

$but -> grid(-row=>4,-column=>1,-columnspan=>2);

$txt -> grid(-row=>1,-column=>1);
$srl_y -> grid(-row=>1,-column=>2,-sticky=>"ns");
$srl_x -> grid(-row=>2,-column=>1,-sticky=>"ew");
$textarea -> grid(-row=>5,-column=>1,-columnspan=>2);

MainLoop;

#This function will be executed when the button is pushed
sub push_button {
	my $name = $ent -> get();
	$txt -> insert('end',"Hello, $name.");
}

grid

As you can see I have used 'grid' here. Grid is NOT a widget. It is a geometry manager like pack but more advanced. Lets take a closer look at the commands -
$widget -> grid(-row=>1, -column=>1);
This line will tell the interpreter to put the widget called '$txt' in the first row of the first column of its parent widget. The below digram will help you understand.

	Column 1	Column 2
Row 1	'$txt' widget will be here	'$srl_y' widget's place
Row 2	'$srl_x' widget's position.

Some Options

-sticky => STYLE	This option may be used to position (or stretch) the widget within its cell. STYLE is a string that contains zero or more of the characters n, s, e or w. Each letter refers to a side (north, south, east, or west) that the slave will "stick" to. If both n and s (or e and w) are specified, the slave will be stretched to fill the entire height (or width) of its cavity.
-ipadx => AMOUNT	The AMOUNT specifies how much horizontal internal padding to leave on each side of the slave(s). This is space is added inside the slave(s) border.
-ipady => AMOUNT	The AMOUNT specifies how much vertical internal padding to leave on each side of the slave(s). Options same as -ipadx
-padx => AMOUNT	The amount specifies how much horizontal external padding to leave on each side of the slave(s), in screen units. AMOUNT may be a list of two values to specify padding for left and right separately.
-pady => AMOUNT	The amount specifies how much vertical external padding to leave on the top and bottom of the slave(s), in screen units. Options same as -padx.
-row => N	Insert the slave so that it occupies the Nth row in the grid. Row numbers start with 0. If this option is not supplied, then the slave is arranged on the same row as the previous slave specified on this call to grid, or the first unoccupied row if this is the first slave.
-column => N	Insert the slave so that it occupies the N'th column in the grid. Options same as -row
-rowspan => N	Insert the slave so that it occupies N rows in the grid. The default is one row.
-columnspan => N	Insert the slave so that it occupies N columns in the grid.

Using grid requires a bit of experience - but if you know HTML it would help a lot. The rows and columns are just like those in HTML tables - although the codes are very different.

---

Scale

Makes a slider that can be adjusted by the user to input a variable.

Some Options

-from => NUMBER	Starting Number
-to => NUMBER	Ending Number
-tickinterval => NUMBER	Determines the spacing between numerical tick marks displayed below or to the left of the slider.
-varable => NAME	Specifies the name of a global variable to link to the scale. Whenever the value of the variable changes, the scale will update to reflect this value. Whenever the scale is manipulated interactively, the variable will be modified to reflect the scale's new value.

Syntax	Description	Example
$widget -> get();	Get the current value of the scale	my $age = $scl -> get();
$widget -> set(value);	Give the scale a new value.	$scl -> set(20);

Example

#!/usr/local/bin/perl
use Tk;

#Global Variables
my $age = 10;

# Main Window
my $mw = new MainWindow;

#GUI Building Area
my $frm_name = $mw -> Frame();
my $lab = $frm_name -> Label(-text=>"Name:");
my $ent = $frm_name -> Entry();
#Age
my $scl = $mw -> Scale(-label=>"Age :",
	 -orient=>'v',	 	-digit=>1,
	 -from=>10,		-to=>50,
	 -variable=>\$age,	-tickinterval=>10);

my $but = $mw -> Button(-text=>"Push Me", -command =>\&push_button);

#Text Area
my $textarea = $mw -> Frame();
my $txt = $textarea -> Text(-width=>40, -height=>10);
my $srl_y = $textarea -> Scrollbar(-orient=>'v',-command=>[yview => $txt]);
my $srl_x = $textarea -> Scrollbar(-orient=>'h',-command=>[xview => $txt]);
$txt -> configure(-yscrollcommand=>['set', $srl_y], 
		-xscrollcommand=>['set',$srl_x]);

#Geometry Management
$lab -> grid(-row=>1,-column=>1);
$ent -> grid(-row=>1,-column=>2);
$scl -> grid(-row=>2,-column=>1);
$frm_name -> grid(-row=>1,-column=>1,-columnspan=>2);

$but -> grid(-row=>4,-column=>1,-columnspan=>2);

$txt -> grid(-row=>1,-column=>1);
$srl_y -> grid(-row=>1,-column=>2,-sticky=>"ns");
$srl_x -> grid(-row=>2,-column=>1,-sticky=>"ew");
$textarea -> grid(-row=>5,-column=>1,-columnspan=>2);

MainLoop;

## Functions
#This function will be exected when the button is pushed
sub push_button {
	my $name = $ent -> get();
	$txt -> insert('end',"$name is $age years old.");
}

Now our little example is becoming more and more like a program. We have added the comments to it as it has grown big and is difficult to understand. Now we have added a slider with which age can be inputed.