Создание программы для воспроизведения звуковых файлов
Предлагаю написать простенький аудио плеер для mp3 файлов с использованием Qt/C++, который будет иметь плейлист, возможность запуска/паузы/остановки треков, а также пролистывания треков.
Для реализации данной задумки в Qt имеются классы QMediaPlayer и QMediaPlaylist, которые относятся к модулю multimedia. А для отображения плейлиста воспользуемся QStandardItemModel и QTableView.
Статьи данного цикла:
Структура проекта
- SimplePlayer.pro - профайл проекта;
- main.cpp - файл с функцией main;
- widget.ui - файл формы окна приложения;
- widget.h - заголовочный файл окна приложения;
- widget.cpp - файл исходных кодов окна приложения;
- buttons.qrc - ресурсный файл иконок кнопок приложения.
- 1. Структура проекта
- 2. widget.ui
- 3. SimplePlayer.pro
- 4. widget.h
- 5. widget.cpp
- 6. Итог
- 7. Видеоурок
widget.ui
Интерфейс приложения сделаем с использованием графического дизайнера, и выглядеть он должен будет следующим образом.
В состав интерфейса приложения входят следующие элементы:
- btn_add (QToolButton*) - отвечает за добавление треков в плейлист;
- btn_next(QToolButton*) - отвечает за пролистывание плейлиста вперёд;
- btn_previous (QToolButton*) - отвечает за пролистывание плейлиста назад;
- btn_play (QToolButton*) - отвечает за воспроизведение трека;
- btn_pause(QToolButton*) - отвечает за постановку трека на паузу;
- btn_stop (QToolButton*) - отвечает за остановку трека;
- currentTrack (QLabel*) - лейбл, в котором будет отображаться текущий трек;
- playlistView (QTableView*) - таблица, отвечающая за отображение плейлиста.
SimplePlayer.pro
В профайле проекта не забудьте подключить модуль multimedia, иначе классы QMediaPlayer и QMediaPlaylist будут недоступны.
widget.h
Для реализации отображения плейлиста, придется использовать QStandardItemModel. В неё будут помещаться пути к аудио файлам, а также имена аудио файлов. В первой колонке будет имя аудио файла, а во второй будет полный путь, но данная колонка будет скрыта в объекте QTableView, который будет отвечать за отображение плейлиста.
Также пути к файлом в качестве медиа источников необходимо будет поместить в объект QMediaPlaylist, который будет помещён в QMediaPlayer.
Указатели на эти объекты помещаются в заголовочном файле окна приложения. Также здесь присутствует автогенерированый через дизайнер интерфейсов слот для обработки нажатия по кнопке добавления треков в плейлист.
widget.cpp
Для реализации плеера необходимо инициализировать объекты QMediaPlayer, QMediaPlaylist и QStandardItemModel, которые были объявлены в заголовочном файле окна приложения. В первой половине конструктора производится настройка внешнего вида таблицы для отображения плейлиста, тогда как во второй настройка самого плеера. Управление плеером осуществляется через кнопки, которые подключены к управляющим слотам m_playlist (для навигации) и m_player (для запуска/паузы/остановки).
При изменении текущего трека, плеер автоматически завершает воспроизведение того, трека который был до изменения, и запускает на воспроизведение новый трек.
В силу того, что QMediaPlaylist не имеет модели для отображения в таблице, мы воспользуемся классом QStandardItemModel, поэтому придётся добавлять данные о путях к файлам и туда, и туда.
После того, как приложение запустится, Вы сможете открыть mp3 треки и прослушать их.
Видеоурок
Рекомендуем хостинг TIMEWEB
Стабильный хостинг, на котором располагается социальная сеть EVILEG. Для проектов на Django рекомендуем VDS хостинг.
Но у меня также возникло несколько проблем. Не знаю как правильно реализовать метод удаления только выделенной песни (метод визуально со списка песню удаляет, но в самой программе остается, т.е. к примеру я добавил треки №1, 2 и 3, затем трек №1 удаляю, тем самым со списка он удаляется, но если я нажимаю воспроизвести трек №2, то воспроизводится удаленный трек №1). Также, не знаю как реалиализовать, чтоб во время проигрывания песни по компоненте TrackBar перемещащлся ползунок и чтоб его можн было перемещать и попадать в нужный участок песни. Также на знаю как сделать чтоб по окончанию песни автоматически включалась следующая. И САМОЕ ГЛАВНОЕ никак нигде не могу найти каким образом сохранять плэйлист, чтобы при следующем запуске программы его можно было бы открыть.
Ниже код программы. Также прикладываю сам проект.
Проигрыватель видео
Всем привет. Подскажите пожалуйста с чего нужно начать , что почитать и что нужно для создания.
Проигрыватель звуков
Столкнулся со следующей проблемой: необходимо воспроизводить звук в формате mp3, а возможно только.
Проигрыватель интернет-радио (клиент?)
Здравствуйте, помогите, пожалуйста, чем можете. В учебных целях необходимо написать проигрыватель.
Как написать медиа-проигрыватель с плейлистом?
Помогите пожалуйста как можно написать Медиа-плеер , желательно что бы можно было воспроизвести как.
Я думаю можно и самому определить, что плэйлист пуст. так корректнее будет. тем более если это курсовая)
По поводу удаления. ты используешь массив string[] Musicas = new string[1000];. это неправильно.
Используй списки: List Musicas=new List();
Добавляй песню в список: Musicas.Add(FileName);
Удаляй песню из списка: Musicas.RemoveAt(id);
Плэйлист можно сохранять в параметрах проекта..зайди в спойство проекта, параметры. там создай строку, и туда записывай песни.
Приложил архив с проектом.
Не совсем поня чтозначит "сам делай проверки". А я разве не это делаю?
"По поводу удаления. ты используешь массив string[] Musicas = new string[1000];. это неправильно.
Используй списки: List Musicas=new List();
Добавляй песню в список: Musicas.Add(FileName);
Удаляй песню из списка: Musicas.RemoveAt(id);"
Если изменить метод добавления - придется половину программы переписывать(((
И что такое id в строке "Musicas.RemoveAt(id);". Что вместо id надо писать?
для чего переписывать то программу? со списком будешь работать так же как и с массивом. т.е. получать название файлка Musicas[id]. id-это номер элемента в списке. т.е. 0,1,2. и т.д. Который тебе надо удалить, тот и указывай.
try<>catch<> это не то. это обработчик исключений. ты же сам можешь определить, пуст ли плэйлист или нет, например так:
Всё, никаких try<>catch<>
Что то я не совсем понял, что я должен был тут узнать.
Про плэйлисты там ничего нету. Мне надо чтоб я плэйлисты мог сохранять в файлы. А потом мог бы загружать их.
Добавлено через 13 минут
И объясните пожалуйста по подробнее как мне по другому реализовать метод добавления файлов в плэйлист.
Vladikking, а никто там конкретно про плейлисты писать и не будет. Вам же объяснили, просто используйте вместо массивов - списки, поменять недолго, и при удалении из плейлиста удаляйте не только из листбокса, но и из самого списка. Сохранять можно так как написали выше либо создать структуру\класс и хранить плейлисты в нем, что будет правильнее, сериализовать объект класса в файл и хранить в этом файле, во втором варианте возможно реализовать запуск вашей программы при открытии файла плейлиста.
Что то я не совсем понял как плэйлисты сохранять в файлы. А потом загружать их.
.
Добавлено через 1 час 23 минуты
DeKaN, Переделал методы добавления и удаления как ты и сказал. Но метод удаления все равно не работает((( Помогите пожалуйста.
Какой именно нужно указывать индекс в "Musicas.RemoveAt(индекс);" чтобы удалялась именно та песня которая выделена в плэйлисте?
Так сложилось, что большую часть жизни я пользовался Windows и привык воспроизводить аудио файлы с помощью Winamp. Он очень удобно интегрируется с командной строкой — запустил любой аудио файл и готово. После перехода на Linux и OS X (в основном по работе, но Mac использую и дома вместе с виндой) возникла острая необходимость найти альтернативу. Перепробывал большое количестко крафических плееров. Основная их проблема — это отсутствие нормальной интеграции с командной строкой и часто поддержка только одной из платформ: либо Linux, либо OS X. С консольными плеерами ситуация получше: mpg123 и mpg321 практически идеально делают именно то, что надо. Вот только появилось одно большое «но». Они не умеют играть .ogg и трекерную музыку (.it, .mod, .xm, .s3m и прочие), которой тоже накопилось достаточно и расставаться с ней совершенно не хотелось.
Дело в том, что за свою программистскую карьеру мне пришлось написать пару мультиплатформных аудио систем для игровых движков: для Linderdaum Engine и для Blippar и ещу одну небольшую для вот этой книжки. Почему бы не применить накопленный опыт, чтобы самому написать проигрыватель? Требования для плеера получились вот такими:
- работать на Windows, Linux и OS X;
- проигрывать MP3, Vorbis, WAV и максимальное разумное кол-во модульных аудио форматов;
- удобная интеграция с командной строкой;
- использовать максимум сторонних библиотех, чтобы не превращать проект в долгострой;
Плеер задумывался как модульный возможностью быстрого расширения для проигрывания других форматов и для использования разных бэк-эндов. В основе всего интерфейс источника звука, абстрактный класс iAudioSource, и интерфейс аудиосистему iAudioSubsystem.
Единственные реализации этих интерфейсов используют OpenAL для вывода звука, поскольку поддержка это API на всех трех платформах вполне достойная.
Чтобы декодировать различные форматы в PCM создаем интерфейс iWaveDataProvider.
И для удобства вот такую фабрику:
Различные реализации iWaveDataProvider используют сторонние библиотеки для декодирования аудио форматов. Получилось весьма компактно и пригодно для дальнейшего расширения функциональности.
Возможно однажды добавлю поддержку FLAC, но пока совершенно нет стимула — в домашней коллекции файлов такого формата нет.
В этом небольшом "туториале" я хочу показать вам, как разработать приложение для записи и воспроизведения аудио-файлов.
Функционал нашего приложения будет следующим:
- запись аудио
- отображение записи с возможностью ее предварительного прослушивания и последующего сохранения или удаления
- хранение аудио-файлов на сервере
- извлечение аудио-файлов, хранящихся на сервере, и их отображение в браузере
Основная технология, которую мы будем использовать, это MediaDevices . Данная технология входит в состав глобального объекта Navigator . Основным методом, предоставляемым указанным интерфейсом является getUserMedia() . Запись данных (в простых случаях вроде нашего) выполняется с помощью интерфейса MediaRecorder .
Для небольшой стилизации нашего приложения мы будем использовать Sass.
Выглядеть приложение примерно так:
Основным источником вдохновения для меня послужила эта замечательная статья.
Обратите внимание: данная статья рассчитана, преимущественно, на начинающих разработчиков, хотя, смею надеяться, что и опытные найдут в ней что-нибудь интересное.
Вы готовы? Тогда вперед!
Начнем с разработки сервера.
Сервер
Создаем директорию для проекта, переходим в нее, инициализируем проект и устанавливаем необходимые зависимости:
-
— фреймворк для Node.js , облегчающий разработку REST API — обертка над busboy для разбора данных в формате multipart/form-data , часто используемая для сохранения файлов — утилита для одновременного выполнения команд, определенных в package.json — утилита для запуска сервера для разработки (сервера, который автоматически перезапускается при изменении наблюдаемых файлов) — утилита для автоматического открытия вкладки браузера по указанному адресу — утилита для преобразования SASS в CSS
Определяем команды для запуска сервера для разработки в package.json :
В коде сервера мы будем использовать ES6-модули ( import/export ), поэтому определим в package.json тип основного файла сервера как модуль:
В качестве альтернативы для кода сервера можно использовать файл с расширением .mjs .
Давайте определимся со структурой проекта:
Изображения, которые мы будем использовать при разработке приложения, можно скачать здесь.
Приступаем к реализации.
Что должен уметь наш сервер? Многого от него не требуется: все, что он должен уметь — это обслуживать статические файлы из директорий public и uploads , а также сохранять и извлекать аудио-файлы.
Импортируем необходимые модули:
Определяем абсолютный путь к текущей (рабочей) директории:
Создаем приложение express и определяем директории со статическими файлами:
Определяем маршрут для сохранения аудио с помощью multer , используемого в качестве посредника (middleware). Аудио будет отправляться методом POST в формате multipart/form-data по адресу /save :
Определяем "роут" для извлечения сохраненных аудио и их отправки клиенту (метод — GET , адрес — /records ):
Наконец, определяем порт (по умолчанию 3000 ) и запускаем сервер:
На этом с сервером мы закончили. Переходим к клиенту.
Клиент
Весь код клиента будет находиться в директории public .
Начнем с разметки ( index.html ).
Обратите внимание на идентификаторы. Поскольку DOM-элементы с идентификаторами становятся свойствами глобального объекта window , мы сможем получать к ним доступ напрямую, т.е. без предварительного получения ссылки на элемент путем вызова таких методов как querySelector() .
Сделаем приложение красивым ( style.scss ):
Наконец, переходим к тому, ради чего мы, собственно, здесь собрались. Я, конечно же, имею ввиду клиентский скрипт. Но сначала кратко поговорим об интерфейсе MediaDevices и его методе getUserMedia() .
Интерфейс MediaDevices предоставляет доступ к медиа-устройствам пользователя, таким как камера, микрофон, а также к совместному использованию экрана. Разумеется, пользователь должен явно предоставить разрешение на такой доступ. Спецификация Media Capture and Streams определяет довольно жесткие правила на этот счет.
Метод getUserMedia() запрашивает разрешение пользователя на использование медиа устройства (камера, микрофон). Результат возвращает промис, содержащий поток (объект MediaStream ), который состоит из треков (дорожек), содержащих требуемые данные. Данный метод принимает ограничения (объект MediaStreamConstraints ), определяющий, какие типы медиа запрашиваются, а также требования для каждого типа.
В общем виде это выглядит так:
MediaRecorder — это интерфейс MediaStream Recording API представляющий функциональность для простой записи медиа. Нас интересуют такие методы указанного интерфейса, как start() и stop() , свойство state , определяющее состояние записи, а также событие dataavailable , возникающее по окончанию записи.
Определяем глобальные переменные и забавы ради добавляем в подвал текущий год:
Определяем утилиты для создания DOM-элементов и смены CSS-классов:
Определяем функцию для начала записи:
Определяем функцию обработки окончания записи:
Определяем функцию для отправки новой записи на сервер для сохранения:
Определяем функции сброса и удаления новой записи:
Для формирования списка записей, полученных от сервера, нам потребуется функция для создания относительно сложного DOM-элемента:
Готовый элемент будет выглядеть примерно так:
Определяем функцию для получения записей от сервера и формирования соответствующего списка:
Определяем функцию для запуска воспроизведения:
Наконец, добавляем кнопкам соответствующие обработчики и вызываем функцию для получения записей от сервера:
Нажатие кнопки приводит к запросу пользователя о выдаче разрешения на использование микрофона. Предоставляем программе такое разрешение. После этого начинается запись (об этом, в частности, свидетельствует красный индикатор рядом с кнопкой для закрытия вкладки и значок видеокамеры в адресной строке).
Говорим что-нибудь в микрофон и нажимаем "Стоп". Появляется блок с новой записью и возможностью ее прослушивания, сохранения или удаления.
Согласитесь, что запись аудио (и видео) с помощью технологий, предоставляемых браузером, никогда не была такой простой и доступной.
Для создания проигрывателя, будем использовать элемент управления Media Player , который поддерживает следующие форматы:
— Advanced Streaming Format (ASF)
— Video On Demand (VOD)
— Moving Picture Experts Group 1,2,3 (MPEG 1,2,3)
— Real Audio (RA)
— Real Video (RV)
— Audio – Video Interleaved (AVI)
— Quick Time (MOV)
— Musical Instrument Digital Interface (MIDI)
— Indeo 5
— Waveform Audio (WAV)
— Sound File (SND)
— UNIX audio (AU)
— Audio Interchange File Format (AIFF)
Элемент управления Media Player представляет собой ActiveX, основывающийся на компоненте DirectShow уровня DirectX Media. Первое, что необходимо сделать, создать приложение на основе диалога с помощью мастера AppWizard.Следующий шаг, добавление к проекту элемента, делается это через «Project – Add To Project – Components and Controls»
Далее в появившемся окне открываем папку «Registered ActiveX Controls», находим ссылку «Windows Media Player.lnk» и жмем Insert
Нас спросят, хотим ли мы подключить компонент? Соглашайтесь. 🙂
После, откроется окно, где Вы можете поменять имена у подключаемых файлов. Когда компонент добавлен, в нашем проекте появится два новых файла. В них находится класс CMediaPlayer, который выполняет роль оболочки для элемента Media Player, а в редакторе ресурсов появится элемент Windows Media Player. Поместите его на свой диалог, в свойствах уберите галочку с пункта «Visible».
Теперь необходимо создать указатель с типом CMediaPlayer, в файле заголовке «ИмяВашегоПроектаDlg.h» напишите следующее:
перед этим не забудьте добавить файл «mediaplayer.h»
Далее в инициализации диалога OnInitDialog() мы должны получить указатель на элемент Media Player, следующим способом:
Читайте также: