Czy jest jakiś sposób, aby wykonać zaokrąglone rogi na prostokącie renderowanym w XNA przez prymitywy (paski liniowe)? Chcę, aby mój interfejs był nieco bardziej fantazyjny niż obecnie, i chciałbym, aby kod był elastyczny, bez zbyt wielu tekstur.
10
Odpowiedzi:
Możesz wyrenderować prymityw i stworzyć moduł cieniujący, który może tworzyć zaokrąglone rogi.
Oto prosty moduł cieniujący piksele w pseudokodzie, który może narysować zaokrąglony kwadrat:
Wynik tego modułu cieniującego piksele:
Jeśli używasz shaderów, możesz stworzyć naprawdę fantazyjny interfejs użytkownika, nawet animowany.
Dla mnie świetnym prototypem prostych shaderów pikseli jest program EvalDraw
źródło
Innym sposobem na to jest użycie „rozciągnięcia guzika” (zwanego również „rozciągnięciem pudełka” lub „dziewięciopłatkiem”). Zasadniczo tworzysz obraz, który składa się z 9 części:
Aby narysować ten przycisk w dowolnym rozmiarze, narysuj każdy element (od góry do dołu, od lewej do prawej):
width - ((1) + (2)).Width
) u góry docelowego prostokąta, z lewym przesunięciem o szerokość (1).height - ((1) + (2)).Height
) po lewej stronie prostokąta docelowego, z górnym przesunięciem o wysokość (1).Jeśli spojrzysz na przycisk, zobaczysz, że nie ma znaczenia, czy (2), (5) i (7) są skalowane w poziomie (ponieważ jest to zasadniczo linia prosta); w ten sam sposób (4), (5) i (6) można przeskalować w pionie bez wpływu na jakość obrazu.
źródło
Oto kod metody „dziewięciu łatek”:
Jest wywoływany jako:
źródło
Texture2D _texture = new Texture2D(GraphicsDevice, 1, 1); _texture.SetData(new Color[] { Color.Blue }); SpriteBatch sb = new SpriteBatch(GraphicsDevice); sb.Begin(); //sb.Draw(_texture, new Rectangle(100, 100, 100, 100), Color.White); sb.DrawRoundedRect(_texture, new Rectangle(100, 100, 100, 100), Color.Pink, 16); sb.End();