xcode Interface Builder (iPhone dev) 自定义按钮背景图像不尊重拉伸设置

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/1996845/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-09-09 03:13:56  来源:igfitidea点击:

Interface Builder (iPhone dev) custom button background Image does not respect Stretching settings

iphonexcodeuikitinterface-builderuibutton

提问by David Whatley

I'm attempting to create a custom button using a background image in Interface Builder. The image has stretchable and non-stretchable parts so that it can be resized.

我正在尝试使用 Interface Builder 中的背景图像创建自定义按钮。图像具有可拉伸和不可拉伸的部分,因此可以调整大小。

IB exposes the Stretching properties to allow for this, yet no values I put in affect how the button appears. It is always fully stretched to fill the size of the frame.

IB 公开了 Stretching 属性以允许这样做,但我输入的任何值都不会影响按钮的显示方式。它总是被完全拉伸以填充框架的大小。

Is this this a unsupported feature in IB or in UIButton perhaps?

这是 IB 或 UIButton 中不受支持的功能吗?

http://img.skitch.com/20100103-rjabkq2c2jkqynw47crxepdtwb.jpg

http://img.skitch.com/20100103-rjabkq2c2jkqynw47crxepdtwb.jpg

(Note: The above stretch values are not the ones that will work with the image properly, but just the values I was messing with at the time of the screenshot)

(注意:上面的拉伸值不是可以正确处理图像的值,而只是我在截屏时弄乱的值)

采纳答案by Nimrod

In the example in Beginning iPhone 3 Developmentonly the UIImage leftCapWidthand topCapHeightare used, and the image is created/set programmatically, so that's an alternate method if contentStretch isn't working.

Beginning iPhone 3 Development 中的示例中,仅使用了UIImage leftCapWidthtopCapHeight,并且以编程方式创建/设置图像,因此如果 contentStretch 不起作用,这是另一种方法。

回答by Felix Lamouroux

In cases where you want more than one pixel to stretch (ie. a pattern in the center of the button) the stretchable UIImage does not work.

如果您希望拉伸多个像素(即按钮中心的图案),可拉伸的 UIImage 不起作用。

The UIButton's contentStretch does also not work properly.

UIButton 的 contentStretch 也不能正常工作。

How I solved it: I subclassed UIButton and added a UIImageView *backgroundImageViewas property and placed it at index 0 as a subview within the UIButton. I then ensure in layoutSubviews that it fits the button entirely and set the highlighted states of the imageView. All you need to do is handover a UIImageView with the correct contentStretch and contentMode applied.

我是如何解决它的:我将 UIButton 子类化并添加了一个UIImageView *backgroundImageViewas 属性并将其作为UIButton. 然后我在 layoutSubviews 中确保它完全适合按钮并设置 imageView 的突出显示状态。您需要做的就是移交一个应用了正确 contentStretch 和 contentMode 的 UIImageView。

.h file

.h 文件

@interface ButtonWithBackgroundImage : UIButton {
    UIImageView *backgroundImageView;
}
@property (retain) UIImageView *backgroundImageView;
+ (ButtonWithBackgroundImage*)button;
@end

.m file

.m 文件

@implementation ButtonWithBackgroundImage
@synthesize backgroundImageView;

+ (ButtonWithBackgroundImage*)button {
return [self buttonWithType:UIButtonTypeCustom];
}
- (void)setBackgroundImageView:(UIImageView*)img {
    [backgroundImageView removeFromSuperview];
    [backgroundImageView release];

    backgroundImageView = [img retain];

    if(backgroundImageView){
        [self insertSubview:backgroundImageView atIndex:0];
        [self setNeedsLayout];
    }
}

- (void)setSelected:(BOOL)select {
    [super setSelected:select];
    // we subclass the setSelect method to highlight the background imageview
[backgroundImageView setHighlighted:select||self.highlighted];
}
- (void)setHighlighted:(BOOL)highl {
    [super setHighlighted:highl];

    // we subclass the setHighlighted method to highlight the background imageview    
    [backgroundImageView setHighlighted:highl||self.selected];
}

- (void)layoutSubviews {
    [super layoutSubviews];

    self.backgroundImageView.frame = self.bounds;
}

- (void)dealloc {
    [backgroundImageView release];
    backgroundImageView = nil;
    [super dealloc];
}
@end

回答by 18446744073709551615

The button's background image will always be resized to fill the frame; the foreground image will not be resized (if there's no text, it is centered). The logic of stretching is that it resizes the middle while leaving the borders intact; for example, for a rounded rectangle this means that the rounded corners will not be distorted.

按钮的背景图像将始终调整大小以填充框架;前景图像不会被调整大小(如果没有文本,它会居中)。拉伸的逻辑是在保持边框不变的情况下调整中间大小;例如,对于圆角矩形,这意味着圆角不会扭曲。

回答by backslash112

Use the Xcode Slicing feature to specify the dimensions of a resizable center area of the image and to optionally specify end caps, which are areas of the image that should not be filled by the resizable area. See About Asset Catalogs

使用 Xcode Slicing 功能指定图像可调整大小的中心区域的尺寸,并可选择指定端盖,即不应由可调整大小的区域填充的图像区域。请参见关于资产目录

回答by 18446744073709551615

I have got it working!!! The magic values for me are 0.2 and 0.2.

我已经开始工作了!!!我的魔法值是 0.2 和 0.2。

My image is a box within a box, both with round corners.

我的图像是一个盒子中的一个盒子,两个都有圆角。

When it is 0.2 and 0.8, it leaves the top of the image unstretched, but the bottom is stretched and distorted.

当它是 0.2 和 0.8 时,它使图像的顶部未拉伸,但底部被拉伸和扭曲。

I guess, the first 0.2 is the offset meaning how much not to stretch, and the 2nd one is probably how much to stretch. At least, 0.2 and 0.6 work too.

我想,第一个 0.2 是偏移量,表示不拉伸多少,第二个可能是拉伸多少。至少,0.2 和 0.6 也有效。

In principle, you may make an experiment: take an image of a lattice or concentric circles or a color gradient and stretch it. If you do, please post the image :) .

原则上,您可以做一个实验:拍摄一个格子或同心圆或颜色渐变的图像并拉伸它。如果你这样做,请张贴图片:)。