【问题标题】:titleview dissapears when a subview is added?添加子视图时标题视图消失?
【发布时间】:2018-02-21 21:14:05
【问题描述】:

这对我来说是新的,如果我没有问对正确的问题,请原谅我。

我正在关注一个教程,我们在导航栏的标题视图内创建一些子视图,以便显示图片和用户名。当我创建具有红色背景的初始标题视图时,它会按预期显示。但是,当我添加一个容器子视图来放置文本和图像时,红色的标题视图消失了。我完成了教程,文本显示在正确的位置,但它不允许我添加点击手势,因为标题视图不再可以点击?

我将为这个函数添加我的代码 - 希望我遗漏了一个愚蠢的错误。

func setupNavBarWithUser(user: User) {

    let titleView = UIView()
    titleView.frame = CGRect(x: 0, y: 0, width: 130, height: 35)
    titleView.backgroundColor = UIColor.red

    let containerView = UIView()
    containerView.translatesAutoresizingMaskIntoConstraints = false
    containerView.backgroundColor = UIColor.blue
    titleView.addSubview(containerView)

    let profileImageView = UIImageView()
    profileImageView.translatesAutoresizingMaskIntoConstraints = false
    profileImageView.contentMode = .scaleAspectFill
    profileImageView.layer.cornerRadius = 20
    profileImageView.clipsToBounds = true

    if let profileImageUrl = user.profileImageUrl {
        profileImageView.loadImageUsingCacheWithUrlString(urlString: profileImageUrl)
    }

    containerView.addSubview(profileImageView)

    profileImageView.leftAnchor.constraint(equalTo: containerView.leftAnchor).isActive = true
    profileImageView.centerYAnchor.constraint(equalTo: containerView.centerYAnchor).isActive = true
    profileImageView.widthAnchor.constraint(equalToConstant: 35).isActive = true
    profileImageView.heightAnchor.constraint(equalToConstant: 35).isActive = true

    let nameLabel = UILabel()


    containerView.addSubview(nameLabel)

    nameLabel.text = user.name
    nameLabel.translatesAutoresizingMaskIntoConstraints = false

    nameLabel.leftAnchor.constraint(equalTo: profileImageView.rightAnchor, constant: 8).isActive = true
    nameLabel.centerYAnchor.constraint(equalTo: containerView.centerYAnchor).isActive = true
    nameLabel.rightAnchor.constraint(equalTo: containerView.rightAnchor).isActive = true
    nameLabel.heightAnchor.constraint(equalToConstant: 40).isActive = true

    containerView.centerXAnchor.constraint(equalTo: titleView.centerXAnchor).isActive = true
    containerView.centerYAnchor.constraint(equalTo: titleView.centerYAnchor).isActive = true

    self.navigationItem.titleView = titleView

    titleView.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(showChatController)))
    titleView.isUserInteractionEnabled = true

}

【问题讨论】:

  • 渲染后容器视图的高度和宽度是多少
  • 容器视图也不显示尺寸。视频指示我们这样做,以使图片和文字保持居中。
  • 似乎您必须为容器视图的高度和宽度设置约束
  • 嗯,我试过了,容器视图显示在正确的位置,但标题视图仍然丢失并且阻止了轻触。它是否与它是使用 CGRect 而不是锚点创建的事实有关?
  • 你知道如何在 xcode 中使用 debug view hierarchy 吗?

标签: ios swift uinavigationitem uitapgesturerecognizer titleview


【解决方案1】:

用这个替换 setupNavBarWithUser 方法:

func setupNavBarWithUser(user: User) {

        let titleView = UIView()
        titleView.frame = CGRect(x: 0, y: 0, width: 130, height: 45)
        titleView.backgroundColor = UIColor.red

        let containerView = UIView()
        containerView.translatesAutoresizingMaskIntoConstraints = false
        containerView.backgroundColor = UIColor.blue
        self.navigationItem.titleView = titleView

        titleView.addSubview(containerView)

        containerView.topAnchor.constraint(equalTo: titleView.topAnchor, constant: 0).isActive = true
        containerView.bottomAnchor.constraint(equalTo: titleView.bottomAnchor, constant: 0).isActive = true
        containerView.leadingAnchor.constraint(equalTo: titleView.leadingAnchor, constant: 0).isActive = true
        containerView.trailingAnchor.constraint(equalTo: titleView.trailingAnchor, constant: 0).isActive = true

        let profileImageView = UIImageView()
        profileImageView.translatesAutoresizingMaskIntoConstraints = false
        profileImageView.contentMode = .scaleAspectFill
        profileImageView.layer.cornerRadius = 20
        profileImageView.clipsToBounds = true

        if let profileImageUrl = user.profileImageUrl {
            profileImageView.loadImageUsingCacheWithUrlString(urlString: profileImageUrl)
        }

        containerView.addSubview(profileImageView)

        profileImageView.leftAnchor.constraint(equalTo: containerView.leftAnchor).isActive = true
        profileImageView.centerYAnchor.constraint(equalTo: containerView.centerYAnchor).isActive = true
        profileImageView.widthAnchor.constraint(equalToConstant: 35).isActive = true
        profileImageView.heightAnchor.constraint(equalToConstant: 35).isActive = true

        let nameLabel = UILabel()

        containerView.addSubview(nameLabel)

        nameLabel.text = user.name
        nameLabel.translatesAutoresizingMaskIntoConstraints = false

        nameLabel.leftAnchor.constraint(equalTo: profileImageView.rightAnchor, constant: 8).isActive = true
        nameLabel.centerYAnchor.constraint(equalTo: containerView.centerYAnchor).isActive = true
        nameLabel.rightAnchor.constraint(equalTo: containerView.rightAnchor).isActive = true
        nameLabel.heightAnchor.constraint(equalToConstant: 40).isActive = true


        self.navigationItem.titleView = titleView

        titleView.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(showChatController)))
        titleView.isUserInteractionEnabled = true

    }

您可以比较代码。如您所见,您必须以正确的顺序添加子视图以设置约束。

【讨论】:

  • 非常感谢您的帮助!
猜你喜欢
  • 2015-08-07
  • 2017-07-17
  • 2011-01-05
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多