Creación de un Visor de Imágenes con Lista de Archivos Añadida utilizando Tk en Go
En la publicación anterior, examinamos brevemente la librería CGo-Free Tcl/Tk. En esta ocasión, procederemos a construir un visor de imágenes aplicando el ejemplo de la vez anterior.
Plan del Visor de Imágenes
- El indicador de imágenes de la sesión anterior carecía de funcionalidad de eliminación de imágenes, por lo que el tamaño de la ventana resultaba insuficiente al cargar múltiples imágenes. Eliminemos las etiquetas que no se utilizan.
- Si se van a listar múltiples imágenes en el indicador de imágenes, creemos una lista.
- Es preferible cargar múltiples imágenes a la vez.
- Implementemos también la funcionalidad para excluir imágenes que no se desean visualizar de la lista.
- Implementemos la función para seleccionar y visualizar una imagen específica entre múltiples imágenes.
Librería Tcl/Tk 9.0 Modificada
La implementación de Listbox en la librería existente es deficiente, lo que dificulta la visualización de la lista de imágenes. Descarguemos la librería modificada. Si Git CLI no está instalado, también es aceptable descargarla mediante un archivo tarball o zip.
1git clone https://github.com/gg582/tk9.0
Primero, examinemos algunas de las funcionalidades añadidas.
Antes de examinar las nuevas funciones, investiguemos brevemente cómo están estructuradas las funciones existentes a través de la función Destroy en la línea 1017 de tk.go.
1func Destroy(options ...Opt) {
2 evalErr(fmt.Sprintf("destroy %s", collect(options...)))
3}
Esta función está implementada transfiriendo la operación en formato de script Tcl a una función denominada evalErr. Esto significa que, para implementar la funcionalidad deseada, solo es necesario transmitir el comando en el formato de script Tcl correspondiente.
A modo de ejemplo, implementemos un método para añadir elementos a un listbox. Primero, para la scripting Tcl, examinemos el comando insert entre los comandos disponibles para listbox en el manual oficial.
Si observamos la página de descripción del comando insert, este inserta elementos enumerados en un índice específico. Por lo tanto, para implementar esto,
1func (l *ListboxWidget) AddItem(index int, items string) {
2 evalErr(fmt.Sprintf("%s insert %d %s", l.fpath, index, items))
3}
Se puede redactar código como el anterior.
Habiendo comprendido el principio de implementación aproximado, comenzaremos explicando las funcionalidades adicionales para Listbox.
Lista: Inserción/Eliminación
1package main
2import . "modernc.org/tk9.0"
3
4func main() {
5 length := 3
6 l := Listbox()
7 l.AddItem(0, "item1 item2 item3")
8 b1 := TButton(Txt("Delete Multiple Items, index (0-1)"), Command( func(){
9 if length >= 2 {
10 l.DeleteItems(0,1)
11 length-=2
12 }
13 }))
14 b2 := TButton(Txt("Delete One Item, index (0)"), Command( func () {
15 if length > 0 {
16 l.DeleteOne(0)
17 length-=1
18 }
19 }))
20 Pack(TExit(),l,b1,b2)
21 App.Wait()
22}
23
En el programa anterior, AddItem inserta ítems distintos separados por espacios, comenzando secuencialmente desde el índice 0. item1, item2 e item3 obtendrán secuencialmente los índices 0, 1 y 2, respectivamente. Investigaremos cómo funciona la eliminación de elementos ejecutando el ejemplo.
Lista: Obtención de Elementos Seleccionados
A continuación, recuperaremos los elementos seleccionados del Listbox y los verificaremos.
1package main
2
3import . "modernc.org/tk9.0"
4
5func main() {
6 l := Listbox()
7 l.SelectMode("multiple")
8 l.AddItem(0, "item1 item2 item3")
9 btn := TButton(Txt("Print Selected"), Command( func() {
10 sel := l.Selected()
11 for _, i := range sel {
12 println(l.GetOne(i))
13 }
14 }))
15
16 Pack(TExit(), l, btn)
17 App.Wait()
18}
El método Selected recupera los índices de todos los elementos actualmente seleccionados en el Listbox. El método GetOne obtiene el valor del elemento correspondiente a dicho índice. Esto se puede constatar mediante el resultado impreso en la consola. Como referencia, el método Get, que es análogo, acepta índices de inicio y fin y recupera los valores de todos los elementos dentro de ese rango.
A continuación, intentaremos modificar los colores del listbox.
Primero, examinemos el siguiente ejemplo.
1package main
2
3import . "modernc.org/tk9.0"
4
5func main() {
6 l := Listbox()
7 l.Background("blue")
8 l.Foreground("yellow")
9 l.SelectBackground("black")
10 l.SelectForeground("white")
11 l.Height(20)
12 l.Width(6)
13 l.AddItem(0, "item1 item2 item3")
14 l.ItemForeground(0,"red")
15 l.ItemBackground(0,"green")
16 l.ItemSelectBackground(0,"white")
17 l.ItemSelectForeground(0,"black")
18 l.Relief("ridged")
19 Pack(TExit(),l)
20 App.Wait()
21}
Tal como se especificó en el código anterior, la altura se ha incrementado. Además, se puede observar que los colores se han aplicado correctamente. Dado que aquí se especificaron opciones para diferenciar el color únicamente en un ítem específico, se aprecia que el color se aplicó de manera distinta solo a la primera línea.
Asimismo, aunque la diferencia no es sustancial, al utilizar el método Relief, se puede seleccionar entre flat, groove, raise, ridge, solid, sunken para modificar el estilo del borde del widget.
Ejemplo de Visor de Imágenes
Ahora, procederemos a construir el visor de imágenes utilizando los widgets aprendidos previamente. El programa de ejemplo es el siguiente.
1package main
2
3import (
4 "fmt"
5 "log"
6 "os"
7 "runtime"
8 "strings"
9 "path"
10
11 . "modernc.org/tk9.0"
12)
13
14var pbuttons []*TButtonWidget
15var extensions []FileType
16var pbutton *TButtonWidget = nil
17var listbox, listbox2 *ListboxWidget
18var cur *LabelWidget = nil
19var imagesLoaded []*LabelWidget
20func PhotoName(fileName string) string {
21 fileName = path.Base(fileName)
22 return fileName[:len(fileName)-len(path.Ext(fileName))]
23}
24
25func handleFileOpen() {
26 res := GetOpenFile(Multiple(true),Filetypes(extensions)) //Activa la selección múltiple y enciende el filtro.
27 s := make([]string,0,1000)
28 for _, itm := range res {
29 if itm != "" {
30 tmp := strings.Split(itm," ")
31 s = append(s,tmp...)
32 }
33 }
34
35 for _, photo := range s {
36 formatCheck := strings.Split(photo, ".")
37 format := formatCheck[len(formatCheck)-1]
38
39 if (strings.Compare(format, "png") == 0) || (strings.Compare(format, "ico") == 0) {
40 picFile, err := os.Open(photo)
41 if err != nil {
42 log.Println("Error while opening photo, error is: ", err)
43 }
44
45 pictureRawData := make([]byte, 10000*10000)
46 picFile.Read(pictureRawData)
47
48 imageLabel := Label(Image(NewPhoto(Data(pictureRawData))))
49 imagesLoaded = append(imagesLoaded,imageLabel)
50 var deleteTestButton *TButtonWidget
51 deleteTestButton = TButton(
52 Txt("Unshow Image"),
53 Command(func() {
54 GridForget(imageLabel.Window)
55 GridForget(deleteTestButton.Window)
56 }))
57
58 pbuttons = append(pbuttons,deleteTestButton)
59
60 listbox.AddItem(len(imagesLoaded)-1,PhotoName(photo))
61 listbox2.AddItem(len(imagesLoaded)-1,PhotoName(photo))
62 picFile.Close()
63 }
64 }
65}
66
67func DeleteSelected () {
68 s:=listbox.Selected()
69 if len(s) == 0 {
70 return
71 }
72 for _, i := range s {
73 listbox.DeleteOne(i)
74 listbox2.DeleteOne(i)
75 if len(imagesLoaded)-1>i {
76 continue
77 }
78 if cur == imagesLoaded[i] {
79 pbutton = nil
80 cur = nil
81 }
82 Destroy(imagesLoaded[i])
83 Destroy(pbuttons[i])
84 imagesLoaded = append(imagesLoaded[:i],imagesLoaded[i+1:]...)
85 pbuttons = append(pbuttons[:i], pbuttons[i+1:]...)
86 }
87}
88
89func SelectImage() {
90 s:=listbox2.Selected()
91 if len(s) == 0 {
92 return
93 }
94
95 if len(imagesLoaded) -1 < s[0] {
96 return
97 }
98 if imagesLoaded[s[0]] == nil {
99 return
100 }
101 if cur != nil {
102 GridForget(cur.Window)
103 }
104 if pbutton != nil {
105 GridForget(pbutton.Window)
106 }
107
108 Grid(imagesLoaded[s[0]], Row(0), Column(2))
109 Grid(pbuttons[s[0]], Row(0), Column(3))
110 cur = imagesLoaded[s[0]]
111 pbutton = pbuttons[s[0]]
112}
113
114func SelectIndex(index int) {
115
116 if len(imagesLoaded) -1 <index {
117 return
118 }
119 if imagesLoaded[index] == nil {
120 return
121 }
122 if cur != nil {
123 GridForget(cur.Window)
124 }
125 if pbutton != nil {
126 GridForget(pbutton.Window)
127 }
128
129 Grid(imagesLoaded[index], Row(0), Column(2))
130 Grid(pbuttons[index], Row(0), Column(3))
131 cur = imagesLoaded[index]
132 pbutton = pbuttons[index]
133}
134
135func main() {
136 menubar := Menu()
137 //DefaultTheme("awdark","themes/awthemes-10.4.0")
138 //Si desea utilizar un tema, especifique el nombre y la ruta del tema.
139 fileMenu := menubar.Menu()
140 extensions = make([]FileType,0,1)
141 extensions = append(extensions, FileType{ "Supported Images", []string {".png",".ico"}, "" } )
142 //Agregamos png e ico al filtro.
143 fileMenu.AddCommand(Lbl("Open..."), Underline(0), Accelerator("Ctrl+O"), Command(func () {
144 handleFileOpen()
145 SelectIndex(len(imagesLoaded)-1)
146 } ))
147 Bind(App, "<Control-o>", Command(func() { fileMenu.Invoke(0) }))
148 fileMenu.AddCommand(Lbl("Exit"), Underline(1), Accelerator("Ctrl+Q"), ExitHandler())
149 Bind(App, "<Control-q>", Command(func() { fileMenu.Invoke(1) }))
150 menubar.AddCascade(Lbl("File"), Underline(0), Mnu(fileMenu))
151 imagesLoaded = make([]*LabelWidget, 0, 10000)
152 pbuttons = make([]*TButtonWidget,0,10000)
153 var scrollx, scroll, scroll2, scrollx2 *TScrollbarWidget
154 listbox = Listbox(Yscrollcommand(func(e *Event) { e.ScrollSet(scroll)}) , Xscrollcommand( func(e *Event) { e.ScrollSet(scrollx)}))
155 listbox2 = Listbox(Yscrollcommand(func(e *Event) { e.ScrollSet(scroll2)}), Xscrollcommand(func(e *Event) { e.ScrollSet(scrollx2)}))
156 listbox.SelectMode("multiple")
157 listbox2 = Listbox()
158 listbox.Background("white")
159 listbox.SelectBackground("blue")
160 listbox.SelectForeground("yellow")
161 listbox2.Background("grey")
162 listbox2.SelectBackground("green")
163 listbox2.SelectForeground("blue")
164 listbox2.SelectBackground("brown")
165 listbox.Height(5)
166 listbox.Width(4)
167 listbox2.Height(5)
168 listbox2.Width(4)
169 delBtn := Button(Txt("Delete"), Command(func () { DeleteSelected() }))
170 selBtn := Button(Txt("Select"), Command(func () { SelectImage() }))
171 scroll = TScrollbar(Command(func(e *Event) { e.Yview(listbox) }))
172 scrollx = TScrollbar(Orient("horizontal"),Command(func(e *Event) { e.Xview(listbox) }))
173 scroll2 = TScrollbar(Command(func(e *Event) { e.Yview(listbox2) }))
174 scrollx2 = TScrollbar(Orient("horizontal"),Command(func(e *Event) { e.Xview(listbox2) }))
175 Grid(listbox,Row(1),Column(0), Sticky("nes"))
176 Grid(scroll,Row(1),Column(1), Sticky("nes"))
177 Grid(scrollx,Row(2),Column(0), Sticky("nes"))
178 Grid(delBtn,Row(3),Column(0), Sticky("nes"))
179 Grid(listbox2,Row(1),Column(2), Sticky("nes"))
180 Grid(scroll2,Row(1),Column(3), Sticky("nes"))
181 Grid(scrollx2,Row(2),Column(2), Sticky("nes"))
182 Grid(selBtn,Row(3),Column(2), Sticky("nes"))
183 App.WmTitle(fmt.Sprintf("%s on %s", App.WmTitle(""), runtime.GOOS))
184 App.Configure(Mnu(menubar), Width("80c"), Height("60c")).Wait()
185}
En este ejemplo, para simplificar la implementación, todos los widgets de imagen se crean por adelantado al cargar, y no se verifica la duplicación de archivos. Se puede practicar mejorando los problemas mencionados anteriormente, o se puede intentar cambiar el tema utilizando el método DefaultTheme que está comentado. Se recomienda practicar creando un nuevo programa que mejore estos aspectos.
Conclusión
En esta publicación, hemos examinado cómo opera la invocación de comandos de la librería Tcl/Tk del lenguaje Go, y hemos construido un visor de imágenes al que se le ha añadido un listbox.
- Mecanismo de invocación de comandos de la librería Tcl/Tk
- Método de uso de listbox
- Modificación de atributos del widget listbox
- Creación del visor de imágenes
Siguiendo este método, le animamos a intentar modificar otras librerías y a crear programas completos utilizando las funcionalidades añadidas.