Пользовательский заголовок UIView для всех VC? - PullRequest
1 голос
/ 06 ноября 2019

Я пытаюсь создать специальный заголовочный файл для всех ViewControllers в проекте. Следующее изображение является фактическим дизайном.

Actual design

Так что я пытаюсь создать пользовательский вид с файлом Xib, как показано ниже:

import UIKit

class HamburgrView: UIView {
    override init(frame: CGRect) {
        // 1. setup any properties here
        // 2. call super.init(frame:)
        super.init(frame: frame)
        // 3. Setup view from .xib file
        xibSetup()
    }
    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        xibSetup()
    }
    override open func prepareForInterfaceBuilder() {
        super.prepareForInterfaceBuilder()
        xibSetup()
    }
    override func layoutSubviews() {

    }
    func xibSetup() {

       let  tempView = loadViewFromNib()
        // use bounds not frame or it'll be offset
        tempView.frame = bounds
        // Make the view stretch with containing view
        tempView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
        // Adding custom subview on top of our view (over any custom drawing > see note below)
        addSubview(tempView)

    }

    func loadViewFromNib() -> UIView {
        let bundle = Bundle(for: type(of:self))
        let nib = UINib(nibName: "HamburgrView", bundle: bundle)

        // Assumes UIView is top level and only object in CustomView.xib file
        let view = nib.instantiate(withOwner: self, options: nil)[0] as! UIView
        return view
    }


}

Мы не знаем, как нарисовать значок меню «Гамбургер» с кривой и его стартовой позицией из SafeArealayoutGuide .

Я пробовал один вид с отрицательной позицией x -40 и не указываю уголRadiusидеальная кривая, как на картинке выше.

Вывод выглядит не очень хорошо.

image

My ViewController Код:

override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.

        let hamView = HamburgrView(frame: .zero)
        self.view.addSubview(hamView)
        hamView.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            hamView.topAnchor.constraint(equalTo: self.view.safeAreaLayoutGuide.topAnchor, constant: 0),
            hamView.leadingAnchor.constraint(equalTo: self.view.leadingAnchor, constant: 0),
            hamView.widthAnchor.constraint(equalToConstant: 120),
            hamView.heightAnchor.constraint(equalToConstant:  80)
            ])
    }

Как ответ @sandip, я изменился следующим образом:

func xibSetup() {

       let  tempView = loadViewFromNib()
        // use bounds not frame or it'll be offset
        tempView.frame = bounds
        // Make the view stretch with containing view
        tempView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
        // Adding custom subview on top of our view (over any custom drawing > see note below)
        addSubview(tempView)
        let layer = CAShapeLayer()
        layer.path = UIBezierPath.init(arcCenter: CGPoint(x: 0, y: self.center.y), radius: 50, startAngle: -1.5708, endAngle: 1.5708, clockwise: true).cgPath
        layer.fillColor = UIColor.red.cgColor
        self.layer.addSublayer(layer)
    }

Вывод выглядит ниже:

Image Ouput after adding **CAShapeLayer** Любая идея будетоцените.

1 Ответ

1 голос
/ 06 ноября 2019

enter image description here

Это то, что вы хотели?

Вы можете легко добиться этого с помощью CAShapeLayer и UIBezierPath

    let layer = CAShapeLayer()
    layer.path = UIBezierPath.init(arcCenter: CGPoint(x: 0, y: self.view.center.y), radius: 30, startAngle: -1.5708, endAngle: 1.5708, clockwise: true).cgPath
    layer.fillColor = UIColor.red.cgColor
    view.layer.addSublayer(layer)

В вашем коде измените центр дуги на x, чтобы быть нулем, а y на вертикальный центр вида гамбургера и добавьте его к self.view

Надеюсь, это поможет

РЕДАКТИРОВАТЬ 1:

Поскольку OP запросил полный код в комментарии, обновляя ответ

class HamburgrView: UIView {
    override init(frame: CGRect) {
        // 1. setup any properties here
        // 2. call super.init(frame:)
        super.init(frame: frame)
        // 3. Setup view from .xib file
        xibSetup()
    }
    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        xibSetup()
    }
    override open func prepareForInterfaceBuilder() {
        super.prepareForInterfaceBuilder()
        xibSetup()
    }
    override func layoutSubviews() {

    }
    func xibSetup() {

       let  tempView = loadViewFromNib()
        // use bounds not frame or it'll be offset
        tempView.frame = bounds
        // Make the view stretch with containing view
        tempView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
        // Adding custom subview on top of our view (over any custom drawing > see note below)
        addSubview(tempView)

    }

    func loadViewFromNib() -> UIView {
        let bundle = Bundle(for: type(of:self))
        let nib = UINib(nibName: "HamburgrView", bundle: bundle)

        // Assumes UIView is top level and only object in CustomView.xib file
        let view = nib.instantiate(withOwner: self, options: nil)[0] as! UIView
        return view
    }

    override func didMoveToSuperview() {
        super.didMoveToSuperview()
        let layer = CAShapeLayer()
        layer.path = UIBezierPath.init(arcCenter: CGPoint(x: 0, y: 40), radius: 50, startAngle: -1.5708, endAngle: 1.5708, clockwise: true).cgPath
        layer.fillColor = UIColor.red.cgColor
        self.layer.addSublayer(layer)
    }
}

EDIT 2:

Причина, по которой дуга OP выходит за пределы представления гамбургераиз-за неправильного центра дуги

изменение на CGPoint(x: 0, y: 40) с self.view.center.y должно решить проблему. Обновлен код для отображения того же

Почему 40?

Поскольку OP устанавливает высоту просмотра гамбургера на 80. Таким образом, 80/2 = 40

Почему мы не можем использовать bounds.size.height / 2 или self.view.center.y?

, потому что в didMoveToSuperview ограничение OP еще не сработало, поэтому оно принимает представление высоты в xib, которое я не думаюравно 80, поэтому он устанавливает центр дуги с этим значением, но тогда ваше ограничение изменит высоту на 80.

Вот окончательный O / P:

enter image description here

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...