iOS — привязка вида к верхней части экрана, за строкой состояния

У меня есть CollectionViewController со строкой состояния по умолчанию, и все это встроено в NavigationController.

Я пытаюсь воспроизвести эффект, в котором у меня есть представление, привязанное к верхней части экрана, поскольку мой navController полностью прозрачен, и моя строка состояния также прозрачна, но каким-то образом, когда я привязываю свое представление к topAnchor, оно остается обрезанным до Нижний якорь навигационного контроллера, потому что он «думает», что верхняя часть экрана — это нижняя часть навигационного контроллера.

Мне удалось обойти это просто после того, как я привязал представление к вершине, я дал ему отрицательное значение topPadding, и теперь оно там, где я хотел.

Я знаю, что есть способ расширить макет на верхний экран, но я не могу этого понять.

Можете ли вы дать мне подсказку?

Я пытаюсь это:

желаемый

Я получаю это:

результат

Пробел — это высота строки состояния + высота NavigationController.

Спасибо


ios uinavigationcontroller nslayoutconstraint swift3 nslayoutanchor
person Ivan Cantarino    schedule 23.05.2017    source источник
comment
Добавляете ли вы ограничения в Interface Builder/Storyboard? Или через код?   -  person DonMag    schedule 23.05.2017
comment
Я не использую раскадровки, все кодируется вручную   -  person Ivan Cantarino    schedule 23.05.2017
comment
Поскольку CollectionView встроен в NavController, и я сделал NavController и строку состояния прозрачными, мне было интересно, могу ли я установить начальную позицию, возможно, для collectionView, чтобы она была прямо над экраном.   -  person Ivan Cantarino    schedule 23.05.2017

Ответы (3)


arrow_upward
1
arrow_downward

Ну, это закрепляет мой UIImageView в верхней части экрана... под строками навигации и состояния. Не должно быть никакой разницы с представлением коллекции:

NSLayoutConstraint *top = [NSLayoutConstraint
                           constraintWithItem:imageView
                           attribute:NSLayoutAttributeTop
                           relatedBy:NSLayoutRelationEqual
                           toItem:self.view
                           attribute:NSLayoutAttributeTop
                           multiplier:1
                           constant:0];

Редактировать: извините, работал над проектом Obj-C... вот он в Swift:

    let img = UIImage(named: "Man")
    let imageView = UIImageView(image: img)
    imageView.translatesAutoresizingMaskIntoConstraints = false

    self.view.addSubview(imageView)

    imageView.widthAnchor.constraint(equalToConstant: 200.0).isActive = true
    imageView.heightAnchor.constraint(equalToConstant: 200.0).isActive = true

    imageView.centerXAnchor.constraint(equalTo: self.view.centerXAnchor).isActive = true

    imageView.topAnchor.constraint(equalTo: self.view.topAnchor).isActive = true

введите здесь описание изображения

и... вот это также с представлением коллекции (сложно сказать с помощью простой скрин-шапки):

    self.view.backgroundColor = .white

    let img = UIImage(named: "Man")
    let imageView = UIImageView(image: img)
    imageView.translatesAutoresizingMaskIntoConstraints = false

    self.view.addSubview(imageView)

    imageView.widthAnchor.constraint(equalToConstant: 200.0).isActive = true
    imageView.heightAnchor.constraint(equalToConstant: 200.0).isActive = true

    imageView.centerXAnchor.constraint(equalTo: self.view.centerXAnchor).isActive = true

    imageView.topAnchor.constraint(equalTo: self.view.topAnchor).isActive = true

    let layout = UICollectionViewFlowLayout()
    let cv = UICollectionView(frame: CGRect.zero, collectionViewLayout: layout)
    cv.backgroundColor = .clear

    cv.register(UICollectionViewCell.self, forCellWithReuseIdentifier: "defaultCell")
    cv.dataSource = self

    cv.translatesAutoresizingMaskIntoConstraints = false
    self.view.addSubview(cv)

    cv.widthAnchor.constraint(equalTo: self.view.widthAnchor, multiplier: 0.9).isActive = true
    cv.heightAnchor.constraint(equalToConstant: 300.0).isActive = true

    cv.centerXAnchor.constraint(equalTo: self.view.centerXAnchor).isActive = true

    cv.topAnchor.constraint(equalTo: self.view.topAnchor).isActive = true

введите здесь описание изображения

person DonMag    schedule 23.05.2017
comment
Я просто конвертировал его в Swift. Позвольте мне попробовать :) - person Ivan Cantarino; 23.05.2017

arrow_upward
1
arrow_downward

Если вы не хотите, чтобы представление содержимого ViewControllers располагалось под верхними/нижними полосами, вы можете использовать параметры Расширить края под верхними/нижними полосами в Interface Builder.

Попробуйте использовать это

ЦельC:

self.edgesForExtendedLayout = UIRectEdgeNone;

Swift3:

self.edgesForExtendedLayout = []

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

person iOS_MIB    schedule 23.05.2017
comment
хм.. хотя я не знал, что это возможно, спасибо за подсказку. Но это не то, чего я пытаюсь достичь. Результат, который я пытаюсь, - это что-то вроде прокрутки представления коллекции, которое начинается в верхней части экрана, а не в нижней части навигационного контроллера. - person Ivan Cantarino; 23.05.2017

arrow_upward
-1
arrow_downward 

class DetailsPage : UIViewController {

    let topView:UIView = UIView()
    let topSliderImage:UIImageView = UIImageView()

    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = .white
        setUI()
    }

    override func viewWillAppear(_ animated: Bool) { 
        navigationController?.navigationBar.isTranslucent = true
        navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)
        navigationController?.navigationBar.shadowImage = UIImage() 
    }

    func setUI(){

        self.view.addSubview(topSliderImage)
        topSliderImage.image = UIImage(named: "img-1")
        topSliderImage.contentMode = .scaleAspectFit
        topSliderImage.translatesAutoresizingMaskIntoConstraints = false
        topSliderImage.topAnchor.constraint(equalTo: view.topAnchor, constant: 0).isActive = true
        topSliderImage.heightAnchor.constraint(equalToConstant: 300).isActive = true
        topSliderImage.widthAnchor.constraint(equalToConstant: view.frame.width).isActive = true
    }
}

введите здесь описание изображения

person imran    schedule 18.04.2019