Existe alguma maneira de fazer cantos arredondados em um retângulo renderizado no XNA por meio de primitivas (tiras de linha)? Quero tornar minha interface do usuário um pouco mais sofisticada do que já é, e gostaria que o código fosse flexível, sem muitas texturas envolvidas.
10
Respostas:
Você pode renderizar sua primitiva e criar um sombreador que possa criar esses cantos arredondados.
Aqui está um shader de pixel simples no pseudocódigo que pode desenhar um quadrado arredondado:
Resultado deste sombreador de pixel:
Se você usa shaders, é possível criar uma interface realmente sofisticada, mesmo uma animada.
Para mim, ótimo protótipo de pixel shaders simples é o programa EvalDraw
fonte
Outra maneira de fazer isso é usar um 'alongamento de botão' (também chamado de 'alongamento de caixa' ou 'nove remendos'). Essencialmente, você cria uma imagem composta de 9 partes:
Para desenhar esse botão em qualquer tamanho, você desenha cada peça (de cima para baixo, da esquerda para a direita):
width - ((1) + (2)).Width
) na parte superior do retângulo de destino, com o deslocamento esquerdo pela largura de (1).height - ((1) + (2)).Height
) à esquerda do retângulo de destino, com o deslocamento superior pela altura de (1).Se você olhar para o botão, verá que não importa se (2), (5) e (7) são dimensionados horizontalmente (porque é essencialmente uma linha reta); da mesma maneira (4), (5) e (6) podem ser dimensionados verticalmente sem afetar a qualidade da imagem.
fonte
Aqui está o código para a abordagem "nove patches":
É invocado como:
fonte
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();