Gtkdialog: cree interfaces gráficas (GTK +) y cuadros de diálogo utilizando scripts de shell en Linux


Gtkdialog (o gtkdialog) es una ingeniosa utilidad de código abierto para crear y construir interfaces GTK + y cuadros de diálogo con la ayuda de scripts de shell de Linux y usar la biblioteca GTK, además de usar una sintaxis similar a xml, que facilita la creación de interfaces mediante gtkdialog. Es muy similar a la herramienta más famosa llamada Zenity, pero viene con algunas funciones personalizables útiles que le permiten crear fácilmente muchos widgets como vbox, hbox, botón, marco, texto, menú y mucho más.

Lea también : Cree cuadros de diálogo gráficos GTK + con Zenity

Instalación de Gtkdialog en Linux

Puede descargar gtkdialog-0.8.3 (que es la última versión) o también puede usar el comando wget, descomprimir el archivo descargado y ejecutar los siguientes comandos para compilar desde la fuente.

$ sudo apt-get install build-essential		[on Debian based systems]
# yum install gcc make gcc-c++			[on RedHat based systems]
$ wget https://gtkdialog.googlecode.com/files/gtkdialog-0.8.3.tar.gz
$ tar -xvf gtkdialog-0.8.3.tar.gz
$ cd gtkdialog-0.8.3/
$ ./configure
$ make
$ sudo make install

Ahora comencemos a crear algunos cuadros, cree un nuevo script " myprogram " en su carpeta de inicio.

$ cd
$ touch myprogram

Ahora abra el archivo “ myprogram ” usando cualquier editor de texto que desee y agregue el siguiente código.

#!/bin/bash 

GTKDIALOG=gtkdialog 
export MAIN_DIALOG=' 

<window title="My First Program" icon-name="gtk-about" resizable="true" width-request="300" height-request="310"> 

<vbox> 
	<hbox space-fill="true" space-expand="true"> 
		<button>	 
			<label>Welcome to TecMint.com Home!</label> 
			<action>echo "Welcome to TecMint.com Home!"</action> 
		</button> 
	</hbox> 
</vbox> 
</window> 
' 

case $1 in 
	-d | --dump) echo "$MAIN_DIALOG" ;; 
	*) $GTKDIALOG --program=MAIN_DIALOG --center ;; 

esac 
------------

Guarde el archivo, establezca el permiso de ejecución y ejecútelo como se muestra.

$ chmod 755 myprogram
$ ./myprogram

Así es como se creó y ejecutó su primer programa usando gtkdialog.

Ahora, explicaremos brevemente el código.

  1. #!/bin/bash: The first line of any shell script, it is used to specify the bash shell path.
  2. GTKDIALOG = gtkdialog: Here we defined a variable to use it later when executing the shell script with gtkdialog, this line must be in all scripts that you create using gtkdialog.
  3. export MAIN_DIALOG=: Another variable we defined which will contain all syntax for our interface, you can replace MAIN_DIALOG with any name you want, but you have to replace it also in last 4 lines of the script.
  4. Window Title: I don’t think that this code need to be explained, we created a title, a default icon for the window, we choose if it was resizable or not, and we defined the width and height we want, of course all of those options are secondary, you can just use the <window> tag if you want.
  5. <vbox> : We use the vbox tag to create a vertical box, it is important to create a vbox tag in order to contain other tags such as hbox and button, etc.
  6. <hbox>: Here we created a horizontal box using the <hbox> tag, “space-fill” and “space-expand” are options to expand the hbox through the window.
  7. <button>: Create a new button.
  8. <label>: This is the default text for the button, we closed the label tag using </label>, of course it is very important to close all the tags that we use.
  9. <action>: This what happens when the button is clicked, you can run a shell command if you want or execute any other file if you want, there are many other actions and signals as well, don’t forget to close it using </action>.
  10. </button>: To close the button tag.
  11. </hbox>: To close the hbox tag.
  12. </window>: To close the window tag.

Las últimas 4 líneas también deben estar en todos los scripts de shell que crees usando gtkdialog, ejecutan la variable MAIN_DIALOG usando el comando gtkdialog con la opción –center para centrar la ventana, muy útil de hecho.

De manera similar, cree otro archivo y llámelo como "segundo programa" y agregue el siguiente contenido completo.

#!/bin/bash 

GTKDIALOG=gtkdialog 
export MAIN_DIALOG=' 

<window title="My Second Program" icon-name="gtk-about" resizable="true" width-request="250" height-request="150"> 

<vbox> 
	<hbox space-fill="true"> 
		<combobox>	 
			<variable>myitem</variable> 
			<item>First One</item> 
			<item>Second One</item> 
			<item>Third One</item> 
		</combobox> 
	</hbox> 
	<hbox> 
		<button> 
			<label>Click Me</label> 
			<action>echo "You choosed $myitem"</action> 
		</button> 
	</hbox> 
<hseparator width-request="240"></hseparator> 

	<hbox> 
		<button ok></button> 
	</hbox> 
</vbox> 
</window> 
' 

case $1 in 
	-d | --dump) echo "$MAIN_DIALOG" ;; 
	*) $GTKDIALOG --program=MAIN_DIALOG --center ;; 

esac

Guarde el archivo, establezca el permiso de ejecución en él y ejecútelo como se muestra.

$ chmod 755 secondprogram
$ ./secondprogram

Ahora, explicaremos brevemente el código.

  1. We create a combobox widget using <combobox>, the <variable> tag is the default name of the variable which the chosen item will be stored in, we used this variable to print the selected item later using echo.
  2. <hseparator> is a horizontal separator, you can set the default width for it using width-request option.
  3. <button ok></button> is an OK button that will close the window just when you click it, it is very useful so we don’t need to create a custom button to do that.

Cree otro archivo llamado "tercer programa" y agréguele todo el código.

#!/bin/bash 

GTKDIALOG=gtkdialog 
export MAIN_DIALOG=' 

<window title="My Second Program" icon-name="gtk-about" resizable="true" width-request="250" height-request="150"> 

<notebook tab-label="First | Second|"> 
<vbox> 
	<hbox space-fill="true"> 
		<combobox>	 
			<variable>myitem</variable> 
			<item>First One</item> 
			<item>Second One</item> 
			<item>Third One</item> 
		</combobox> 
	</hbox> 
	<hbox> 
		<button> 
			<label>Click Me</label> 
			<action>echo "You choosed $myitem"</action> 
		</button> 
	</hbox> 
<hseparator width-request="240"></hseparator> 

	<hbox> 
		<button ok></button> 
	</hbox> 
</vbox> 

<vbox> 

	<hbox space-fill="true"> 
		<text> 
		<label>Spinbutton </label> 
		</text> 
	</hbox> 

	<hbox space-fill="true" space-expand="true"> 
		<spinbutton range-min="0" range-max="100" range-value="4"> 
			<variable>myscale</variable> 
			<action>echo $myscale</action> 
		</spinbutton> 
	</hbox> 

	<hbox> 
		<button ok></button> 
	</hbox> 

</vbox> 
</notebook> 
</window> 
' 

case $1 in 
	-d | --dump) echo "$MAIN_DIALOG" ;; 
	*) $GTKDIALOG --program=MAIN_DIALOG --center ;; 

esac

Guarde el archivo, conceda permiso de ejecución y enciéndalo como se muestra.

$ chmod 755 thirdprogram
$ ./thirdprogram

Aquí, la explicación del código de forma más detallada.

  1. We created two notebook tabs using <notebook>, the tab-label option is where you can create tabs, gtkdialog will create tabs depending on the labels you enter, every <vbox> is defined as a tab, so the first tab starts with the first <vbox>, the second tab starts with the second <vbox>.
  2. <text> is a text widget, we used the <label> tag to set the default text for it.
  3. <spinbutton> tag will create a new spin button, range-min option is the minimum value, and range-max is the maximum value for the spin button, range-value is the default value for the spin button.
  4. We gave a variable “myscale” to the <spinbutton>.
  5. We printed the selected value using echo and $myscale variable, the default signal for the action here is “value-changed” which helped us doing that.

Esta fue solo una ventana de ejemplo, puede crear interfaces más complicadas usando gtkdialog si lo desea, puede navegar por la documentación oficial en el sitio web de gtkdialog para ver todas las etiquetas de gtkdialog desde el enlace a continuación.

Documentación de gtkdialog

¿Ha utilizado gtkdialog para crear GUI para sus scripts de shell antes? ¿O ha utilizado alguna utilidad de este tipo para crear interfaces? ¿Qué piensa usted al respecto?