Swift Academy · Урок

Встраивание проигрывателей в SwiftUI

Используйте VideoPlayer и пользовательские представления проигрывателя.

Урок 4 из 413 шагов

«Встраивание проигрывателей в SwiftUI» — бесплатный урок Swift Academy на CoddyKit. Это урок 4 из 4. Ты можешь прочитать весь урок бесплатно ниже — а потом практиковать его прямо в браузере с встроенным редактором кода и ИИ-репетитором 24/7. Это часть пути обучения Swift Academy, и твой прогресс синхронизируется между веб-версией и приложением CoddyKit. Курс Swift Academy содержит 4 уроков всего.

Видео в SwiftUI

SwiftUI предоставляет представление VideoPlayer из AVKit для декларативного встраивания воспроизведения медиа со встроенными элементами управления.

import SwiftUI
import AVKit

Представление VideoPlayer

VideoPlayer принимает AVPlayer и отображает его со стандартными элементами управления воспроизведением: запуском, паузой, ползунком перемотки и полноэкранным режимом.

struct PlayerScreen: View {
    let player = AVPlayer(url: URL(string: "https://example.com/v.mp4")!)
    var body: some View {
        VideoPlayer(player: player)
            .frame(height: 240)
    }
}

Хранение проигрывателя в состоянии

Храните AVPlayer в @State, чтобы он сохранялся при обновлении представления. Если создавать его при каждом вызове body, воспроизведение будет начинаться заново.

struct PlayerScreen: View {
    @State private var player = AVPlayer(
        url: URL(string: "https://example.com/v.mp4")!)
    var body: some View {
        VideoPlayer(player: player)
    }
}

Управление воспроизведением

Управляйте воспроизведением с помощью модификаторов жизненного цикла SwiftUI: запускайте его при появлении представления и приостанавливайте при исчезновении, чтобы звук не продолжал воспроизводиться за пределами экрана.

VideoPlayer(player: player)
    .onAppear { player.play() }
    .onDisappear { player.pause() }

Наложение содержимого

Инициализатор VideoPlayer принимает замыкание наложения для пользовательского интерфейса поверх видео: заголовков, значков и подписей.

VideoPlayer(player: player) {
    VStack {
        Spacer()
        Text("Live")
            .padding(6)
            .background(.red, in: Capsule())
    }
}

Зацикливание воспроизведения

Чтобы зациклить воспроизведение, наблюдайте за уведомлением об окончании элемента и выполняйте переход обратно к нулевой позиции. Другой вариант — использовать AVPlayerLooper с проигрывателем очереди.

.onAppear {
    NotificationCenter.default.addObserver(
        forName: .AVPlayerItemDidPlayToEndTime,
        object: player.currentItem, queue: .main) { _ in
        player.seek(to: .zero); player.play()
    }
}

Аудиосеанс для видео

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

try? AVAudioSession.sharedInstance().setCategory(.playback)

Пользовательские проигрыватели с UIViewRepresentable

Если Вам нужен полностью пользовательский интерфейс без системных элементов управления, оберните AVPlayerLayer в UIViewRepresentable вместо использования VideoPlayer.

struct PlayerLayerView: UIViewRepresentable {
    let player: AVPlayer
    func makeUIView(context: Context) -> UIView { PlayerUIView(player: player) }
    func updateUIView(_ uiView: UIView, context: Context) { }
}

Базовое UIView

Пользовательское UIView содержит AVPlayerLayer и изменяет его размер в соответствии со своими границами, предоставляя видеоповерхность без элементов управления.

final class PlayerUIView: UIView {
    init(player: AVPlayer) {
        super.init(frame: .zero)
        let layer = AVPlayerLayer(player: player)
        layer.videoGravity = .resizeAspectFill
        self.layer.addSublayer(layer)
    }
    required init?(coder: NSCoder) { fatalError() }
}

Картинка в картинке

Для режима «картинка в картинке» используйте AVPictureInPictureController со слоем проигрывателя и включите возможность воспроизведения звука в фоновом режиме.

let pip = AVPictureInPictureController(playerLayer: playerLayer)
pip?.startPictureInPicture()

Очистка

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

.onDisappear {
    player.pause()
    // remove notification observers here
}

Быстрая проверка: проигрыватели SwiftUI

Проверьте, насколько хорошо Вы понимаете встраивание проигрывателей в SwiftUI.

Итоги: встраивание проигрывателей в SwiftUI

VideoPlayer из AVKit встраивает AVPlayer со стандартными элементами управления; храните проигрыватель в @State, чтобы экземпляр оставался стабильным, и запускайте или приостанавливайте воспроизведение из onAppear/onDisappear. Добавляйте наложения с помощью замыкания в конце и запускайте воспроизведение заново по уведомлению о завершении.

Для пользовательского воспроизведения без элементов управления оберните AVPlayerLayer в UIViewRepresentable и удаляйте наблюдателей при исчезновении представления.

Можно начать бесплатно

Изучай Swift с ИИ-репетитором — бесплатно

Пиши и запускай код прямо в браузере, получай мгновенную помощь от ИИ-репетитора 24/7 и продолжи учиться на сайте или в приложении.

Курсы
122
Уроки
409

Часто задаваемые вопросы

Урок «Встраивание проигрывателей в SwiftUI» бесплатный?

Да — полный текст урока «Встраивание проигрывателей в SwiftUI» бесплатно доступен здесь в веб-версии. Чтобы практиковать его интерактивно (встроенный редактор кода и ИИ-репетитор 24/7) и разблокировать остальной курс Swift Academy, подпишись на CoddyKit PRO. Курс Swift Academy содержит 4 уроков всего.

Чему я научусь в уроке «Встраивание проигрывателей в SwiftUI»?

Используйте VideoPlayer и пользовательские представления проигрывателя. Ты практикуешь Swift Academy с помощью реального кода, который запускаешь прямо в браузере, и ИИ-репетитор 24/7 отвечает на твои вопросы во время урока.

Нужен ли мне опыт, чтобы начать Swift Academy?

Предыдущий опыт не требуется. Swift Academy на CoddyKit структурирован для всех уровней — от новичков до продвинутых, поэтому ты можешь начать отсюда или с самого начала и учиться в своем темпе. Это урок 4 из 4.

Сколько времени занимает урок «Встраивание проигрывателей в SwiftUI»?

Большинство уроков CoddyKit занимают около 5–10 минут. Каждый из них компактный и интерактивный, поэтому ты постоянно делаешь прогресс и продолжаешь с того же места в веб-версии и приложении.

Можно ли писать и запускать код в этом уроке Swift Academy?

Да. Каждый урок Swift Academy включает встроенный редактор кода, поэтому ты пишешь и запускаешь реальный код прямо в браузере и получаешь моментальную обратную связь от AI — локальная установка не требуется.

Все уроки этого курса

  1. Воспроизведение медиа с AVPlayer
  2. Запись аудио
  3. AVAsset и композиция
  4. Встраивание проигрывателей в SwiftUI
← Назад к Swift Academy