Ayuda Didácti caC o l e g i o d e l S a g r a d o C o r a z ó n

Á r e a : Te c n o l o g í a e I n f o r m á ti c a

Aplicación Tecnológica Visual

Basic

1

Actividad No.1

Actividad No.2

Actividad No.3

Adaptado por Lic. José Torres

Linea de trabajo: Estructura administrativa y empresarial para el manejo de la contabilidad en Visual Basic

Se entiende la comprensión y uso racional de las herramientas tecnológicas e

informáticas para la satisfacción de las necesidades enfrentando las situaciones o cambios que se presentan en el entorno escolar, familiar y social del ser humano.

2

La siguiente actividad tiene como finalidad conocer las diferentes propiedades de los objetos (label, textbox, image, etc), como también agregarle acciones a los eventos.

Actividad No. 1CREANDO UNA VENTANA DE FORMATO

Doble clic

Para iniciar esta actividad sigue los siguientes pasos : 1. Ingresa a Visual Basic 6.0

3

2. Área de trabajo de visual basic, revisar el Entorno de Desarrollo Integrado IDE.

Actividad No. 1CREANDO UNA VENTANA DE FORMATO

Cuadro de Herramientas

Formulario Inicial

Explorador de proyecto

Propiedades de los objetos

4Actividad No. 1CREANDO UNA VENTANA DE FORMATO

Maximizarproyecto

3. Haz clic en el botón maximizar de la ventana de proyecto.

5Actividad No. 1CREANDO UNA VENTANA DE FORMATO

4. Para modificar el formulario tener en cuenta las siguientes propiedades: Caption: FuenteBackcolor: SalmonHeight: 7000Width: 6000

6Actividad No. 1CREANDO UNA VENTANA DE FORMATO

5. Agrega un label en la parte superior del formulario y ten en cuenta lo siguiente y así con las demás herramientas:Label1Alignment: CenterBackstyle: TransparenteCaption: VENTANA DE FORMATOFont: Fuente: Tahoma Estilo: Negrita Tamaño: 18 Forecolor: NegroTooltiptext: Titulo de la ventana

7Actividad No. 1CREANDO UNA VENTANA DE FORMATO

6. Teniendo en cuenta las propiedades que acabas de trabajar aplícaselas a cada una de las herramientas que te estoy señalando, el tamaño y otras propiedades quedan a tu consideración, pero que no se te olvide aplicarles a los objetos las propiedades trabajas en las hojas anteriores.

Todos estos objetos son label, en total son 18

8Actividad No. 1CREANDO UNA VENTANA DE FORMATO

Acabas de terminar la interface gráfica de esta ventana de formato, ahora si prepárate para aplicarle el código y notes lo interactivo que quedó tu trabajo; ejecútala presionando la tecla F5 .

Se hizo clic en fuente Arial Black, luego en color: Rojo y posteriormente en el Tamaño 30, puedes combinar cualquiera de las opciones y deben ir cambiando

Adaptado por el profesor José Torres

COL SAGRADO

2

Antes que nada crea una carpeta en la unidad de nuevo volumen D:\ o E:\,

asígnale un nombre que haga referencia a grado, sección y año, luego busca 10 imágenes concernientes a un tema Ej. Deportes, países, carros, etc, puedes

utilizar Internet, después ubícalas en tu carpeta que te sirvan para el trabajo

siguiente.

3Actividad No.2CREANDO UN ALBUM DE FOTOS SENCILLO

1. Vamos a comenzar preparando el formulario para ello modificamos las

siguientes propiedades

Caption: Album Cambia el titulo del objeto

Height:9450 cambia el alto del objetoWidth: 10000 cambia el ancho del objetoBackcolor: &H0080C0FF& cambia el color

de fondo MinButton: True Activa los botones de

controles de la barra de titulo

4

2. Agrégale un label y configura las siguientes propiedades

Caption: ALBUM DE FOTOS Cambia el titulo del objetoAlignment: CenterBackStyle: Transparent Font: Fuente: ________

Estilo de la fuente: Negrita Tamaño: 28

ForeColor: &H00FF0000&

5

3. Agrega 11 herramientas image observa el formulario para que sepas

como ubicar los objetos.

Cambia las siguientes propiedades de todos objetos image

Stretch: true BorderStyle: 1- fixed single

Nota: Después de haber cambiando las propiedades, colocaremos una imagen en cada cuadro pequeño

(herramienta image), utilizando la propiedad picture, busca una de las imágenes guadadas con anterioridad en tu carpeta y así sucesivamente ,

hasta completar

4. Para ir probando o ejecutando lo que estamos haciendo presiona la

tecla F5.

Bueno haz terminado la Interfaz Gráfica, ahora comenzamos a

ubicar el código que es quien hace interactivo el album

5. Bueno hacemos doble clic en la primera imagen y observe la

interfaz que aparece.

Del lado izquierdo aparece el nombre del objeto en este caso

image1 y en lado derecho aparece el evento en este caso Click, y en la

parte de abajo aparece una subrutina

Private Sub Image1_Click()

End Sub

6

En el espacio en blanco de la subrutina se escribirán todas las acciones que quieren que pasen para este caso lo que haremos

será presionar la imagen para que esta se ubique de tamaño mas

grande en el centro de la ventana.

Nota: Cabe decir que estas acciones ocurren cuando

presionas primero F5 , que quiere decir ejecutar el programa.

Les mostrare con un ejemplo como se hace, ustedes hacen el

resto

Private Sub Image1_Click()Image6 = image1End Sub

7

Adaptado por José Torres, profesor de Informática. Col. Sagrado

2

Para esta actividad crearás una Carpeta llamada imágenes, dentro de la carpeta

creada con anterioridad y donde haz estado guardando todos tus trabajos.

Crearás la siguiente interfaz gráfica, teniendo en cuenta cada uno de los objetos.

3Actividad No.3CREANDO UNA VENTANA DE IDE DE FOTOGRAFIAS

1. Vamos a comenzar preparando el formulario para ello modificamos las

siguientes propiedades

Caption: Ventana IDE Cambia el titulo del objeto

Height:6885 cambia el alto del objetoWidth: 8295 cambia el ancho del objetoPicture: … Agrega una imagen al fondo

4

2. Agrégale 6 label, 27 botón de comando , 3 líneas y según

apariencia 1 image y configura según tu criterio sin perder el

diseño del formulario .

5

3. Tener en cuenta para el código lo siguiente que cuando presione un cuadrito de opción de color este cambie de color el label que aparece en el centro

de la ventana que estamos construyendo y además cuando pase por encima se modifique el tamaño del mismo pero mas

pequeño.

Código:Private Sub Command1_Click()Label3.backcolor = rgb (200,0,0)End Sub

Objeto command y evento click

Private Sub Command1_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Sing) Command1.Height = 300Command1.Width = 300End Sub

Objeto Command y evento mouseMove

6

Continua realizando el resto de comandos para hacer que esta

ventana se vea interactiva.

Continuamos. cuando hagamos click en los botones que son las

opciones de tamaño estas deben cambiar el tamaño de la imagen central (es decir donde se reflejan las imágenes) cada numero indica 100 menos por

disminuir su alto y su ancho comenzando desde el uno.

Código:Private Sub Command10_Click()Image1.Height = 3055Image1.width = 3655End Sub Objeto command y evento click

7

Continua realizando el resto de comandos para hacer que esta

ventana se vea interactiva.

Continuamos. cuando hagamos click en los botones que son las

opciones de imágenes estas deben cambiar la imagen que se

encuentran en el centro de la ventana.

Código:Private Sub Command20_Click()Image1 = image2End Sub Objeto command y evento click

Para ir probando o ejecutando lo que estamos haciendo presiona la tecla F5.

Adaptado por Lic. José Torres