[ios] Cree el aspecto sangrado que se encuentra en UINavigationBarButton - programáticamente



Answers

Usar la sombra de la capa no lo hará. Necesitas una sombra exterior ligera y una sombra interior oscura para obtener ese efecto. Una capa solo puede tener una sombra (externa). (Además, las sombras de las capas se vuelven a dibujar de forma dinámica y obligan a la renderización basada en la CPU que mata el rendimiento).

Tendrá que hacer su propio dibujo con CoreGraphics, ya sea en el método drawRect: una vista o en el método drawInContext: una capa. (O dibuja en un contexto de imagen y luego reutiliza la imagen.) Dicho dibujo usará principalmente las CGContext functions . (Voy a nombrar algunos a continuación, pero este enlace tiene documentación para todos ellos).

Para un botón rect redondo, puede resultar tedioso crear el CGPath apropiado; en su lugar, puede usar +[UIBezierPath bezierPathWithRoundedRect:cornerRadius:] y luego la propiedad CGPath la ruta para establecer la ruta actual del contexto con CGContextAddPath .

Puede crear una sombra interior configurando un trazado de recorte (vea CGContextClip y funciones relacionadas) a la forma del botón, configurando una sombra (vea CGContextSetShadowWithColor y funciones relacionadas), y luego dibujando alrededor de la forma que desea sombrear. Para la sombra interior, trazo ( CGContextStrokePath ), una CGContextStrokePath redonda que es un poco más grande que tu botón, usando un grosor de trazo grueso ( CGContextSetLineWidth ) por lo que hay mucha "tinta" para generar una sombra (recuerda, este trazo no será visible debido a la ruta de recorte).

Puede crear una sombra exterior de la misma manera: no use un trazado de recorte esta vez, porque desea que la sombra quede fuera de la forma y complete ( CGContextFillPath ) la forma de su botón en lugar de acariciarlo. Tenga en cuenta que dibujar una sombra es una especie de "modo": guarda el estado de los gráficos ( CGContextSaveGState ), configura una sombra y luego dibuja la forma de la que desea ver una sombra (la forma en sí no se dibuja cuando está en este modo), y finalmente restaurar el estado ( CGContextRestoreGState ) para salir del "modo sombra". Como ese modo no dibuja la forma, solo la sombra, tendrás que dibujar la forma por separado.

También hay una orden para hacer todo esto. Debería ser obvio si piensas en el orden en que pintarías estas cosas con medios físicos: Primero dibuja la sombra exterior, luego el relleno del botón y luego la sombra interna. Puede agregar un trazo después de eso si la sombra interna no le da un contorno suficientemente pronunciado.

Hay algunas herramientas de dibujo que pueden generar código fuente para CoreGraphics: Opacidad es la que uso. Tenga cuidado con estos, sin embargo, ya que el código que generan puede no ser eficiente.

Question

Estoy tratando de recrear de forma programática el aspecto del botón sangrado que se puede ver en un UINavigationBarButton. No el brillante aspecto de dos tonos o el degradado, solo el sombreado del perímetro:

Parece un sombreado oscuro interno alrededor de todo el perímetro de la vista, un poco más oscuro en la parte superior. Y luego una sombra externa que resalta alrededor del perímetro de la vista inferior.

He jugado un poco con Core Graphics, y experimenté con QuartzCore y sombreando con view.layer.shadowRadius y .shadowOffset, pero ni siquiera puedo obtener el resaltado más bajo para que se vea bien. Tampoco estoy seguro de por dónde empezar para lograr un sombreado oscuro con compensación interna y un sombreado claro con compensación externa.




Links