<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>4.3 The Grid Geometry Manager</TITLE><LINK href="ozdoc.css" rel="stylesheet" type="text/css"></HEAD><BODY><TABLE align="center" border="0" cellpadding="6" cellspacing="6" class="nav"><TR bgcolor="#DDDDDD"><TD><A href="node16.html#section.geometry.pack"><< Prev</A></TD><TD><A href="node14.html">- Up -</A></TD><TD><A href="node18.html#section.geometry.anchor">Next >></A></TD></TR></TABLE><DIV id="section.geometry.grid"><H2><A name="section.geometry.grid">4.3 The Grid Geometry Manager</A></H2><P> <A name="label181"></A> The grid geometry arranges widgets in a grid-like fashion. For each widget to be managed by the <CODE>grid</CODE> command, a row and a column number is given. The manager computes parcels for the widgets such that all parcels in the same column have the same width and all parcels in the same row have the same height. </P><P> <A href="node17.html#figure.geometry.grid">Figure 4.7</A> shows how eight labels are placed by the <CODE>grid</CODE> command. Note that it is not necessary that all positions in the grid are occupied by a widget. In our example in <A href="node17.html#figure.geometry.grid">Figure 4.7</A>, the position at row and column <CODE>2</CODE> does not contain a widget. </P><DIV id="figure.geometry.grid"><HR><P><A name="figure.geometry.grid"></A></P><P> </P><DIV align="center"><IMG alt="" src="grid.gif"></DIV><P> </P><DL class="anonymous"><DD class="code"><CODE><SPAN class="keyword">proc</SPAN><SPAN class="variablename"> </SPAN>{<SPAN class="functionname">GL</SPAN> W R C S}<BR> L={New Tk<SPAN class="keyword">.</SPAN>label tkInit(parent:W text:S)}<BR><SPAN class="keyword">in</SPAN> <BR> {Tk<SPAN class="keyword">.</SPAN>send grid(L row:R column:C padx:4 pady:4)}<BR><SPAN class="keyword">end</SPAN> <BR>{GL W 1 1 nw} {GL W 1 2 north} {GL W 1 3 ne}<BR>{GL W 2 1 west} {GL W 2 3 east}<BR>{GL W 3 1 sw} {GL W 3 2 south} {GL W 3 3 sw}</CODE></DD></DL><P> </P><P class="caption"><STRONG>Figure 4.7:</STRONG> Using the <CODE>grid</CODE> command.</P><HR></DIV><P> </P><H3><A name="label182">4.3.1 Padding</A></H3><P> <A name="label183"></A> <A name="label185"></A> <A name="label187"></A> <A name="label189"></A> <A name="label191"></A> The <CODE>grid</CODE> command supports padding in the same way as the packer does. In the above example we used external padding by giving <CODE>padx</CODE> and <CODE>pady</CODE> options. It is also possible to use internal padding with the options <CODE>ipadx</CODE> and <CODE>ipady</CODE>. </P><H3><A name="label192">4.3.2 Span Options</A></H3><P> <A name="label194"></A> <A name="label196"></A> The grid command can also compute geometries where widgets occupy more than a single row or column. In the example shown in <A href="node17.html#figure.geometry.span">Figure 4.8</A> the label widget <CODE>L</CODE> is managed by the <CODE>grid</CODE> command to occupy both two rows and two columns. How much rows and columns a widget's parcel spans is specified with the <CODE>columnspan</CODE> and <CODE>rowspan</CODE> options. </P><DIV id="figure.geometry.span"><HR><P><A name="figure.geometry.span"></A></P><P> </P><DIV align="center"><IMG alt="" src="grid-span.gif"></DIV><P> </P><DL class="anonymous"><DD class="code"><CODE>{Tk<SPAN class="keyword">.</SPAN>send grid({New Tk<SPAN class="keyword">.</SPAN>label tkInit(parent:W text:<SPAN class="string">'Upper left'</SPAN>)} <BR> row:1 rowspan:2<BR> column:1 columnspan:2<BR> padx:4 pady:4)}<BR>{GL W 1 3 ne} {GL W 2 3 east}<BR>{GL W 3 1 sw} {GL W 3 2 south} {GL W 3 3 sw}</CODE></DD></DL><P> </P><P class="caption"><STRONG>Figure 4.8:</STRONG> Using the <CODE>columnspan</CODE> and <CODE>rowspan</CODE> options.</P><HR></DIV><P> </P><P> </P><DIV id="section.geometry.sticky"><H3><A name="section.geometry.sticky">4.3.3 Sticky Options</A></H3><P> <A name="label198"></A> The <CODE>grid</CODE> command combines the <CODE>anchor</CODE> and <CODE>fill</CODE> options from the packer in a single <CODE>sticky</CODE> option. The value given for a sticky option determines both the side the widget is placed in its parcel, and how the widget is to be stretched to fill its parcel. </P><P> Valid values for the <CODE>sticky</CODE> option are all combinations of the letters <CODE>n</CODE>, <CODE>s</CODE>, <CODE>w</CODE>, and <CODE>e</CODE> in any order. Giving one of <CODE>n</CODE> and <CODE>s</CODE> (or of <CODE>w</CODE> and <CODE>e</CODE>) specifies the anchor position of a widget. Giving both <CODE>n</CODE> and <CODE>s</CODE> (or both <CODE>w</CODE> and <CODE>e</CODE>) requests that the widget should fill its parcel horizontally (or vertically). For an example see <A href="node17.html#figure.geometry.sticky">Figure 4.9</A>. </P><DIV id="figure.geometry.sticky"><HR><P><A name="figure.geometry.sticky"></A></P><P> </P><DIV align="center"><IMG alt="" src="grid-sticky.gif"></DIV><P> </P><DL class="anonymous"><DD class="code"><CODE>{Tk<SPAN class="keyword">.</SPAN>send grid({New Tk<SPAN class="keyword">.</SPAN>label tkInit(parent:W text:<SPAN class="string">'Upper left'</SPAN>)} <BR> row:1 rowspan:2<BR> column:1 columnspan:2<BR> sticky: nse<BR> padx:4 pady:4)}</CODE></DD></DL><P> </P><P class="caption"><STRONG>Figure 4.9:</STRONG> Using the <CODE>sticky</CODE> option with the <CODE>grid</CODE> command.</P><HR></DIV><P> </P></DIV><H3><A name="label199">4.3.4 Weight Options</A></H3><P> <A name="label201"></A> The grid geometry manager employs a different scheme for expansion of parcels than the packer. Rows and columns in the grid can be assigned an integer weight. Additional space available in the master of the grid is distributed between the rows and columns according to their relative weight. </P><P> For example, if we take the last example and want that all additional space is given to the third row and third column, we can do this by </P><DL class="anonymous"><DD class="code"><CODE>{Tk<SPAN class="keyword">.</SPAN>batch [grid(rowconfigure W 3 weight:1)<BR> grid(columnconfigure W 3 weight:1)]}</CODE></DD></DL><P> <A href="node17.html#figure.geometry.weight">Figure 4.10</A> shows the result of resizing the window. </P><DIV id="figure.geometry.weight"><HR><P><A name="figure.geometry.weight"></A></P><DIV align="center"><IMG alt="" src="grid-weight.gif"></DIV><P class="caption"><STRONG>Figure 4.10:</STRONG> Result of resizing a window.</P><HR></DIV><P> </P></DIV><TABLE align="center" border="0" cellpadding="6" cellspacing="6" class="nav"><TR bgcolor="#DDDDDD"><TD><A href="node16.html#section.geometry.pack"><< Prev</A></TD><TD><A href="node14.html">- Up -</A></TD><TD><A href="node18.html#section.geometry.anchor">Next >></A></TD></TR></TABLE><HR><ADDRESS><A href="http://www.ps.uni-sb.de/~schulte/">Christian Schulte</A><BR><SPAN class="version">Version 1.4.0 (20090610)</SPAN></ADDRESS></BODY></HTML>
distrib
>
Mandriva
>
2010.0
>
i586
>
media
>
contrib-release
>
by-pkgid
>
bd5c3d824c3db63ffd9226c15941e6ad
>
files
>
2349
