Entrada al curso

 

   

Configuración: Edición, espacio y controles

Práctica 5:

Proceso

Como en el resto de las actividades, donde hay  que cambiar la configuración de alguna escena, debe tenerse abierta la página que se va a modificar tanto con el navegador como con el editor. Al cambiar la configuración de la escena, se puede ver el resultado con el navegador para corregirlo de nuevo o mantenerlo; luego, con el editor, se guardan las modificaciones que nos interese conservar.
  • En primer lugar se abre con el navegador la página escena_6_1.htm en la que está la primera escena del proyecto y sin cerrar la página, se edita el mismo archivo con el editor de páginas html que se esté utilizando. El archivo se debe encontrar en la carpeta Ejercicios de la carpeta del Curso Descartes.

  • Con el editor de páginas html se inserta el título PROYECTO 6 y como subtítulo asociado a la primera escena del proyecto debe figurar Escena 1. El aspecto de la página vista desde el editor es como la mostrada en próxima imagen.

  • También hay que modificar la etiqueta <title> en el código html de la página. Dentro de la etiqueta  debe escribirse Proyecto 6.

El editor de FrontPage Express permite hacer este cambio de dos formas alternativas, o bien modificando en el modo HTML del editor o en modo Normal, desde Propiedades de la página.

  • Comprobar que las imágenes de cabecera y pie de página logo.gif y logo2.gif y el fondo de la página fondo_d.gif se encuentran dentro de la carpeta principal del curso descartes_basico. Sin cerrar aún el editor, abrir el programa explorador de Windows y crear una nueva carpeta dentro de la carpeta Ejercicios que se llamará proyecto_p6_archivos y copiar en ésta las tres imágenes anteriores.

  • Cerrar la ventana del explorador de Windows y volviendo al editor FrontPage Express, modificar las referencias de las imágenes para que inserten las contenidas en la nueva carpeta proyecto_p6_archivos.

  • Se guardan los cambios hechos en la página. En el menú Archivo del editor se selecciona la opción Guardar como... y se pone el nombre proyecto_p6.htm. Obsérvese que al archivo escena_6_1.htm no le han afectado los cambios que se han realizado.

  • Se puede cerrar escena_6_1.htm desde el navegador y abrir el fichero creado recientemente proyecto_p6.htm que, como se ha dicho, es necesario para modificar la escena.

  • Se modifica la Escena 1 como se indica en los sucesivos apartados de configuración.

  • Se actualiza la página proyecto_p6.htm y se procede a insertar a continuación la segunda escena del proyecto:

    • Se escribe el subtítulo Escena 2.

    • Se abre el fichero escena_6_2.htm, se copia el código de la escena y se pega  en proyecto_p6.htm.

    • Se actualiza la página.

  • Se modifica el código desde la opción config  para redimensionar la escena a 500 de ancho (width) y 400 de alto (height).

  • Se modifica la Escena 2 como se indica en los sucesivos apartados de configuración.

  • Se actualiza la página proyecto_p6.htm.

 

Redimensionar

 la escena:

Escena 2

Se pretende agrandar la escena 2 con la dimensión de 500 píxeles de ancho (width) por 400 píxeles de alto (height). Esta modificación hay que realizarla antes que ninguna otra.

Generalmente el que una escena sea de mayor tamaño va a permitir:

  1. Que haya más campo de visualización y por tanto sea menos frecuente el uso de los controles especiales.

  2. Que se puedan colocar mas controles en la región norte y/o sur de la escena.

En el proyecto actual se pretende lo primero.

Una vez insertada la escena 2 en la página proyecto_p6.htm y guardada, se consulta la escena con el navegador de Web y se pulsa el botón config; abrir la ventana de código y escribir el valor que se desee en el campo correspondiente y pulsar el botón aplicar.

Obsérvese que en la ventana de código se puede además modificar el nombre de la escena y el codebase que forman parte del código del applet. El codebase indica al applet donde buscar el archivo Descartes.jar, por lo tanto es esencial para poder ver las escenas. Con frecuencia suele usarse ../ (una carpeta por encima de la actual) como en las páginas escena_6_1.htm y escena_6_2.htm de este curso ó ../../ (dos niveles de carpetas por encima de la actual) como en las unidades didácticas.

En la imagen siguiente se muestran los valores que deben fijarse para la escena 2 del proyecto.

 

Si se utiliza el navegador Internet Explorer, hay que abrir el Código fuente en el menú Ver, seleccionar el correspondiente a esta escena y pegar este código.

Guardar y actualizar la página.


Configuración del Espacio

(Colores): Escena 1

En la Escena 1, después de pulsar el botón config, se selecciona el panel Espacio y en él el botón del color del fondo para elegir negro y se pulsa Aceptar. Para ver el cambio de la escena  sin salir del estado de configuración, pulsa el botón Aplicar.

  Compruébese ahora que la cuadrícula con color actual grisClaro resalta demasiado junto al fondo negro que has puesto. El cambio de color de la red se hace de forma similar al cambio de fondo anterior, sólo hay que tener en cuenta el detalle de que el selector de red tiene que estar activado. Una vez hecho esto, seleccionar el color grisObscuro.

Se activa el selector y se cambia el color de red10  a gris.

Se activar el selector y se cambia el color de ejes a grisClaro.

Se activar y se cambia el color de texto a blanco.


Configuración del

Espacio (Colores):

 Escena 2

En la Escena 2, después de pulsar el botón config, se selecciona el panel Espacio y en él el botón del color del fondo elegir la mezcla 00 de Rojo, 29 de Verde y 00 de Azul; luego pulsar Aceptar. Para ver el cambio de la escena  sin salir del estado de configuración pulsar el botón Aplicar.

Hay que observar: la mezcla de color se puede conseguir, escribiendo directamente la cantidad  hexadecimal en la ventana de valor correspondiente al rojo, verde y azul o alternativamente arrastrando los cursores de color hasta alcanzar el valor deseado, como se muestra en la imagen.

  Hay que desactivar la representación de la red, los ejes e incluso el texto, ya que carece de interés que al hacer clic sobre la escena se vean las coordenadas del punto.

Configuración del Espacio

(Números y ejes): Escena 1

Se trata ahora de indicar que se desea escribir algunos valores de las coordenadas, números, sobre los ejes y también las etiquetas correspondientes a cada eje coordenado.
  • Se marcan los selectores de números, eje-x y eje-y.

  • Se escriben las etiquetas de los ejes: X en eje-x e Y en eje-Y


Configuración del Espacio

(Números y ejes): Escena 2

Hay que desactivar números, eje-x y eje-y. No debe haber nada escrito para las etiquetas de los ejes.

Obsérvese que basta que la ventana ejes esté desactivada  para dejar sin efecto números, eje-x y eje-y.


Configuración del Espacio

(Botones)

En ambas escenas del proyecto se ocultan los botones que no son necesarios, el botón config porque evitará que el alumno se distraiga usándolo y limpiar porque no es funcional aquí.

Para desactivar estos botones, cuando están marcados, basta posicionar el cursor sobre el selector correspondiente y hacer clic;  desaparecen las marcas. Finalmente se pulsar aplicar para que se vean los cambios.

Ventana emergente

Una vez que el botón config no es visible, para poder acceder a la configuración hay que hacer doble clic sobre la escena.

Alternativamente, haciendo clic derecho sobre la escena aparece una ventana con los botones de la escena.


Configuración

de los

controles especiales

 (Escala, Ox y Oy):

 Escena 1

  • En la primera escena se eliminan de la región norte los controles Ox y Oy que sirven para posicionar los ejes de coordenadas. La eliminación de estos controles, en esta escena,  no afectan la posición de los ejes coordenados puesto que por defecto Descartes los coloca en el centro de la escena.

Sólo queda visible en la región norte el control Escala que adopta el nombre externo Ampliar/Reducir.

En primer lugar hacer doble clic para ver la ventana de configuración (recordar que ya no es visible el botón config) y a continuación seleccionar el panel Controles.

Los pasos para eliminar un control se muestran en la siguiente imagen.

  Hay que asignar la siguiente configuración al parámetro Escala en la primera escena.

  Aplíquese los cambios y véase que los límites y el incremento efectivamente funcionan.

Configuración de los

controles especiales

 (Escala, Ox y Oy):

Escena 2

Hay que marcar el panel de control para hacer modificaciones.

Se seleccionan sucesivamente los controles escala, Ox y Oy. En cada selección se modifican los valores del parámetro según se indica en las imágenes siguientes


Configuración de los

controles numéricos:

Escena 1

Hay que observar qué controles numéricos hay en cada escena y añadirlos. Por defecto Descartes asigna unos valores por defecto al control añadido, lo más frecuente es tener que modificarlos como se hace en las siguientes actividades.

Se muestra en las dos imágenes, respectivamente, los pasos para añadir un control numérico y los valores por defecto que Descartes le asigna.

 

En la Escena 1, asigna a la configuración del parámetro m los siguientes valores.

  Para que surta el efecto de cambiar la inclinación de la recta hay que configurar Gráficos. Es decir, la configuración de controles permite definir m y luego se emplea el parámetro m para la definición de la recta de ecuación y=m*x que se dibuja a través de la configuración de gráficos.
  • Se seleccionar el panel de configuración Gráficos.
  • Se modifica la ecuación de la recta poniendo en su lugar y=m*x.
  • Se establece el color rojo para la recta.

La siguiente imagen refleja los pasos de esta configuración.


Configuración de los

controles numéricos:

Escena 2

En esta escena hay que realizar muchos cambios en los controles, se recomienda no aplicarlos hasta que no se hayan hecho todos, pues ver las transformaciones intermedias de la escena puede decepcionar un poco.

Se elimina el control B.

 

Se agrega, para compensar, en el panel de Auxiliares la constante B con valor 90.

  Es importante el orden de los parámetros. En este caso interesa que B esté declarado antes que A puesto que el valor de A depende B. Seleccionar A y ver que A=180-B-C.

En la siguiente imagen se explica como ordenar  B antes que A.

 

3º Se elimina el auxiliar a. Pues se tiene que definir en el siguiente paso el parámetro a como control numérico.

Este proceso es similar al de eliminación del control B anteriormente realizado.

Se agregar el control numérico a (base del triángulo) que sustituirá la función que realiza el control gráfico C.

Obsérvese  que ahora el control C está obligado a desplazarse con C.y constante mientras que la longitud de la base es C.x.

Una vez agregado el control a, hay que configurarlo con los valores que se indican en la imagen.

 Se sustituye la expresión C.x por la expresión equivalente a en los auxiliares b y c.

  6º  Se sustituye en los gráficos la expresión C.x por la expresión a equivalente.

Hay que observar que los objetos gráficos donde interviene la expresión C.x son los tres lados del triángulo, representados como segmentos y los arcos correspondientes a los ángulos B y C.

Póngase el color turquesa a los segmentos (contrasta mejor con el fondo de la escena que el color azul original).

La primera imagen representa los pasos para reconfigurar el segmento de extremos [0,0] y [a,0] es decir el lado a del triángulo.

  Hay que modificar la configuración de los restantes objetos gráficos para obtener los resultados que se muestran en las imágenes sucesivas.

Solo queda ya para terminar:

  • Que se vea el control numérico a  a la izquierda del control C  en la región sur de la escena; para lo cual hay que desplazar el control a por encima del control C en la lista de controles. El procedimiento es seleccionar el control a en la lista y pulsar el pulsador azul hasta colocarlo por encima de C.
  • Finalmente hay que modificar el control C con los valores que se muestran a continuación.


Configuración de los

 controles Gráficos:

 Escena 1

En la Escena 1 hay que hacer visible un control gráfico obligado a moverse sobre la recta de ecuación y=m*x.
  • Actívese el panel de configuración Controles.
  • Selecciónese el tipo de control Gráfico.
  • Póngase nombre al control P.

Las siguiente  imagen refleja los pasos para hacer posible todo lo anterior.

 

Luego se establecen los siguientes valores de configuración del control gráfico P: pos, color de contorno del control (blanco), tamaño, constricción y texto (el orden en que se haga no es relevante).

  Hay que observar que al agregar el control gráfico P, se agregan automáticamente, los controles numéricos P.x y P.y correspondientes a las coordenadas de posición del control P. Cuando no van a usarse estos controles para otros propósitos, lo mas conveniente es eliminarlos.

Elimínense los controles numéricos P.x y P.y como se hizo anteriormente con los controles especiales Ox y Oy.

Después hay que pulsar el botón de Aceptar para fijar los cambios en la configuración y volver a la escena.

Pruébese la funcionalidad del control gráfico P, haciendo clic sobre el punto y arrastrándolo.


Configuración de los

controles Gráficos:

 Escena 2

La operación sobre controles gráficos se reduce a eliminar el control gráfico C.

El proceso de eliminación es el mismo que se ha seguido para eliminar controles numéricos y parámetros auxiliares.


     
© Ministerio de Educación y Ciencia. Año 2004