Ho un pulsante roundrect che voglio contenere all'interno di un altro roundrect. Il roundrect contenente dovrebbe essere sempre 1px di distanza dal pulsante.
Se il raggio sul contenitore è troppo piccolo, gli angoli hanno uno spazio maggiore attorno a loro.
Esiste una buona "regola empirica" che posso usare per capire quale raggio dovrebbe essere per il roundrect più grande?
Risposte:
Se vuoi che il roundrect esterno sia 1px da quello interno, anche il raggio d'angolo del rettangolo esterno dovrebbe essere 1px più grande di quello interno.
Ecco un diagramma veloce che può aiutarti a vedere come funziona:
Il rettangolo interno ha un raggio d'angolo di r pixel; il suo angolo segue l'arco del cerchio rosso interno, che ha un raggio di r pixel e il suo centro corrisponde di conseguenza r pixel dai lati del rettangolo.
Il rettangolo esterno ha un raggio d'angolo di r +1 pixel; il suo angolo segue l'arco del cerchio rosso esterno, che ha un raggio di r +1 pixel e il suo centro corrisponde rispettivamente a r +1 pixel dai lati del rettangolo. Poiché anche il rettangolo esterno viene spostato di un pixel verso l'alto e alla destra di quello interno (e, possiamo presumere, è due pixel più largo e più alto per compensare), i due cerchi sono concentrici e la distanza tra loro è sempre di un pixel.
Se si desidera che gli angoli abbiano centri condivisi, il raggio dell'angolo della forma esterna dovrebbe essere semplicemente il raggio dell'angolo della forma interna più la distanza tra le forme. Se la forma interna ha un raggio dell'angolo arrotondato di 5 pixel e la forma esterna è a 1 pixel di distanza, il raggio dell'angolo della forma esterna dovrebbe essere di 6 pixel. (Non tiene conto di eventuali pesi di corsa.)
