如果在运行应用程序时使用IBDesignable文件,为什么不会自动布局自动更新? [英] why the autolayout is not updated if I use IBDesignable file when i run the app?

查看:134
本文介绍了如果在运行应用程序时使用IBDesignable文件,为什么不会自动布局自动更新?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

这是在Google驱动器中解决此问题的项目:

here is the project of this problem in the google drive: https://drive.google.com/file/d/1Js0t-stoerWy8O8uIOJl_bDw-bnWAZPr/view?usp=sharing

我使用下面的IBDesignable代码制作了一个自定义导航栏(下图中的红色视图).我想,如果iPhone具有像iPhone X,iPhone XR这样的顶级产品,那么自定义导航栏的高度为88,否则高度为64.我制作了一个IBDesignable代码,以便可以重复使用此代码

I make a custom navigation bar (the red view in the picture below) using IBDesignable code below. I want, if the iPhone has top notch like iPhone X, iPhone XR, then the height of custom navigation bar is 88, otherwise the height is 64. I make an IBDesignable code so I can reuse this code

import UIKit

@IBDesignable
class CustomParentNavigationBarView: UIView {

    override func awakeFromNib() {
        super.awakeFromNib()
        self.setHeight()
    }

    override func layoutSubviews() {
        super.layoutSubviews()
        self.setHeight()
    }

    func setHeight() {
        let deviceHasTopNotch = checkHasTopNotchOrNot()
        layer.frame.size.height = deviceHasTopNotch ? 88 : 64
    }

    func checkHasTopNotchOrNot() -> Bool {
        if #available(iOS 11.0, tvOS 11.0, *) {
            // with notch: 44.0 on iPhone X, XS, XS Max, XR.
            // without notch: 20.0 on iPhone 8 on iOS 12+.
            return UIApplication.shared.delegate?.window??.safeAreaInsets.top ?? 0 > 20
        }
        return false
    }

}

我将此CustomParentNavigationBarView分配给红色视图

然后,我贴上标签.应该位于红色视图的正下方(使用IBDesignable的自定义导航栏)

and then, I put a label. that should located exactly below the red view (custom navigation bar, that uses IBDesignable)

如果我在iPhone上运行该应用程序没有像iPhone8这样的顶级产品,那就太好了

it looks great if I run the app in the iPhone doesn't have top notch like iPhone8

但是,如果我在具有像iPhone XR这样的顶级功能的iPhone中运行该应用程序,则该标签现在位于红色视图中,它似乎仍然沿用先前的自动布局,达到了以前的红色视图高度,即以前的64(在情节提要中,我使用的是iPhone) 8),因此当自定义导航栏在iPhone XR上运行时更新为88时,标签仍沿用先前的64高度,然后它将位于红色视图内

but, if I run the app in iPhone that has top notch like iPhone XR, the label now inside the red view, it seems still following the previous autolayout to the red view height that previously 64 (in storyboard I am using iPhone 8), so when the custom navigation bar update to 88 when it is running on iPhone XR, the label still follow the previous 64 height, then it will locate inside the red view

这是自定义导航栏的自动布局(红色视图)

here is the autolayout of custom nav bar (red view)

这是标签的自动布局

如何解决此问题?

推荐答案

此处的问题是,您在setHeight()中指定了框架的高度,但同时也在情节提要中指定了具有布局约束的高度.解决此问题的一种方法是为视图指定一个internalContentSize,而不将高度指定为情节提要中的布局约束. (I.o.w.类似于您依赖为您计算标签宽度的方式)

The problem here is that you specify the frame height in setHeight(), but also specify the height with a layout constraint inside storyboard. One way to fix this is to specify an intrinsicContentSize for your view and not specify the height as a layout constraint in storyboard. (I.o.w. similar to the way you rely on the width of the label to be calculated for you)

@IBDesignable
class CustomParentNavigationBarView: UIView {

    lazy var deviceHasTopNotch: Bool = {
        if #available(iOS 11.0, tvOS 11.0, *) {
            // with notch: 44.0 on iPhone X, XS, XS Max, XR.
            // without notch: 20.0 on iPhone 8 on iOS 12+.
            return UIApplication.shared.delegate?.window??.safeAreaInsets.top ?? 0 > 20
        }
        return false
    }()

    override var intrinsicContentSize: CGSize {
        let height:CGFloat = deviceHasTopNotch ? 88 : 64
        let width = super.intrinsicContentSize.width //Use whatever you prefer here.  Ex.UIScreen.main.bounds.size.width
        return CGSize(width: width, height: height)
    }
}

在情节提要中

删除自定义视图的当前高度限制.将Intrinsic Size属性设置为Placeholder.

Remove your current height constraint for the custom view. Set the Intrinsic Size property to Placeholder.

自定义导航栏的布局约束示例.

Example of the layout constraints for the custom nav bar.

这篇关于如果在运行应用程序时使用IBDesignable文件,为什么不会自动布局自动更新?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆