代码之家  ›  专栏  ›  技术社区  ›  Chelsea Shawra

如何通过编程设置UITableView标头的约束以支持RTL和LTR?

  •  0
  • Chelsea Shawra  · 技术社区  · 8 年前

    我正在使用UITableView的viewForHeader委托来设置自定义标题视图,但我没有使用约束来设置它。所以现在我的应用程序也需要支持RTL语言。我的代码如下:

    func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    let headerView = UIView(frame: CGRect(x: 0, y: 0, width: menuTableView.frame.size.width, height: 40))
    let headerImage = UIImageView()
    headerImage.frame = CGRect(x: 15, y: 15, width: 12, height: 12)
    let headerLabel = UILabel()
    headerLabel.frame = CGRect(x: headerImage.frame.origin.x + headerImage.frame.size.width + 20, y: 10, width:menuTableView.frame.size.width - 40, height: 20)
    headerLabel.font = UIFont().robotoLight(withFontSize: 9)
    headerLabel.textColor = CustomColor.menuGrey.color
    let arrowImage = UIImageView()
    arrowImage.isHidden = true
    switch section {
    case 1:
      headerImage.image = UIImage(named: "home_icon")
      headerLabel.text = "Home"
    case 2:
      headerImage.image = UIImage(named: "my_Id_icon")
      headerLabel.text = "My ID"
    case 3:
      headerImage.image = UIImage(named: "my_interest_icon")
      headerLabel.text = "My Account"
      arrowImage.isHidden = false
      if isFirstSectionHidden {
        arrowImage.frame = CGRect(x: menuTableView.frame.size.width - 30, y: 15, width: 3, height: 5)
        arrowImage.image = UIImage(named: "side_arrow")
      } else {
        arrowImage.frame = CGRect(x: menuTableView.frame.size.width - 30, y: 15, width: 5, height: 3)
        arrowImage.image = UIImage(named: "down_arrow")
      }
    case 4:
      headerImage.image = UIImage(named: "my_profile_icon")
      headerLabel.text = "My Profile"
    case 5:
      headerImage.image = UIImage(named: "language_icon")
      headerLabel.text = language
      arrowImage.isHidden = false
      if isSecondSectionHidden {
        arrowImage.frame = CGRect(x: menuTableView.frame.size.width - 30, y: 15, width: 3, height: 5)
        arrowImage.image = UIImage(named: "side_arrow")
      } else {
        arrowImage.frame = CGRect(x: menuTableView.frame.size.width - 30, y: 15, width: 5, height: 3)
        arrowImage.image = UIImage(named: "down_arrow")
      }
    
    case 6:
      headerImage.image = UIImage(named: "notification_icon")
      headerLabel.text = "Notifications"
    case 7:
      headerImage.image = UIImage(named: "about_us_icon")
      headerLabel.text = "About Us"
    case 8:
      headerImage.image = UIImage(named: "faq_icon")
      headerLabel.text = "FAQ"
    case 9:
      headerImage.image = UIImage(named: "contact_us_icon")
      headerLabel.text = "Contact Us"
    case 10:
      headerImage.image = UIImage(named: "logout_icon")
      headerLabel.text = "Logout"
    default:
      print("Something else")
    
    }
    let headerClick = UIButton(type: .custom)
    headerClick.addTarget(self, action: #selector(self.headerAction), for: .touchUpInside)
    headerClick.frame = CGRect(x: 0, y: 0, width: menuTableView.frame.size.width, height: 40)
    headerClick.tag = section
    headerClick.backgroundColor = UIColor.clear
    headerView.addSubview(arrowImage)
    headerView.addSubview(headerLabel)
    headerView.addSubview(headerImage)
    headerView.addSubview(headerClick)
    return headerView
    

    }

    如何通过编程设置headerView、headerImage和headerLabel的框架和约束,以支持LTR和RTL?

    enter image description here

    1 回复  |  直到 8 年前
        1
  •  1
  •   André Slotta    8 年前

    我不完全确定我是否正确理解了您的布局,但它应该是这样工作的:

    override func tableView(_ tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
        return 50
    }
    
    override func tableView(_ tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
        let headerView = UIView()
        headerView.backgroundColor = .lightGray
    
        let headerImage = UIImageView()
        headerImage.translatesAutoresizingMaskIntoConstraints = false
        headerImage.backgroundColor = .red
        headerImage.widthAnchor.constraint(equalToConstant: 12).isActive = true
        headerImage.heightAnchor.constraint(equalToConstant: 12).isActive = true
    
        let headerLabel = UILabel()
        headerLabel.translatesAutoresizingMaskIntoConstraints = false
        headerLabel.backgroundColor = .blue
    
        let arrowImage = UIImageView()
        arrowImage.translatesAutoresizingMaskIntoConstraints = false
        arrowImage.backgroundColor = .green
        arrowImage.widthAnchor.constraint(equalToConstant: 5).isActive = true
        arrowImage.heightAnchor.constraint(equalToConstant: 5).isActive = true
    
        let headerClick = UIButton()
        headerClick.translatesAutoresizingMaskIntoConstraints = false
        headerClick.backgroundColor = .clear
        headerClick.isOpaque = false
    
        headerView.addSubview(headerImage)
        headerView.addSubview(headerLabel)
        headerView.addSubview(arrowImage)
        headerView.addSubview(headerClick)
    
        var constraints = [NSLayoutConstraint]()
        constraints.append(contentsOf: NSLayoutConstraint.constraints(withVisualFormat: "|-15-[hi]-[hl]-[ai]-15-|", options: [.alignAllCenterY], metrics: nil, views: ["hi": headerImage, "hl": headerLabel, "ai": arrowImage]))
        constraints.append(contentsOf: NSLayoutConstraint.constraints(withVisualFormat: "V:|-10-[hl]-10-|", options: [], metrics: nil, views: ["hl": headerLabel]))
        NSLayoutConstraint.activate(constraints)
    
        headerClick.widthAnchor.constraint(equalTo: headerView.widthAnchor).isActive = true
        headerClick.heightAnchor.constraint(equalTo: headerView.heightAnchor).isActive = true
    
        return headerView
    }
    

    layout

    推荐文章