JavaFX: cómo agregar sombras

Usted puede notar que la sombra en este rectángulo JavaFX se muestra aquí no parece muy realista. Eso es porque es directamente detrás del rectángulo, como si la fuente de luz que causa la sombra estaban muertos delante. Por lo general, se espera que las sombras sean en un ligero ángulo desde el objeto que proyecta la sombra, más a menudo por debajo del objeto y el desplazamiento hacia un lado.

Afortunadamente, el DropShadow clase tiene varias propiedades que permiten controlar el tamaño y la posición de la sombra. Esos métodos se muestran en esta tabla, que enumera los detalles no sólo de la DropShadow clase, sino también de su clase hermana, Sombra interior. los Sombra interior clase crea una sombra en el interior de una forma en lugar de fuera de la forma. Por ahora, se centran en DropShadow.

Los métodos de la DropShadow clase permite especificar la geometría exacta de la sombra que desee aplicar. los setWidth y setHeight métodos permiten especificar el tamaño de la sombra, y la setOffsetX y setOffsetY métodos permiten cambiar la ubicación de la sombra con respecto al centro de la forma. Por lo general, se le agrega un x- positivo y y-desplazamiento de modo que la sombra aparece debajo ya la derecha de la forma, de esta manera:

DropShadow shadow1 = new DropShadow) (- shadow1.setOffsetX (10) -shadow1.setOffsetY (10) -

En este ejemplo, la sombra se coloca 10 píxeles a la derecha y 10 píxeles por debajo de la forma.

los setRadius método le permite especificar el tamaño del efecto de desenfoque aplicado a los bordes de la sombra. Cuanto mayor sea este número, más borrosa aparecerá la sombra. También puede controlar la propagación, que indica qué parte de la falta de definición de la sombra debe ser de color sólido antes de las patadas de efecto de desenfoque en.

Esta figura muestra una aplicación JavaFX que demuestra nueve variaciones de la sombra paralela básica.

Para crear estos rectángulos sombreados, un método de utilidad nombrado createShadowedBox fue creado. Aquí está el código para este método:

Rectángulo createShadowedBox (tamaño doble, doble ShadowWidth, doble shadowHeight, doble offsetX, doble offsetY, doble radio) {rectángulo r = new Rectangle (tamaño, tamaño) -r.setFill (Color.LIGHTGRAY) -r.setStroke (Color.BLACK) -r.setStrokeWidth (2) -DropShadow e = nueva DropShadow()-e.setWidth(shadowWidth)-e.setHeight(shadowHeight)-e.setOffsetX(offsetX)-e.setOffsetY(offsetY)-e.setRadius(radius)-r.setEffect(e)-return r}

Como puede ver, este método acepta seis parámetros: el tamaño del rectángulo para crear (el rectángulo es en realidad un cuadrado, así que el tamaño se utiliza tanto para la anchura y la altura), la anchura y la altura de la sombra, el x - y y-compensaciones para la sombra y radio de desenfoque de la sombra.

El método se inicia mediante la creación de un rectángulo. A continuación, se crea una sombra paralela, se aplica la anchura, la altura, x-offset, offset y, y radio, y luego aplica el efecto al rectángulo y devuelve el rectángulo.

Para crear los rectángulos sombreados reales, la createShadowBox método fue llamado nueve veces, utilizando diferentes valores de los parámetros:

Rectángulo r1 = createShadowedBox (100, 10, 10, 5, 5, 10) -Rectangle r2 = createShadowedBox (100, 20, 20, 10, 10, 10) -Rectangle r3 = createShadowedBox (100, 30, 30, 15, 15 , 10) -Rectangle r4 = createShadowedBox (100, 20, 20, 0, 0, 10) -Rectangle r5 = createShadowedBox (100, 20, 20, 0, 10, 10) -Rectangle r6 = createShadowedBox (100, 20, 20 , 10, 0, 10) -Rectangle r7 = createShadowedBox (100, 20, 20, 10, 10, 0) -Rectangle r8 = createShadowedBox (100, 20, 20, 10, 10, 20) -Rectangle r9 = createShadowedBox (100 , 20, 20, 10, 10, 50) -

Para el primer conjunto de tres, el tamaño y el desplazamiento de la sombra era variado, en cada uno, utilizando los mismos valores para la anchura y altura y para el desplazamiento x y la y-offset. Por lo tanto, la primera fila de rectángulos en la figura muestran varias colocaciones de la sombra debajo ya la derecha de los rectángulos.

Para el siguiente conjunto de tres, el desplazamiento y-x-offset o se puso a cero para demostrar las variaciones de la offset. Y para la última serie de tres, el radio era variada. Tenga en cuenta que cuando el radio se establece en 0, los bordes de la sombra son nítidas. Con valores de radio de mayor tamaño, la sombra se vuelve más borrosa.

Esta figura muestra cómo funcionan interno sombras. Por esta figura, una sola línea de código se cambió en el createShadowBox Método: En lugar de crear una DropShadow, un Sombra interior fue creado:

InnerShadow e = new InnerShadow () -

Como se puede ver, el Sombra interior clase coloca la sombra en el interior del rectángulo en lugar de en el exterior.