SpriteBuilder CCButton拉伸图像？

Question

In spritebuilder, the tool to create UI along with cocos2d, how come whenever I try to add a background image to a CCButton, it appears stretched or altered in some way?

It is hard to explain but after fiddling with every CCButton option for 20 minutes this is the closest I could get it. The first image is the original image and the second in the image in SpriteBuilder.

As you can see in the second image, the edges seem jagged a bit and are curving in the wrong direction. Can anyone explain to me why this is happening and how I can fix this?

Thanks!

Answer 1

I got this settings to work correctly by clicking the "Reset to default size" button. It automatically set the Preferred Size to half the width and height of my original image (since my 'default scaling' is set to '2x' in File->Project Settings).

To keep the button size intact while adding text then set the 'max size' property to the same as 'preferred size'.

Answer 2

CCButton uses a CCSprite9Slice and you need to set the preferred size of the button to solve your problem. If the preferred size matches the image size then the image will not be stretched:

You also need to take the scaling factor into account. If the you provide the image as a 4x asset, you need to set preferred size to 1/4 of the image size.

Answer 3

如果创建了图像，请尝试对其进行编辑，这样就不必缩放图像。

Answer 4

I just ended up subclassing CCSprite and just adding my own touch controls to that. Now it looks great!