【问题标题】:Why does a custom UIButton image does not resize in Interface Builder?为什么自定义 UIButton 图像不会在 Interface Builder 中调整大小?
【发布时间】:2010-11-06 23:23:25
【问题描述】:

为什么自定义 UIButton 图像不随按钮调整大小?

我在 Interface Builder 中将其视图模式设置为 Scale to Fill,但与 UIImageView 图像不同,它不遵守该设置。

我是在找错地方还是不可能?

【问题讨论】:

  • 我发现虽然它不会在 IB 中缩放图像,但它会在运行时缩放图像。
  • 这不一定是真的......如果你有一个 80x80 像素的 img 和一个 60x60 像素的按钮,它会缩放按钮以匹配图像大小,而很多人想要相反的(缩放图像以匹配较小的按钮大小)...请参阅我对此帖子的回复以获取执行此操作的正确代码:stackoverflow.com/questions/2658738/…

标签: ios cocoa-touch uibutton interface-builder


【解决方案1】:

Attribute Inspector中首先设置Type“Custom”和Style“Default”,然后设置对齐水平和垂直“fill”。

【讨论】:

  • 今天这个答案对我有帮助
【解决方案2】:

更新这篇文章将为 Swift 5 提供完整答案:

//Set button's image
let image = UIImage(systemName: "heart.fill") //Your image here
button.setImage(image, for: .normal)

//Optional: Remove background image if you added one on accident
button.setBackgroundImage(nil, for: .normal)

//Optional: Set button's title (displayed next to button's image)
button.setTitle(nil, for: .normal)

//The button's "content" includes the title label and image
//So we set the button's content to fill the button
//If title label is nil, the content will only show the image
button.contentVerticalAlignment = .fill
button.contentHorizontalAlignment = .fill

//Set button's image to desired content mode (aspectFit avoids distortion)
//This restricts the image from resizing to fill the entire content area
button.imageView?.contentMode = .scaleAspectFit

【讨论】:

  • button.contentVerticalAlignment = .fill button.contentHorizontalAlignment = .fill 完成了这项工作,谢谢
【解决方案3】:

试试这个:

[button setImage:image forState:UIControlStateNormal];
button.contentVerticalAlignment = UIControlContentVerticalAlignmentFill;
button.contentHorizontalAlignment = UIControlContentHorizontalAlignmentFill;

在 Swift 中:

button.contentVerticalAlignment = .fill
button.contentHorizontalAlignment = .fill

【讨论】:

  • 你拯救了我的一天! Bravo .. 还要确保按钮类型是 custom
  • 为我工作 - XCode 8、Swift 3、由故事板创建的 UIButton、矢量/PDF 图像作为按钮图像
  • 这应该是公认的答案——将图像设置为背景会产生不同的行为。例如,它不允许您控制触摸区域(如果内容图像可能比图像本身大)。
【解决方案4】:

界面构建器

要让 UIButtons 中的图像以与 interface Builder 中的 UIViews 相同的方式缩放,请执行以下步骤:

选择您的 UIButton 并从 Identity Inspector 将以下内容添加到 User Defined Runtime Attributes

imageView.contentMode 编号 1

其中number为contentMode的枚举数,例如:

0 = Scale to fill 
1 = Aspect Fit 
2 = Aspect Fill
etc..

然后打开 UIButton 的 Attributes 编辑器,在 Control 下将 Alignment 设置为 Fill(右侧最后一个按钮)垂直。

SWIFT 3

请注意,您也可以使用以下代码在代码中执行此操作:

button.imageView?.contentMode = .scaleAspectFit
button.contentVerticalAlignment = .fill
button.contentHorizontalAlignment = .fill

【讨论】:

  • 完美答案!谢谢。
【解决方案5】:

记得为按钮设置控件对齐设置

【讨论】:

    【解决方案6】:

    到目前为止,我在 Swift 2.1 中找到的最佳解决方案如下:

    self.imageButton.imageView?.clipsToBounds = true
    self.imageButton.imageView?.contentMode = UIViewContentMode.ScaleAspectFit
    

    这将缩放图像,使其具有适合 imageView 的方面。

    【讨论】:

      【解决方案7】:

      只需做(来自设计或来自代码):

      来自设计

      1. 打开您的 xib 或情节提要。
      2. 选择按钮
      3. Attribute Inspector 内部(右侧)> 在 “Control” 部分 > 选择最后一个 第 4 个选项 用于水平和垂直。李>

      [对于第 3 点:将水平和垂直对齐更改为 UIControlContentHorizo​​ntalAlignmentFill 和 UIControlContentVericalAlignmentFill]

      来自代码

      button.contentHorizo​​ntalAlignment = UIControlContentHorizo​​ntalAlignmentFill; button.contentVerticalAlignment = UIControlContentVerticalAlignmentFill;

      【讨论】:

      • 有趣的是,在 XIB 查看器中它看起来没有缩放。事实上,它会将按钮放大到更大的尺寸,但在运行时它会缩放到应有的尺寸。
      【解决方案8】:

      我知道这很旧,但我认为正确的答案是您应该将内容模式设置为 UIButton 内的“隐藏”UIImageView:

      button.imageView.contentMode = UIViewContentModeScaleAspectFill;
      

      这将更改图像集的图像视图的内容模式:

      [button setImage:yourAwesomeImage forState:UIControlStateNormal]; 
      //Or any other state
      

      【讨论】:

      • 对我不起作用 :-( 我的图像仍未拉伸以填充按钮的宽度和高度
      • 不适用于 iOS8。尝试在将图像添加到按钮之前和之后进行设置。 self.button1.imageView.contentMode = UIViewContentModeScaleAspectFill; 试过 scaleAscpetFill 和 scaleToFill,不行。 Cao Huu Loc 的解决方案确实有效。
      【解决方案9】:

      只需获取一个真正的 UIimageview 并在其顶部放置一个 UIbutton 并通过布局菜单将其设置为后退。然后你就可以适当地缩放你的图像了。

      【讨论】:

        【解决方案10】:

        尝试将 Interface Builder 中的 Clip subviews 属性设置为 true。

        希望对您有所帮助。

        【讨论】:

        • 唉,事实并非如此。不过,感谢您提供帮助。
        【解决方案11】:

        虽然这可能不是您所追求的 - 背景图片确实缩放。

        【讨论】:

        • 如果我把图像放在背景中,我会得到正确的行为,所以你解决了,谢谢。
        • 如果你不愿意使用背景图片(因为说你想为不同的状态使用不同的图片),你需要设置对齐属性。见:stackoverflow.com/questions/1957317/…
        • 如果你想让它缩放以适应呢?那么背景图片,可以缩放来填充,就不合适了
        • 这救了我的命(至少几个小时)
        • 啊,所以不是图片,而是背景图片。在忘记这个之前我会忘记我的名字。
        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 2021-07-31
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多