Установка ограничений на анимацию Lottie — swift

Я новичок в кодировании в Swift (и новичок в кодировании в целом) - и борюсь с применением ограничений к анимации Lottie.

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

На данный момент размер 250x250, но я надеялся изменить его размер в соответствии с размером экрана. Любая помощь будет высоко ценится.

 override func viewDidLoad() {
    super.viewDidLoad()
    let animationView = LOTAnimationView(name: "clock")
    animationView.frame = CGRect(x: self.view.frame.width / 2 - 125, y: self.view.frame.height / 2 - 125, width: 250, height: 250)
    animationView.contentMode = .scaleAspectFill
    animationView.loopAnimation = true
    self.view.addSubview(animationView)
    view.sendSubviewToBack(animationView)
    animationView.play()
}

person roypnyc    schedule 28.02.2019    source источник
comment
Вы не применяете никаких ограничений к своему animationView, вы можете прочитать руководство по автомакету, чтобы понять, как использовать ограничения.   -  person pckill    schedule 28.02.2019
comment
какой размер вы хотите для просмотра анимации? основываясь на этом, мы можем предложить, какие ограничения вам нужно установить для вашего VC.   -  person CodeChanger    schedule 28.02.2019
comment
Спасибо за вашу помощь - если на iPhone 8 размер анимации составляет 250 x 250 - как она может масштабироваться пропорционально экрану на размере 8 плюс? Или уменьшить его размер пропорционально на меньших экранах?   -  person roypnyc    schedule 28.02.2019


Ответы (1)


Хорошо, скажем, вы закончили установку Lottie framework в свой проект Xcode, а затем захотели в каком-то контроллере представления добавить импортированный файл лотереи в качестве объекта в представление, чтобы представить себя.

Вы почти закончили! Вам нужно понять, как работать с программным добавлением любых представлений. Есть много способов, как это сделать. Один из них использует класс NSLayout, который великолепен и достаточен в вашем случае (на самом деле в большинстве из них).

Я собираюсь показать ваш простой пример. Я создал пустой проект на основе шаблона Single View App. В файле ViewController.swift вы можете заметить метод viewDidLoad. Это именно то, что нам сейчас нужно. Присаживайтесь, проверьте мой код, а затем прочитайте обзор кода в конце ниже:

import UIKit
import Lottie

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        // 1. FIRST STEP (Decoding and Initializing):
        let loadingAnimation = Animation.named("LoadingPulse")
        let lottieView = AnimationView(animation: loadingAnimation)
        // 2. SECOND STEP (Adding and setup):
        self.view.addSubview(lottieView)
        lottieView.contentMode = .scaleAspectFit
        lottieView.loopMode = .autoReverse
        lottieView.play(toFrame: .infinity)
        // 3. THIRD STEP (LAYOUT PREFERENCES):
        lottieView.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            lottieView.leftAnchor.constraint(equalTo: self.view.leftAnchor),
            lottieView.rightAnchor.constraint(equalTo: self.view.rightAnchor),
            lottieView.topAnchor.constraint(equalTo: self.view.topAnchor),
            lottieView.bottomAnchor.constraint(equalTo: self.view.bottomAnchor)
        ])
    }

}

Мой код работает для любого экрана в любом повороте!

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

<сильный>1. ПЕРВЫЙ ШАГ (декодирование и инициализация):

Что именно я декодировал и инициализировал? В корне вашего проекта у вас есть необработанный файл JSON, который вы хотите загрузить в проект и запустить с некоторой анимацией. Я думаю, здесь у вас нет вопросов. Тогда идем дальше!

<сильный>2. ВТОРОЙ ШАГ (Добавление и настройка):

Все ваши пользовательские представления, которые вы создаете программно, должны быть добавлены в файл parent view. Это может быть что угодно, зависит от ситуации. На данный момент у нас есть свойство view, предоставленное нашим классом ViewController (благодаря UIViewController). Это представление будет нашим холстом художника и родительским представлением соответственно! Затем мы устанавливаем режим контента, чтобы размер анимации был емким и пропорциональным экрану устройства. И наконец, в этом примере я реализовал «бесконечный режим». Просто без причин. Вы делаете свои собственные настройки для запуска анимации.

<сильный>3. ТРЕТИЙ ШАГ (НАСТРОЙКИ МАКЕТА):

И, наконец, ваш добавленный вид идеален, но любые повороты экрана, изменения вида в реальном времени могут негативно повлиять на ваш вид с точки зрения стабильности представления вида. Таким образом, вы должны закрепить свой вид в родительском представлении, используя края родительского представления. translatesAutoresizingMaskIntoConstraints — это логическое значение, которое мы устанавливаем, чтобы информировать систему о том, что наше представление автоматически изменит размер на основе наших ограничений, а не на основе системного подхода Autolayout.

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

person shokuroff    schedule 25.11.2019