modulo educativo visual

44
Área: Educación para el Trabajo Prof.Grover Paucar Reyes - Prof. Araceli Saira Quispe 5to de Secundaria Contenido Temátic o Recursos Evaluación Bibliografía Créditos Presentación Elaboración de Elaboración de Formularios en Formularios en Visual FoxPro Visual FoxPro Evidencia s:

Upload: araceli-saira

Post on 22-Mar-2016

241 views

Category:

Documents


4 download

DESCRIPTION

5to de Secundaria Prof.Grover Paucar Reyes - Prof. Araceli Saira Quispe RecursosRecursos Contenido TemáticoContenidoTemático PresentaciónPresentación EvaluaciónEvaluación CréditosCréditos BibliografíaBibliografía Inicio Inicio Inicio Inicio

TRANSCRIPT

Page 1: Modulo educativo Visual

Área: Educación para el Trabajo Prof.Grover Paucar Reyes - Prof. Araceli Saira Quispe

5to de Secundaria

Contenido Temático

Recursos

Evaluación

Bibliografía

Créditos

Presentación

Elaboración de Elaboración de Formularios en Formularios en Visual FoxProVisual FoxPro

Evidencias:

Page 2: Modulo educativo Visual

Inicio

La programación orientada a objetos brinda los conocimientos necesarios para diseñar y desarrollar aplicaciones con un entorno visual amigable y fácil de utilizar para el usuario.Los lenguajes de programación visual tienden a facilitar la tarea de los programadores, dado que con los primeros lenguajes de programación crear una ventana era tarea de meses de desarrollo y de un equipo de trabajo.Los Formularios son las ventanas que los usuarios utilizan para ingresar o visualizar información. Visual FoxPro presenta un conjunto de herramientas que permiten crear interfaces gráficas de usuario de una manera fácil y sencilla.

Inicio

Page 3: Modulo educativo Visual

Inicio

CONTENIDO TEMATICO:¿Porqué decimos PROGRAMACION ORIENTADA A OBJETOS?Propiedades de un objetoEntorno de Trabajo Creación de Formulario Descripción del Área de Trabajo Descripción de Controles Propiedad de los Controles Programando el BOTON CALCULAR Programando el BOTON NUEVO Programando el BOTON SALIR Ejecución del Formulario Resultado Utilizando el Formulario Primera Aplicación: “Calculando el área de un cuadrado” Solución de la primera Aplicación Solución de la Segunda Aplicación : “Calculando el área de un Trapecio”Creación del formulario utilizando Grupo de opciones Creación de un formulario utilizando cuadros combinados y de lista Aplicando los métodos en los controles del formularioTips que debemos tener en cuenta

Inicio

Page 4: Modulo educativo Visual

Inicio

Los objetos en visual, presentan un interfaz para poder interactuar entre lo interior y exterior. Es por ello que se dice programación orientada a objetos por que "se unen datos y procesos".

Objeto: entidad provista de un conjunto de propiedades o atributos (datos) y de comportamiento o funcionalidad (métodos) los mismos que consecuentemente reaccionan a eventos. Se corresponde con los objetos reales del mundo que nos rodea, o a objetos internos del sistema (del programa). Es una instancia a una clase.

Contenedor

Contendido

El Formulario

Botón de Comando

Sigamos aprendiendo

Page 5: Modulo educativo Visual

Inicio

Método: Algoritmo asociado a un objeto (o a una clase de objetos), cuya ejecución se desencadena tras la recepción de un "mensaje". Desde el punto de vista del comportamiento, es lo que el objeto puede hacer. Un método puede producir un cambio en las propiedades del objeto, o la generación de un "evento" con un nuevo mensaje para otro objeto del sistema.

Evento: Es un suceso en el sistema (tal como una interacción del usuario con la máquina, o un mensaje enviado por un objeto). El sistema maneja el evento enviando el mensaje adecuado al objeto pertinente. También se puede definir como evento, a la reacción que puede desencadenar un objeto, es decir la acción que genera.

Al hacer clic con el mouse se ejecuta el botón aceptar

La primera línea cierra el formulario

La segunda ejecuta el formulario presentación

Pág. Contenido

Page 6: Modulo educativo Visual

Inicio

• Están asociados a un objeto que hace los datos visibles desde fuera del objeto y esto se define como sus características predeterminadas, y cuyo valor puede ser alterado por la ejecución de algún método.

TEXT

VALUE

SETFOCUS

ENABLED

FORECOLOR

BACKSTYLE

FONTNAME BACKCOLOR

PICTURE

NAME

CAPTION

AUTOSIZE

PASSWORDCHARFondo del objeto

Texto del objeto

Valor del objeto

Enfoca a un objeto

Activa o desactiva un objeto

Color del objetoTipo de fuente Color de fondo

Inserta imagen

Referencia del objeto

Texto mostrado

Auto ajuste del objeto

Muestra un símbolo

Pág. Contenido

PROPIEDADES DE UN OBJETO

Page 7: Modulo educativo Visual

Inicio

Entorno de Trabajo

Ventana de Comandos aquí se ingresan las

ordenes

El entorno de trabajo de visual FoxPro es similar al de otros programas, dispone de un menú de opciones y de una barra estándar.

Además se dispone de una ventana donde se ingresan los comandos y las funciones que darán forma al formulario que formará parte del sistema a crear.

Pág. Contenido

Page 8: Modulo educativo Visual

Inicio

Creación del Formulario

Aquí se debe ingresar la orden CREATE FORM

para crear el Formulario y luego se escribe un nombre en este caso

promedios (nombre del formulario)

Pág. Contenido

Page 9: Modulo educativo Visual

Inicio

Descripción del Área de Trabajo

En esta ventana podemos

cambiar las propiedades de

los objetos

Aquí están los controles y los objetos programable

En este formulario podemos

insertar los objetos

Pág. Contenido

Page 10: Modulo educativo Visual

Inicio

Selección objetos

Ver C

lases

Etiqueta

Cuadro de texto

Cuadro de E

dición

Botón de C

omando

Grupo de com

andos

Grupo de O

pciones

Verificación

Cuadro C

ombinado

Cuadro de lista

Control N

umérico

Cuadricula

Imagen

Cronom

etro

Marco de P

agina

Ole control

OleboundC

ontrol

Línea

Forma

Contenedor

Separador

Hipervínculo

Bloqueo del G

enerador

Bloqueo del B

otón

Pág. Contenido

Page 11: Modulo educativo Visual

Inicio

Descripción de los Controles

Este es un cuadro de texto donde se ingresará la

información de las notas del alumno.

Aquí se muestra la propiedad del formulario,

por ello se muestra Form1, si deseamos cambiar la propiedad de los demás

objetos debemos seleccionarlos y luego buscar la propiedad

requerida.

Debemos recordar que los objetos tienen diferente propiedades por ejm: los cuadros

de texto tienen la propiedad NAME y las etiquetas tienen la propiedad CAPTION

Sigamos aprendiendo

Page 12: Modulo educativo Visual

Inicio

Propiedad de los Controles

Con la Propiedad Caption cambiamos los títulos de los

botones de comando

Con la Propiedad Name cambiamos los nombre de las

variables

Con la Propiedad Caption cambiamos los títulos de las

etiquetas.

Pág. Contenido

Page 13: Modulo educativo Visual

Programando el Botón Calcular1 Para programar el botón calcular

debemos hacer doble clic sobre él y a continuación aparece la siguiente

ventana donde se muestra el objeto cmdguardar (nombre asignado con

NAME) y el procedimiento Click que es la acción que lo ejecutará.

2. Luego en esta ventana se deben ingresar las siguientes sentencias donde: n1 es una

variable que va a contener la primera nota que se ingrese en el cuadro de texto txtn1. cuando nos referimos a un cuadro de texto debemos

colocar los 3 parámetros THISFORM.TXTN1.TEXT y así continuar con las demás variables n2,n3 y n4. Seguidamente se

calcula el promedio usando paréntesis y la función VAL que convierte los cuadros de texto en números para poder operarlos. Finalmente se muestra la respuesta en el

cuadro de texto TxtProm usando el comando Thisform y la función Value que muestra el resultado y la función STR que convierte el

valor numérico en carácter para ser visualizado en el formulario.

Pág. Contenido

Page 14: Modulo educativo Visual

Inicio

Programando el Botón Nuevo1 Para programar el botón nuevo

debemos hacer doble clic sobre él y a continuación aparece la siguiente

ventana donde se muestra el objeto cmdnuevo (nombre asignado con

NAME) y el procedimiento Click que es la acción que lo ejecutará.

2. Luego en esta ventana se deben ingresar las siguientes sentencias

thisform.txt.value=“ “ Para que todos los cuadros de texto se muestren en

blanco y asi podamos ingresar los valores de ingreso se usa la sentencia

thisform, luego el objeto Txtn1 y luego el valor a mostrar que será

igual a espacios en blanco.

Pág. Contenido

Page 15: Modulo educativo Visual

Programando el Botón Salir

Finalmente para salir del formulario debemos

programar el botón Salir y para eso hacemos doble click en ese botón y luego ingresamos la sentencia

THISFORM.RELEASE

Pág. Contenido

Page 16: Modulo educativo Visual

Inicio

Ejecución del Formulario

DO FORM promedio

Para ejecutar el formulario se puede hacer click en este icono y

así poder pasar al modo de ejecución.

También se puede ingresa la siguiente orden DO FORM

promedios en la Ventana de comandos, donde promedios es nombre que dio para su creación en parte inicial de este proyecto.

Pág. Contenido

Page 17: Modulo educativo Visual

Formulario en tiempo de Ejecución ( RESULTADO)

Luego de ingresar los datos en los cuadros de texto presionamos el

botón calcular y en cuadro de texto correspondiente al Promedio se

mostrará el promedio en este caso será 18.

Ahora si queremos calcular el promedio de otros estudiantes,

entonces debemos hacer click en el botón Nuevo

Pág. Contenido

Page 18: Modulo educativo Visual

Inicio

Utilizando el Formulario Presionando el Botón Nuevo se

podrá ingresar nuevos datos para calcular otro promedio, si luego

de terminar nuestro trabajo queremos salir entonces

podemos presionar el botón salir ya programado

Nota importante: no debe olvidar guardar el formulario en una carpeta y recuerde que cada formulario da como origen dos archivos con el mismo nombre pero con diferente extensión. .SCX y otro . SCT

Pág. Contenido

Page 19: Modulo educativo Visual

Aplicación en Matemáticas• Ahora que Ud. Ya

conoce el uso de los formularios le proponemos el desafío de crear una aplicación en visual FoxPro donde se ingrese el lado de un cuadrado o rectángulo y se debe obtener el área de la figura.

Realizar el ejercicio con el modelo de formulario mostrado

Práctica Calificada

Pág. Contenido Sigamos aprendiendo

Page 20: Modulo educativo Visual

Inicio

Solución de la PracticaCalculando el Área de un cuadrado

Para el siguiente diseño se usarán 4 etiquetas, 3 cuadros de texto y 3 botones de comando.

A continuación Ud. Debe escribir las sentencias de cada botón según se indica.

l1=thisform.txtl1.textl2=thisform.txtl2.textarea=val(l1)*val(l2)thisform.txtarea.value=str(area)

thisform.txtl1.value=“”thisform.txtl2.vaue=“”thisform.txtarea.value=“”

Thisform.release

Ejecutándolo

Page 21: Modulo educativo Visual

Formulario en Ejecución

Luego de ingresar los lados hacemos clic en Calcular y se mostrará el área de la figura

Pág. Contenido

Page 22: Modulo educativo Visual

Inicio

Problema Propuesto• Ahora el desafío será realizar un Formulario

donde se ingrese las bases y la altura de un trapecio y el programa nos dará como respuesta el área de la misma.

Observa el Resultado

Pág. Contenido

Page 23: Modulo educativo Visual

Diseño del FormularioPara el siguiente diseño se usarán 2 etiquetas, 4 cuadros de texto , 1 imagen y 3 botones de comando. Para la imagen debes usar el control que dice imagen y luego buscar la propiedad picture y darle la ubicación del grafico y listo.

A continuación Ud. Debe escribir las sentencias de cada botón según se indica.

bmenor=thisform.txtbmenor.textbmayor=thisform.txtbmayor.texth=thisform.txtaltura.textarea=((val(bmayor)+val(bmenor))*val(h))/2thisform.txtarea.value=str(area))

thisform.txtbmenor.value=""thisform.txtbmayor.value=""thisform.txtaltura.value=""thisform.txtarea.value=""thisform.txtbmenor.setfocus

Pág. Contenido

Page 24: Modulo educativo Visual

Inicio

Ejecución del formulario

Finalmente debe ingresar los datos de la figura y luego haga clic en Calcular y se mostrará el área de la figura

Pág. Contenido

Page 25: Modulo educativo Visual

Inicio

El desafio del siguiente formulario será la creación de una proforma, donde se selecciona un producto que tiene un precio asignado (estos datos estarán en el Grupo de opciones), luego se ingresa la cantidad y se calcula el importe, el descuento que será según la cantidad que compre, y para ello se fijo la siguiente escala:

Hasta 3 productos, se da el 5% de descuento

Hasta 6 producto se da el 8% de descuento

Y de 7 productos en adelante se le dará el 10% de descuento

Se debe calcular el importe que es producto de la cantidad por el precio y es a este producto que se resta el descuento, obteniendo el Subtotal para luego sacar el IGV que el 19% del subtotal.

Finalmente se de calcular el Total a pagar de la resta de subtotal menos el IGV.

Enunciado del formulario

Pág. Contenido

Sigamos aprendiendo

Page 26: Modulo educativo Visual

Inicio

Diseñando el formulario

Grupo de opcionesBotones de

comando

CuadrosDe

Texto

Para usar un grupo de opciones debemos indicar el numero de

opciones con la propiedad button count, en este caso será 5, y luego podrá cambiar sus nombres con la propiedad Caption a cada opción y luego agregarle el precio de cada

productoSigamos aprendiendo

Page 27: Modulo educativo Visual

Inicio

Colocando los nombres a las opciones

Para señalar las opciones podemos ir a la ventana de

propiedades colocar su nombre y luego asignarle

su variable correspondiente con la propiedad NAME Sigamos aprendiendo

Page 28: Modulo educativo Visual

Inicio

Programando el grupo de opciones

Aquí se define el precio y luego con la propiedad VALUE se

puede asignar dicho precio a la opción del Grupo.

Luego puede seguir de esta forma con las demás opciones

Sigamos aprendiendo

Page 29: Modulo educativo Visual

Inicio

Programando el Botón calcular

Primero asignamos las variables A los cuadros de texto de precio y cantidad

Luego operamos usando la función VALPara convertirlos a número.

Y para calcular el descuento debemos usar La estructura IF donde la condición será

Cantidad.

Finalmente se obtendrá Subtotal, el IGV y elTotal a pagar.

Sigamos aprendiendo

Page 30: Modulo educativo Visual

Inicio

Ejecución del Formulario

Este seria el formulario en ejecución, aquíSe muestran nuevos elementos como las

Imágenes de los botones, lo hacemos con La propiedad Picture de cada botón.

Y para darle fondo lo hacemos también con la Propiedad del formulario (estas imágenes deben estar guardadas

En la carpeta donde están los formularios)

Este marco esEl objeto formaY esta con la

PropiedadSpecial Efect 3D

Sigamos aprendiendo

Page 31: Modulo educativo Visual

Inicio

Resultados del Formulario

Finalmente se muestra la siguiente

pantalla con el formulario, los datos

ingresados y las respuestas que entrega con los

cálculos deseados

Las respuestas están protegidas con la propiedad ENABLED= .F. que se da en el cuadro de texto,

para que el usuario no cambie los resultados

Pág. Contenido

Page 32: Modulo educativo Visual

Inicio

En una estación de Servicios de combustible se desea facturar el consumos deLos usuarios y para ello se desarrolla un formulario donde se tiene un cuadroCombinado con los nombre de los combustibles el cual apuntará a los cuadrosDe texto respectivo donde se mostrará el tipo de combustible y su precio.El nombre del cliente y la cantidad de galones se ingresará en los cuadros de Texto adecuados.

Seguidamente los valores de los cuadros de texto, combustible, precio y cantidadSe pararan a las listas donde se calculará el Subtotal cuando se haga clic enEl botón Aceptar y con ello se obtendrá el Total a Pagar.Se debe recordar que para almacenar los datos de los combustibles se debenCrear listas o arreglos.

Enunciado del formulario

Sigamos aprendiendo

Page 33: Modulo educativo Visual

Inicio

Cuadro combinado Cuadro de texto

Cuadro de Lista

Botón de comando

Pág. Contenido

Sigamos aprendiendo

Page 34: Modulo educativo Visual

Inicio

Esta programación se realiza en el formulario en el evento Init

Aquí se deben crear 2 listasPara guardar los datos.Las listas son :combustible y costoAmbas son publicas y su dimensiónEs de 6 elementos

Si el dato es carácter se String.

Y si el dato unas es un número se usa

Integer

Sigamos aprendiendo

Page 35: Modulo educativo Visual

Inicio

APLICANDO LOS MÉTODOS EN EL CUADRO COMBINADO

Esta codificación corresponde al cuadro combinadoY allí se direccionan los valores a los cuadros de textoDonde la propiedad ListIndex le dará la posición de cadaElemento de la lista creada anteriormente

Sigamos aprendiendo

Page 36: Modulo educativo Visual

Inicio

APLICANDO LOS MÉTODOS EN EL BOTÓN DE COMANDO ACEPTAR

Sigamos aprendiendo

Page 37: Modulo educativo Visual

Inicio

FORMULARIO EN EJECUCIÓN CON RESULTADOS

En el cuadro combinado

seleccionamos el tipo de

combustible

Aquí se ingresa el cliente o razón

social

La cantidad de galones se

ingresa

Estas lista contendrán los valores de los cuadro de

texto combustible, cantidad y precio

Este botón activa las listas y cálcula el total a

pagar

Es botón borra el contenido de los cuadro de texto y

cuadro combinado

Pág. Contenido

Ver video de ejecución

Page 38: Modulo educativo Visual

Inicio

• Recuerde que debe crear una carpeta para guardar tu información y en ese lugar almacenar los formularios, las imágenes, y las bases de datos.

• Diseñe el formulario y realice una prueba en cada avance para estar seguro de

OBSERVEMOS EL VIDEO

Pág. Contenido

Page 39: Modulo educativo Visual

Inicio

RECURSOS:Rompecabezas 01(Jclic)Rompecabezas 02 (Ardora)Ahorcado ( Ardora)Sopa de letras 01Sopa de letras 02Mapa Conceptual (Vue)Mapa mentalVideo1 “Elaborando un formularios”Video2 “Aplicación Real”

Page 40: Modulo educativo Visual

Inicio

Visual FoxPro

Calculando el Área de un cuadrado o rectángulo

Dar respuesta a los siguientes ítems: (WebQuestion)

Page 41: Modulo educativo Visual

Inicio

Page 42: Modulo educativo Visual

Inicio

Evidencias:Video

fotografías

Page 43: Modulo educativo Visual

Inicio

Page 44: Modulo educativo Visual

Inicio