Добавленное подпредставление немного отключено - как я могу вернуть его на место?

Question

ОБНОВЛЕНИЕ: решено! Хотя contentMode для pianoNoteDisplayed и piano_background действительно были одинаковыми, очевидно, это не относится к добавленным подпредставлениям. Я просто добавил строку subview.contentMode = superview.contentMode в функцию, предложенную vdmzz, и теперь все выглядит правильно на всех 4 размерах экрана.

Существует два вида изображений: один, называемый «piano_background», содержит фоновое изображение (клавиатуру пианино), а другой будет использоваться для отображения выделенных нот. Второй ограничен первым:

(ограничение ширины, вероятно, не нужно, потому что ведущие и конечные ограничения уже установлены, верно?)

Чтобы отобразить несколько выделенных клавиш, я программно добавляю подпредставления к представлению piano_note и активирую NSLayoutConstraints, чтобы получить его на месте (в противном случае он отображается далеко из позиции), например так:

pianoNoteDisplayed.image = nil

if !notesAlreadyAttempted.contains(currentUserAnswer) {

   let wrongNoteImageName = "large_\(currentUserAnswer)_wrong"
   let wrongNoteImage = UIImage(named: wrongNoteImageName)
   let wrongNoteImageView = UIImageView(image: wrongNoteImage!)

   wrongNoteImageView.translatesAutoresizingMaskIntoConstraints = false
   pianoNoteDisplayed.addSubview(wrongNoteImageView)

   NSLayoutConstraint.activate([
       wrongNoteImageView.widthAnchor.constraint(equalToConstant: pianoNoteDisplayed!.frame.width),
       wrongNoteImageView.heightAnchor.constraint(equalToConstant: pianoNoteDisplayed!.frame.height)
   ])

   }

   notesAlreadyAttempted.append(currentUserAnswer)
}

Проблема в том, что подпредставление отображается немного выключенным, и я не могу понять, почему:

(как вы можете видеть, подсветка выглядит слегка сжатой по вертикали: верхняя часть правильно приземляется, но нижняя часть не достигает достаточного расстояния примерно на 5 пикселей)

Я пытался центрировать и ограничивать подпредставление несколькими способами, используя предложения из примерно 5 различных ответов в стеке и несколько других статей, которые я нашел. Изображения, которые я использую (фоновый рисунок пианино и подсвечивание выделенной ноты) имеют одинаковые размеры. Я попытался добавить больше или меньше ограничений в конструкторе интерфейса, и я попытался добавить подпредставления в исходное представление piano_background вместо второго представления pianoNoteDisplayed - тот же результат. Использование самого представления фортепианоNoteDisplayed для отображения выделенной заметки прекрасно работает:

И они отображаются с использованием обычного метода .image:

pianoNoteDisplayed.image = UIImage(named: "large_\(currentCorrectAnswer)_right")

Какие-либо предложения по дальнейшему устранению проблемы?

Answer 1

Прежде всего, насколько я понял, pianoNoteDisplayed не обязательно должен быть UIImageView.Во-вторых, если вы выровняете piano_background и pianoNoteDisplayed по верхнему, переднему, заднему и нижнему краям, один будет точно поверх другого.Или вы можете установить их равными по высоте, ширине и центру.Проблема с вашим текущим набором ограничений заключается в том, что позиция Y piano_background определяется Безопасной областью и, следовательно, может откладываться от позиции Y pianoNoteDisplayed.

Попробуйте использовать эту функцию:

func addSameSize(subview: UIView, onTopOf superview: UIView) {
    superview.addSubview(subview)

    subview.translatesAutoresizingMaskIntoConstraints = false

    subview.centerXAnchor.constraint(equalTo: superview.centerXAnchor).isActive = true
    subview.centerYAnchor.constraint(equalTo: superview.centerYAnchor).isActive = true
    subview.widthAnchor.constraint(equalTo: superview.widthAnchor).isActive = true
    subview.heightAnchor.constraint(equalTo: superview.heightAnchor).isActive = true

    subview.contentMode = superview.contentMode
}

Например:

addSameSize(subview: wrongNoteImageView, onTopOf: pianoNoteDisplayed)

Это добавит изображения, точно выровненные поверх pianoNoteDisplayed view