INTERFAZ GRAFICA VISUAL BASIC - Diseño

Blogger: Pablo José Pastor Solórzano

Fecha: 25 de Abril del 2018

Titulo: INTERFAZ GRAFICA VISUAL BASIC

Recuperado de: Ninguno.

La Introducción a la programación de interfaces gráficas de usuario es uno de los primeros temas que deben ser memorizados o por lo menos comprendidos para saber cual es el rumbo que tomara la materia de Programación Visual. Para diseñar un programa se necesita tener un conocimiento básico, intermedio o avanzado (dependiendo de la complejidad del proyecto) en programación, sin embargo cuando se realizan interfaces gráficas también se debe tener un conocimiento amplio de que herramientas podemos utilizar o vincular con nuestra programación para obtener el resultado deseado.

Un ejemplo de esto es que tu como usuario estas leyendo este articulo y lo haces a través de una computadora, teléfono o tableta, la información de este articulo esta ordenada gracias al lenguaje Java, HTML, etc, que se utiliza en el articulo y después es interpretado por el navegador, este lenguaje no se te muestra tal como es sin embargo el resultado que si puedes observar es un articulo en el que puedes dejar un comentario o realizar otras acciones sin tener que escribir ninguna linea de programación, básicamente esto es una interfaz gráfica.

Nota 1: Este articulo se basa en el programa visual studio (Visual Basic 2014), por lo cual todas las referencias e imágenes son de dicho software.

Nota 2: Este articulo es solo una breve introducción de las herramientas con la que contaremos para desarrollar y diseñar las interfaces gráficas de nuestros programas, tal y como el plan de estudios (en el que nos basamos) indica en futuros temas se hablara de cada una de las herramientas a detalle.

Conceptos Básicos y herramientas para la creación de una Interfaz gráfica

Interfaz gráfica: Se le puede considerar a esta como la cara de un programa informático, esta primera vista puede estar conformada de un conjunto de imágenes, cuadros de texto, botones, etc, que tengan por objetivo entregar o adquirir algún tipo de información, la interfaz gráfica es donde el usuario final podrá realiza todas las acciones que estén disponibles en el programa. En visual basic 6.0 se le llamaba ventana del formulario

Ventanas: La ventanas de inicio son también conocidas como las pantallas de trabajo, ya que estas poseen el cuerpo de un programa pero solo cuentan con 3 funciones predefinidas (Cerrar, minimizar y maximizar), el resto de la ventana es un lienzo esperando para ser diseñado. También existen las ventanas que únicamente muestran un mensaje o instrucción. No hay que confundir el termino ventana con el termino pestaña (ya que la pestaña en visual basic es como se llama a la ventana de trabajo que estemos editando, diseñando o programando).

Visual Studio primer proyecto – Ventanas

Objetos y Herramientas: Estos son el conjunto de todos los objetos y herramientas que el programa que se este utilizando para diseñar la interfaz posea. Las herramientas más conocidas de Visual Basic son los: Labels, Button, TextBox, ListBox, Etc. Para conocer más herramientas de Visual Basic te recomendamos leer este articulo: https://ingenieriaelectronica.org/conceptos-basicos-de-visual-basic-6-0/.

Una herramienta es la opción que te permite añadir uno o varios objeto en el área de trabajo de la ventana gráfica, cada objeto es único ya que al crearse adquiere propiedades como su forma, tamaño, nombre, tipo de letra, etc.

Anuncio

Propiedades de los objetos: Como se menciona en el párrafo anterior, cuando se crea un objeto también se crean sus propiedades, estas pueden editarse con mucha facilidad y son un factor muy importante para el objeto ya que básicamente le proporcionan su identidad ante nuestro programa, un objeto posee un nombre predefinido el cual puede ser cambiado por el diseñador, sin embargo se debe tener mucho cuidado ya que este nombre es como se le conocerá a nuestro objeto, cuando la programación necesite a este objeto lo llamara por su nombre y si no esta o fue modificado obtendremos un error de programación.

Las propiedades de los objetos en visual studio se hacen presentes en la parte inferior derecha del programa al dar un clic sobre el objeto que queramos editar, en el caso de la siguiente imagen utilizamos la herramienta PictureBox para crear un objeto en donde se puede ingresar una imagen, tras crear el objeto basta con ir a las propiedades del objeto, nos dirigimos a la propiedad “Image” y buscamos la imagen que queramos colocar, tras esto se pueden editar las propiedades de esa imagen como el tamaño, la posición el nombre, etc.

Visual Studio PictureBox

Programación tras los objetos:  Los objetos que agreguemos a la ventana de trabajo son parte del diseño del programa, tras cada objeto existe un bloque de programación o instrucciones, en visual studio se agrega el cuerpo base inicial y final de la programación para ahorrarle esa parte al usuario.

En el caso de la imagen que se puede ver a continuación es el bloque de instrucciones de un objeto nombrado en automático como Button1 (botón 1), debido a que es un botón a este se le puede dar un clic para que realice la acción que la programación le indique, sin embargo este clic hecho al botón o más bien la acción de hacer clic se llama Evento.

Visual Basic Bloque de programación o instrucciones

Eventos: Los eventos son las acciones que requiere un objeto para desempeñar su programación asignada, por ejemplo si tenemos un botón que pide el resultado en una operación, osea un “=” nosotros podemos darle clic y la programación realizara la operación matemática asignada y entregara el resultado en donde nosotros hallamos indicado, este evento por redundante que parezca lleva por nombre Click, existen muchos más eventos los cuales van desde pasar el puntero por un objeto, hasta dejar el puntero una cierta cantidad de tiempo para que se ejecute el programa.

Actualmente en Visual Studio hay más de 50 eventos diferentes, cada uno esta pensado para desarrollar una tarea determinada y en posteriores temas y proyectos abordaremos uno por uno para que todo quede claro.