Muestra las diferencias entre dos versiones de la página.
Ambos lados, revisión anterior Revisión previa Próxima revisión | Revisión previa | ||
frames [2011/12/04 13:48] al-khwarizmi |
frames [2013/07/21 12:19] (actual) al-khwarizmi |


---|---|---|---|
Línea 1: | Línea 1: | ||
===Utilidad de los frames=== | ===Utilidad de los frames=== | ||
- | Los frames son áreas de tamaño fijo que se pueden añadir a la ventana de juego para mostrar imágenes. Los frames se pueden añadir o quitar de la ventana dinámicamente, además de ir cambiando la imagen que muestran en cada momento. Esto permite, por ejemplo, implementar el clásico interfaz que muestra una imagen de la habitación en la que se encuentra el jugador en la parte superior de la ventana y el texto de la descripción debajo, entre otras funcionalidades. | + | Los frames son áreas de tamaño fijo o variable que se pueden añadir a la ventana de juego para mostrar imágenes. Los frames se pueden añadir o quitar de la ventana dinámicamente, además de ir cambiando la imagen que muestran en cada momento. Esto permite, por ejemplo, implementar el clásico interfaz que muestra una imagen de la habitación en la que se encuentra el jugador en la parte superior de la ventana y el texto de la descripción debajo, entre otras funcionalidades. |
- | === Métodos para crear y borrar frames === | + | Los siguientes métodos para crear y borrar frames se pueden ejecutar sobre un objeto de la clase ''MultimediaInputOutputClient'': ((el método ''getClient()'' de la clase ''Player'' nos devuelve una instancia de ''MultimediaInputOutputClient'' cuando el jugador esté utilizando un cliente de juego con soporte multimedia, como lo es el interfaz de ventanas de Aetheria Game Engine. Nótese que otros clientes, como el de línea de comandos cheapAGE, pueden no soportar multimedia y por lo tanto no permitir el uso de frames. Hay más información sobre esto (incluyendo cómo se comprueba si un cliente soporta multimedia) en la sección sobre [[imágenes]].)) |
- | Los siguientes métodos se pueden ejecutar sobre un objeto de la clase ''MultimediaInputOutputClient'': ((el método ''getIO()'' de la clase ''Player'' nos devuelve una instancia de ''MultimediaInputOutputClient'' cuando el jugador esté utilizando un cliente de juego con soporte multimedia, como lo es el interfaz de ventanas de Aetheria Game Engine. Nótese que otros clientes, como el de línea de comandos cheapAGE, pueden no soportar multimedia y por lo tanto no permitir el uso de frames. Hay más información sobre esto (incluyendo cómo se comprueba si un cliente soporta multimedia) en la sección sobre [[imágenes]].)) | + | === Métodos para crear frames === |
- | * addFrame ( int position , int size ): crea un marco en la posición dada, y del tamaño en pixels dado. | + | El método más sencillo para crear frames permite añadir, de forma sencilla, un frame con un tamaño fijo expresado en pixels: |
- | * La posición puede ser ImageConstants.TOP (arriba), ImageConstants.BOTTOM (abajo), ImageConstants.LEFT (izquierda) o ImageConstants.RIGHT (derecha). | + | |
- | * El tamaño se refiere al alto si el frame se crea arriba o abajo, o al ancho si se crea a la derecha o a la izquierda (la otra dimensión variará según el tamaño de la ventana de AGE). | + | <code java>/*clase InputOutputClient*/ void addFrame ( int position , int size )</code> |
- | * Puede haber varios marcos a la vez, aunque de momento sólo uno por posición (o sea, por ejemplo, no puede haber dos marcos encima del texto a la vez). | + | Este método crea un marco en la posición dada, y del tamaño en pixels dado. |
- | * removeFrames (): quita todos los marcos que se hayan creado. Esto es útil si una aventura tiene partes que muestran imágenes y otras que no. Más tarde se pueden volver a crear los marcos con addFrame(). | + | * La posición puede ser ImageConstants.TOP (arriba), ImageConstants.BOTTOM (abajo), ImageConstants.LEFT (izquierda) o ImageConstants.RIGHT (derecha). |
+ | * El tamaño se refiere al alto si el frame se crea arriba o abajo, o al ancho si se crea a la derecha o a la izquierda (la otra dimensión variará según el tamaño de la ventana de AGE). | ||
+ | * Puede haber varios marcos a la vez, pero este método sólo permite tener uno por posición (o sea, por ejemplo, no puede haber dos marcos encima del texto a la vez). | ||
+ | |||
+ | Si queremos tener más flexibilidad, incluyendo la posibilidad de crear un número arbitrario de frames y de utilizar tamaños relativos (porcentajes, por ejemplo) en lugar de absolutos, tendremos que usar este otro método, más potente aunque más complicado de utilizar. Este método sólo está disponible a partir de la versión 1.3.2 de AGE: | ||
+ | |||
+ | <code java>/*clase InputOutputClient*/ void addFrame ( String frameName , String frameSpecs )</code> | ||
+ | Este método crea un marco asignándole el nombre 'frameName'. La cadena 'frameSpecs' se usa para dar instrucciones a AGE sobre el tamaño del frame, su localización, si su tamaño es estático o puede modificarse al cambiar el tamaño de la ventana, etc. | ||
+ | |||
+ | Algunos ejemplos de lo que podemos poner en la cadena 'frameSpecs': | ||
+ | |||
+ | * "east, width 200": frame situado a la derecha (este), con ancho preferido 200 pixels - esto quiere decir que el frame intentará tener 200 pixels de ancho, pero "competirá" con el resto de elementos de la ventana, así que su tamaño real puede depender del tamaño de la ventana. | ||
+ | * "west, width 200!": frame situado a la izquierda, con ancho fijo 200 pixels. El signo de admiración indica que el tamaño es fijo. | ||
+ | * "east, width 100:200:400": frame situado a la derecha que tendrá una anchura que variará entre 100 y 400 pixels (dependiendo de cómo redimensione la ventana el usuario), siendo 200 pixels el valor preferido. | ||
+ | * "west, width 50%": frame situado a la izquierda, con ancho preferido del 50% relativo al tamaño de la ventana. De nuevo, competirá con el resto de elementos. | ||
+ | * "north, height 50%!": frame situado arriba, que tendrá siempre la altura de la mitad de la ventana. | ||
+ | * "south, height max(300,30%)!": frame situado abajo, cuya altura será el máximo entre 300 pixels y el 30% de la altura de la ventana. | ||
+ | |||
+ | Aunque estos ejemplos deberían cubrir todos los casos típicos que se podrían necesitar en aventuras en AGE, las cadenas de especificación todavía tienen más funcionalidad que no se muestra aquí. Para más detalles avanzados sobre cómo podemos configurar el tamaño de los frames creados con este método, conviene saber que utiliza la librería [[http://www.miglayout.com|MigLayout]]. Las cadenas que podemos utilizar aquí aparecen especificadas en la documentación de dicha librería, véase la sección "Component Constraints" de la [[http://migcalendar.com/miglayout/cheatsheet.html|MigLayout cheat sheet]]. | ||
+ | |||
+ | Por último, a veces puede convenir dividir un frame en dos partes, por ejemplo para tener un sub-frame arriba a la izquierda y otro arriba a la derecha. Esto se hace con el siguiente método, también disponible sólo desde la versión 1.3.2 de AGE: | ||
+ | |||
+ | <code java>/*clase InputOutputClient*/ void splitFrame ( String parentName , String childName1 , String childSpecs1 , String childName2 , String childSpecs2 )</code> | ||
+ | Este método toma el frame cuyo nombre es 'parentName' (que tiene que haber sido creado mediante el método anterior, que asigna nombre a los frames) y lo divide en dos sub-frames, el primero con nombre 'childName1' y el segundo con nombre 'childName2'. Los parámetros 'childSpecs1' y 'childSpecs2' dan información a AGE sobre el tamaño y localización de los frames hijos, teniendo el mismo formato que el parámetro 'frameSpecs' del método anterior. | ||
+ | |||
+ | Así, podríamos usar el siguiente código para tener un frame superior izquierdo y otro superior derecho, del mismo tamaño, y cada uno con una imagen escalada al tamaño del frame: | ||
+ | |||
+ | <code java> | ||
+ | InputOutputClient cliente = jugador.getClient(); | ||
+ | if ( cliente instanceof MultimediaInputOutputClient && cliente.isGraphicsEnabled() ) | ||
+ | { | ||
+ | cliente.addFrame ( "izquierdo" , "west, height 25%!" ) | ||
+ | cliente.splitFrame ( "izquierdo" , "izarriba", "north, height 50%!", "izabajo", "south, height 50%!" ) | ||
+ | cliente.useImage( world.getResource("imagensuperiorizquierda.png") , ImageConstants.FRAME , "izarriba" , ImageConstants.FIT_BOTH ) | ||
+ | cliente.useImage( world.getResource("imageninferiorizquierda.png") , ImageConstants.FRAME , "izabajo" , ImageConstants.FIT_BOTH ) | ||
+ | } | ||
+ | </code> | ||
+ | |||
+ | === Método para borrar frames === | ||
+ | |||
+ | <code java>/*clase InputOutputClient*/ void removeFrames ()</code> | ||
+ | Este método quita todos los marcos que se hayan creado. Esto es útil si una aventura tiene partes que muestran imágenes y otras que no. Más tarde se pueden volver a crear los marcos con los métodos addFrame(). | ||
=== Métodos para mostrar imágenes en frames === | === Métodos para mostrar imágenes en frames === | ||
Para mostrar una imagen en un frame, puede utilizarse el método useImage especificando como modo de mostrado ImageConstants.FRAME, tal y como se muestra en la sección [[Imágenes]]. | Para mostrar una imagen en un frame, puede utilizarse el método useImage especificando como modo de mostrado ImageConstants.FRAME, tal y como se muestra en la sección [[Imágenes]]. | ||
+ | |||
+ | === Manipulación avanzada de frames === | ||
+ | |||
+ | Solamente si eres un programador avanzado de Java y quieres ir más allá de mostrar imágenes en los frames, podrían interesarte estos métodos: | ||
+ | |||
+ | <code java>/*clase InputOutputClient*/ JPanel getFrame ( int position )</code> | ||
+ | <code java>/*clase InputOutputClient*/ JPanel getFrame ( String name )</code> | ||
+ | Estos métodos devuelven el panel que se utiliza internamente para representar el frame, dada la posición (ImageConstants.TOP, etc.) en el primer caso, o el nombre del frame en el segundo caso, utilizándose un método u otro según si hemos dado o no nombre al frame. Pueden ser utilizados por programadores que conozcan la API de Swing y que quieran dibujar directamente sobre él. Por supuesto, no hacen falta estos métodos para mostrar imágenes en frames, basta con los anteriores, que serán los que interesen a la gran mayoría de usuarios. | ||
=== Ejemplos de código === | === Ejemplos de código === | ||
- | Creamos un frame en la parte superior de la pantalla de 300 píxeles de alto, y que incluye la imagen "titulo.pgn" sin escalar. | + | Creamos un frame en la parte superior de la pantalla de 300 píxeles de alto, y que incluye la imagen "titulo.png" sin escalar. |
<code java> | <code java> | ||
- | if ( jugador.getIO() instanceof MultimediaInputOutputClient && jugador.getIO().isGraphicsEnabled() ) | + | if ( jugador.getClient() instanceof MultimediaInputOutputClient && jugador.getClient().isGraphicsEnabled() ) |
{ | { | ||
- | MultimediaInputOutputClient theClient = jugador.getIO(); | + | MultimediaInputOutputClient theClient = jugador.getClient(); |
URL imageURL = world.getResource("titulo.png"); | URL imageURL = world.getResource("titulo.png"); | ||
theClient.addFrame ( ImageConstants.TOP , 300 ); | theClient.addFrame ( ImageConstants.TOP , 300 ); |