2012-03-19 12 views
7

Estoy tratando de trazar las rutas en los gráficos centrales. ¿Alguien ha hecho esto por formas arbitrarias y, de ser así, están dispuestos a compartir el código?Biselando una ruta/forma en Core Graphics

He incluido mi implementación a continuación. Utilizo tres variables para determinar el bisel: CGFloat bevelSize, UIColor highlightColor, UIColor shadow. Tenga en cuenta que el ángulo de la fuente de luz siempre es de 135 grados. No he terminado de implementar esto todavía, pero aquí está esencialmente lo que estoy tratando de hacer, dividido en dos partes. Parte uno, generar puntos focales:

  1. Encuentro las bisectrices para los ángulos entre cada líneas adyacentes en la ruta.
  2. Para los arcos, la bisectriz es la línea perpendicular a la línea creada por los dos extremos del arco, que se origina en el punto medio. Esto debería ocuparse de la mayoría de las situaciones en las que se usa un arco. No tomo la bisectriz de un arco y una línea. La bisectriz de arco debería funcionar bien en esos casos.
  3. Luego calculo puntos focales basados ​​en la intersección de cada bisectriz adyacente.
  4. Si un punto focal tiene la forma que se usa, de lo contrario, se descarta.

El propósito de generar los puntos focales es 'encoger' la forma proporcionalmente.

La segunda parte es un poco más complicada. Es esencial crear cada lado/segmento de la forma biselada. Hago esto dibujando 'in' (por el bevelSize) cada punto de la forma original a lo largo del radio de la línea que se extiende desde el punto focal más cercano al punto en cuestión. Cuando tengo dos 'bevelPoints' consecutivos, creo un UIBezierPath que se extiende desde los bevelpoints hasta los puntos originales y de vuelta a los bevelpoints (nota, esto incluye arcos). Esto crea un 'lado/segmento' que puedo usar para llenar. En los lados rectos, simplemente relleno con la sombra o el color de resaltado, dependiendo del ángulo del lado. Para los arcos, determino el 'arco' de radianes. Si ese arco contiene un ángulo de transición (M_PI_4 o M_PI + M_PI_4) lo llené con un degradado (de sombra a resaltar o resaltar a sombrear, lo que sea apropiado). De lo contrario, lo llené con un color sólido.

actualización

he dividido mi respuesta (véase más adelante) en un post aparte. Ya no uso los detalles de implementación que ves arriba, pero los guardo para referencia. Espero que esto ayude a cualquier otra persona que quiera utilizar Core Graphics.

+0

La pregunta es larga e incluye muchos detalles. ¿Puedes simplificarlo? –

+0

tipo de. La primera parte de la pregunta es la pregunta principal: ¿Alguien sabe cómo biselar una forma arbitraria en core-graphics? El resto solo detalla cómo implementé el biselado (que ya he terminado). Funciona bien en bastantes formas (pero no en todas). Dejaré la pregunta abierta en caso de que alguien tenga un método. –

+0

Consideré publicar mi solución, pero eso son solo unas 400 líneas de código ... parece mucho para publicar. –

Respuesta

3

Así que finalmente logré escribir una rutina para biselar formas arbitrarias en gráficos centrales. Terminó siendo un montón de trabajo, mucho más de lo que originalmente había previsto, pero ha sido un proyecto divertido. He publicado una explicación y el código para realizar el bisel en mi blog. Solo tenga en cuenta que no creé una clase completa (o un conjunto de clases) para esto. Este código se integró en una clase mucho más grande que uso para hacer todo mi dibujo gráfico básico. Sin embargo, todo el código que necesitas para biselar la mayoría de las formas arbitrarias está ahí.

ACTUALIZACIÓN

me he reescrito el código como c recta y se trasladó en un archivo separado. Ya no depende de ninguna otra variable de instancia para que se pueda llamar a la función de biselado desde cualquier contexto.

que explican el código y el proceso que utilizan para biselar aquí: Beveling Shapes In Core Graphics

Aquí está el código: Github : CGPathBevel.

El código no es perfecto: estoy abierto a sugerencias/correcciones/mejores formas de hacer las cosas.

+0

se ve genial. Tendré que probarlo pronto. ¡Gracias! +1 –

Cuestiones relacionadas