CLI gtkdialog: Troubles with Aligning Pixmaps and Radiobuttons [Solved]

[ozboomer]

I'm trying to get some more understanding of gtkdialog for use with some of the utilities I've built in Puppy.

While the docs I can find (in Puppy itself and on-line) are Ok, they don't include any examples beyond 'basic' usage, so using the program is a bit of a puzzle.

Most of the utilities in Puppy that use gtkdialog build their dialogs dynamically, which makes things difficult... and even if I dump out the variables that contain the XML-like code, most of the utilities I've looked at don't do what I'm trying to do.

Specifically, I'm trying to do something like what "Resize personal storage file" (/usr/sbin/resizepfile.sh) does with a pixmap 'percentage bar'... but in combination with a set of radiobuttons. resizepfile.sh does things with 'label's, so that's Ok... but when I try to do something similar with radiobuttons, the pixmaps don't align with the radiobuttons... or the radiobuttons don't work.

I've attached some example code that sort of works... but with the problems described.

I'm currently using fossapup64 9.5, which provides gtkdialog 0.8.4.

I'd appreciate any pointers.

Thanks!

Code: Select all

#!/bin/sh

. gettext.sh
      
PARTSIZE=1000
PARTFREE=200      
SAVEPART=sda3:

. /usr/lib/gtkdialog/svg_bar 200 "$(((($PARTSIZE-$PARTFREE)*200/$PARTSIZE)))" "$PARTSIZE Mb / $PARTFREE Mb $(gettext 'free')"  > /tmp/resizepfile_partition.svg

export MAIN_DIALOG="
<window resizable=\"true\" title=\"RADIO BUTTON TEST\" homogeneous=\"false\" space-expand=\"true\" space-fill=\"true\"> 

     <vbox homogeneous=\"false\" space-expand=\"true\" space-fill=\"true\" xalign=\"0\">
     
        <hbox xalign=\"0\">
           <text><label>Two problems: 1) How do I get this text to be left-justified?  2) How can I get the pixmap objects to remain on the same line as the radiobuttons?  It can be done if you place each radiobutton in its own 'hbox' but then the radiobuttons don't work properly. </label></text>
        </hbox>

      <frame>
        <radiobutton yalign=\"true\">
          <variable>MODE_1</variable>
          <default>true</default>
          <label>/mnt/sdb1</label>
        </radiobutton>
        <pixmap yalign=\"true\"><input file>/tmp/resizepfile_partition.svg</input></pixmap>
        <text space-expand=\"true\" space-fill=\"true\" visible=\"false\"><label>\" \"</label></text>
        
        <radiobutton yalign=\"true\">
          <variable>MODE_2</variable>
          <default>false</default>
          <label>/mnt/sdc2</label>
        </radiobutton>
        <pixmap><input file>/tmp/resizepfile_partition.svg</input></pixmap>
        <text space-expand=\"true\" space-fill=\"true\" visible=\"false\"><label>\" \"</label></text>
        
        <radiobutton>
          <variable>MODE_3</variable>
          <default>false</default>
          <label>/mnt/sdd4</label>
        </radiobutton>
        <pixmap><input file>/tmp/resizepfile_partition.svg</input></pixmap>
        
      </frame>

      <hseparator></hseparator>

      
      <hbox> 
         <button> 
            <input file icon=\"gtk-quit\"></input> 
            <label>Quit</label> 
            <variable>QUITBUTTON</variable>
            <action type=\"exit\">EXIT_QUIT</action> 
         </button> 
      </hbox>
      
   </vbox>
       
</window>
"

gtkdialog --program=MAIN_DIALOG --center

exit 0

[MochiMoppel]

Two problems: 1) How do I get this text to be left-justified?

Code: Select all

<hbox>
   <text xalign=\"0\"  space-fill=\"true\" space-expand=\"true\"><label>Two problems:...</label></text>
</hbox>

2) How can I get the pixmap objects to remain on the same line as the radiobuttons? It can be done if you place each radiobutton in its own 'hbox' but then the radiobuttons don't work properly

Maybe like this: In the frame create a hbox, In the hbox create 2 vboxes. The left vbox holds your radiobuttons, the right vbox holds the pixmaps

Code: Select all

<frame>
    <hbox>
        <vbox>
            <radiobutton>
              <variable>MODE_1</variable>
              <default>true</default>
              <label>/mnt/sdb1</label>
            </radiobutton>
           <radiobutton>
              <variable>MODE_2</variable>
              <default>false</default>
              <label>/mnt/sdc2</label>
            </radiobutton>
            <radiobutton>
              <variable>MODE_3</variable>
              <default>false</default>
              <label>/mnt/sdd4</label>
            </radiobutton>
        </vbox>
        <vbox>
            <pixmap><input file>/tmp/resizepfile_partition.svg</input></pixmap>
            <pixmap><input file>/tmp/resizepfile_partition.svg</input></pixmap>
            <pixmap><input file>/tmp/resizepfile_partition.svg</input></pixmap>
        </vbox>
    </hbox>
</frame>

radiobuttontest.png (21.81 KiB) Viewed 1026 times

BTW: "yalign" ? Never seen that. And IIRC "xalign" works only with <text> and <entry> and not with any other widgets, definitely not with boxes.

[ozboomer]

Maybe like this: In the frame create a hbox, In the hbox create 2 vboxes. The left vbox holds your radiobuttons, the right vbox holds the pixmaps

Well, that was fairly simple... Fanx! A question asked instead of busting my brain by myself for (literally) hours and making little progress. Dang. It seems like it boils down to me (continuing to) have little clue about 'packers'; I have the same trouble with Perl (Tk) and Python (Tkinter)...

Although,the size of the text in the 'label' still seems to control the width of the GUI, which makes my output look a little different to yours (when keeping the original text/question in the GUI):-

Screenshot.png (11.88 KiB) Viewed 1009 times

I still also have to nut out the strength of the homogeneous=\"false\" space-expand=\"true\" space-fill=\"true\" tags... and why some need to be quoted and others can be left plain... Something to do with the variable translation, I'm guessing...

BTW: "yalign" ? Never seen that. And IIRC "xalign" works only with <text> and <entry> and not with any other widgets, definitely not with boxes.

Ya, tha's my nonsense while experimenting. If there's an 'xalign' tag, it would seem logical to have a 'yalign' tag as well... but I guess if it's unknown, it's ignored... where other unknown tags are actually flagged as an error, so I dunno...

Fanx! again for helping out.

[ozboomer]

Again, most helpful info, thanks @MochiMoppel...

Latest CrAzIneSs (but I think I'm coming to understand) is the attached...

So, it appears that if you want to place items 'horizontally adjacent', they must each be placed in a vbox and all of the vboxes need to be placed within an hbox...and the 'earlier' item in the code within a vbox has the priority on having its 'xalign' tag respected - is that right?

"With great power flexibility, comes great responsibility complexity" --a lotta people

Code: Select all

#!/bin/sh

# an example to illustrate the 'priorities' of alignments and
# vbox use within an hbox

export GTKDIALOG_XML='
<window>
   <vbox>
      <hbox>
         <vbox width-request="200">
            <frame left box>
               <text xalign="0"><label>Left-Justified Text 1</label></text>
               <text xalign="0"><label>Left-Justified Text 2</label></text>
            </frame>

         </vbox>
    
         <vbox width-request="200">
            <frame mid box>
               <text xalign="1"><label>Right-Justified Text 3</label></text>
               <text xalign="1"><label>Right-Justified Text 4</label></text>
            </frame>

         </vbox>

         <vbox width-request="300">
            <frame right box>
               <text xalign="1"><label>Right-Justified Text 5</label></text>
               <checkbox xalign="1">
                  <label>Should be to Right</label>
               </checkbox>
            </frame>

         </vbox>

      </hbox>

   </vbox>

</window>
'

gtkdialog --program=GTKDIALOG_XML

exit 0

[MochiMoppel]

So, it appears that if you want to place items 'horizontally adjacent', they must each be placed in a vbox and all of the vboxes need to be placed within an hbox

Generally yes but depends on your "items". For text columns you could also consider to use a tree widget.

...and the 'earlier' item in the code within a vbox has the priority on having its 'xalign' tag respected - is that right?

No.

[ozboomer]

First up, again, many thanks for the info, as I can see the 'light at the end of the tunnel' now, having gone to using disk_1 -type variables instead of arrays... as well as incorporating some of the other suggestions in my current script (as discussed in the other related topic: see viewtopic.php?t=9466 ).

The attached sample code illustrates an outstanding issue... of trying to align a radio button with text all on the same line. Whilst the idea of grouping items in a vbox for alignment with pixmaps seems to work Ok, doing the same with radio buttons and text labels is just as problematic.. as it seems the overall height of a radio button widget is greater than the height of a text/label widget.

I've tried some different arrangements of hbox and vbox and I don't think anything there works. I can include the disk label with the disk path /mnt/sdb1 (Data-1)... or I can create a pixmap with text (seems like overkill)... or I can just omit the disk label entirely... but what I have in my example is not going to be very good once the list of items gets to 4 or more, as the misalignment will be too great.

As always, I'd greatly appreciate any thoughts on how to deal with this one..

Fanx!

Code: Select all

#!/bin/sh
# about misalignment of radiobuttons with text/labels
#

export MAIN_DLG='
<window title="hb3">
   <vbox>

      <frame Disk Info:>
         <hbox homogeneous="false" space-expand="true" space-fill="true">

            <vbox>
               <text xalign="0" use-markup="true"><label>"<b>Disk Path</b>"</label></text>
               <radiobutton>
                  <variable>OP1</variable>
                  <default>true</default>
                  <label>/mnt/sdb1</label>
               </radiobutton>
           
               <radiobutton>
                  <variable>OP2</variable>
                  <default>false</default>
                  <label>/mnt/sdc3</label>
               </radiobutton>
           
               <radiobutton>
                  <variable>OP3</variable>
                  <default>false</default>
                  <label>/mnt/sdd4</label>
               </radiobutton>
          
            </vbox>

            <vbox>
               <text xalign="0" use-markup="true"><label>"<b>Label</b>"</label></text>

<text xalign="0"><label>Data-1</label></text> 
<text xalign="0"><label>Data-2</label></text>
<text xalign="0"><label>Data-3</label></text> 

               <text><label>""</label></text>

            </vbox>

         </hbox>
      
      </frame>


      <button> 
         <input file icon="gtk-quit"></input> 
         <label>Quit</label> 
         <variable>QUITBUTTON</variable>
         <action function="exit">QUIT</action>
      </button> 


   </vbox>
 
</window>
'

gtkdialog3 --program=MAIN_DLG --geometry=+400+100

exit 0

[HerrBert]

add homogeneous="true" to the vboxes inside hbox and remove the empty label:

hb4.jpg (17.63 KiB) Viewed 739 times

Code: Select all

#!/bin/sh
# about misalignment of radiobuttons with text/labels
#

export MAIN_DLG='
<window title="hb4">
   <vbox>

      <frame Disk Info:>
         <hbox homogeneous="false" space-expand="true" space-fill="true">

            <vbox homogeneous="true">
               <text xalign="0" use-markup="true"><label>"<b>Disk Path</b>"</label></text>
               <radiobutton>
                  <variable>OP1</variable>
                  <default>true</default>
                  <label>/mnt/sdb1</label>
               </radiobutton>
           
               <radiobutton>
                  <variable>OP2</variable>
                  <default>false</default>
                  <label>/mnt/sdc3</label>
               </radiobutton>
           
               <radiobutton>
                  <variable>OP3</variable>
                  <default>false</default>
                  <label>/mnt/sdd4</label>
               </radiobutton>
          
            </vbox>

            <vbox homogeneous="true">
               <text xalign="0" use-markup="true"><label>"<b>Label</b>"</label></text>

<text xalign="0"><label>Data-1</label></text> 
<text xalign="0"><label>Data-2</label></text>
<text xalign="0"><label>Data-3</label></text> 


            </vbox>

         </hbox>
      
      </frame>


      <button> 
         <input file icon="gtk-quit"></input> 
         <label>Quit</label> 
         <variable>QUITBUTTON</variable>
         <action function="exit">QUIT</action>
      </button> 


   </vbox>
 
</window>
'

gtkdialog3 --program=MAIN_DLG --geometry=+400+100

exit 0

[ozboomer]

add homogeneous="true" to the vboxes inside hbox and remove the empty label:

Dang. Wot a star..

'tis an experience thing, f'sure... Now that you explain it.. and having recently come to know how the 'homogeneous' tag works, it's pretty obvious, really...

Fanx! a heap...