Cómo añadir un botón diseñado con Inkscape en un programa de Visual Basic

En este tutorial vamos a explicar como poner un botón diseñado con inkscape en un programa de Visual Basic. Para ello, tomaremos como base un programa muy sencillo realizado con este mismo programa:

 

El programa realiza lo siguiente: Cuando haces clic en el botón “nombre”, sale “Helena” en el textbox superior. Al darle a reiniciar, se borra el contenido del mismo.

Nosotros, vamos a diseñar un botón que al pulsarlo realice la función de “NOMBRE” y además, cambie algo su aspecto para que el usuario se de cuenta de que ya ha sido seleccionado. Comenzamos pues, diseñando en Inkscape dos botones, uno para cuando no haya sido pulsado y otro para cuando si.

Estos son los dos que hemos dibujdado nosotros. La diferencia apreciable entre uno y otro es que el que usaremos cuando ya haya sido seleccionado,tiene una sombra naranja alrededor:

 

Para poder utilizarlos en Visual Basic debemos exportarlos como “mapa de Bits”. Esto se realiza seleccionando  “archivo” en la parte izquierda de la barra de herramientas superior y después“Exportar como mapa de bits”.

A continuación, suprimimos el botón “NOMBRE” de nuestro programa de VisualBasic y lo cambiamos por un picturebox. Después de esto, seleccionamos la propiedad “Image” e importamos nuestros dos botones, dejando de forma visible el sin pulsar.

 

Ahora solo nos queda escribir el código adecuado para que funcione debidamente el programa. Para ello, debemos comenzar  escribiendo en el evento “Click” del picturebox lo que pondríamos si éste fuera un botón, es decir, esribiríamos lo necesario para que al pulsarlo, aparezca nuestro nombre en el textbox. Pero como nosotros queremos que además, se cambie el botón sin pulsar por el pulsado debemos escribir el nombre del picturebox seguido de un punto y la propiedad image, un igual y a continuación “my.resources.” tras esto, el nombre que le hemos puesto al botón que deseamos que aparezca. El código escrito en este evento sería:

  txtnombre.Text = «HELENA»  (Para que aparezca el nombre en el textbox)
picboxboton.Image = My.Resources.NOMBRE2  (Para que se cambie el botón sin pulsar por el pulsado)

Por último, ponemos en el evento “Click” del botón “Reiniciar”, lo necesario para que al pulsarlo, se borre el contenido del textbox y además se cambie el botón pulsado por el sin pulsar, repitiendo el proceso anterior pero a la inversa. El código entonces, sería este:

txtnombre.Text = «»   (Para que se borre el texbox del textbox)
picboxboton.Image = My.Resources.NOMBRE1  (Para que se cambie el botón pulsado por el sin pulsar)

Este es el resultado final, espero que os haya servido de ayuda.