QMediaPlayer를 활용한 음악 플레이어앱 제작

이번에 만들어 본 Music Player 입니다.

[뮤직 플레이어 실행화면]

Python + PyQt5를 이용해 만들어 보았으며, 주요 기능은 아래와 같습니다.

1. 음악 파일 리스트 기능 (추가, 삭제)

2. 다양한 오디오 파일 재생 (*.wav, *.mp3, *.flac, *.ogg, 단, 코덱 필요)

3. 재생, 정지, 일시정지, 다음곡, 이전곡 재생

4. 볼륨 제어

5. 재생 옵션 (현재 한곡만, 현재 한곡 반복, 순차, 전체 반복, 랜덤)

6. 재생 진행 바를 통한 진행률 표시

구글을 통해 검색해봐도 역시나 마음에 드는 예제는 못 찾는 건지, 제 눈에는 잘 보이지 않습니다.

찾은 예제들이 단순 mp3 파일 한곡 재생 예제 밖에 없어, 한번 만들어 보았습니다.

만들고 보니 아주 쓸만하게 잘 만들어져 저도 즐겨 쓰고 있습니다.

그럼 바로 본론으로 들어가 보겠습니다.

소소코드는 2개의 파일(main.py, player.py) 로 구성되어 있습니다.

음악 플레이어는 아래 main.py 파일과 마지막에 설명하는 player.py 파일 두개만 복사해 파이썬 코드로 붙여넣기 하면 바로 실행됩니다.

당연히 main 함수의 역할을 담당하는 main.py가 파이썬 시작파일로 설정되어야 합니다.

먼저 main.py 파일의 코드를 살펴보겠습니다.

from PyQt5.QtWidgets import *
import sys
from player import *

QApplication.setAttribute(Qt.AA_EnableHighDpiScaling, True)

class CWidget(QWidget):   

    def __init__(self):
        super().__init__()
        self.player = CPlayer(self)
        self.playlist = []
        self.selectedList = [0]
        self.playOption = QMediaPlaylist.Sequential

        self.setWindowTitle('Ocean Coding School')
        self.initUI()

    def initUI(self):

        vbox = QVBoxLayout()        

        # 1.Play List
        box = QVBoxLayout()
        gb = QGroupBox('Play List')
        vbox.addWidget(gb)
        
        self.table = QTableWidget(0, 2, self)             
        self.table.setHorizontalHeaderItem(0, QTableWidgetItem('Title'))
        self.table.setHorizontalHeaderItem(1, QTableWidgetItem('Progress')) 
        # read only
        self.table.setEditTriggers(QAbstractItemView.NoEditTriggers)
        # single row selection
        self.table.setSelectionBehavior(QAbstractItemView.SelectRows)
        # signal 
        self.table.itemSelectionChanged.connect(self.tableChanged)
        self.table.itemDoubleClicked.connect(self.tableDbClicked)
        box.addWidget(self.table)
        
        hbox = QHBoxLayout()
        btnAdd = QPushButton('Add List')
        btnDel = QPushButton('Del List')
        btnAdd.clicked.connect(self.addList)
        btnDel.clicked.connect(self.delList)
        hbox.addWidget(btnAdd)
        hbox.addWidget(btnDel)   
        
        box.addLayout(hbox)
        gb.setLayout(box)        
        
        # 2.Play Control
        box = QHBoxLayout()
        gb = QGroupBox('Play Control')
        vbox.addWidget(gb)

        text = ['◀◀', '▶', '⏸', '▶▶', '■']
        grp = QButtonGroup(self)
        for i in range(len(text)):
            btn = QPushButton(text[i], self)            
            grp.addButton(btn, i)
            box.addWidget(btn)
        grp.buttonClicked[int].connect(self.btnClicked)

        # Volume
        self.slider = QSlider(Qt.Horizontal, self)
        self.slider.setRange(0,100)
        self.slider.setValue(50)
        self.slider.valueChanged[int].connect(self.volumeChanged)
        box.addWidget(self.slider)        
        gb.setLayout(box)

        # 3.Play Option
        box = QHBoxLayout()
        gb = QGroupBox('Play Option')
        vbox.addWidget(gb)       

        str = ['current item once', 'current item in loop', 'sequential', 'loop', 'random']
        grp = QButtonGroup(self)
        for i in range(len(str)):
            btn = QRadioButton(str[i], self)
            if i==QMediaPlaylist.Sequential:
                btn.setChecked(True)
            grp.addButton(btn, i)  
            box.addWidget(btn)        
        
        grp.buttonClicked[int].connect(self.radClicked)
            
        gb.setLayout(box)               
        
        self.setLayout(vbox)
        self.show()

    def tableChanged(self):
        self.selectedList.clear()        
        for item in self.table.selectedIndexes():
            self.selectedList.append(item.row())
        
        self.selectedList = list(set(self.selectedList))
        
        if self.table.rowCount()!=0 and len(self.selectedList) == 0:
            self.selectedList.append(0)
        #print(self.selectedList)

    def addList(self):
        files = QFileDialog.getOpenFileNames(self
                                             , 'Select one or more files to open'
                                             , ''
                                             , 'Sound (*.mp3 *.wav *.ogg *.flac *.wma)')        
        cnt = len(files[0])       
        row = self.table.rowCount()        
        self.table.setRowCount(row + cnt)
        for i in range(row, row+cnt):
            self.table.setItem(i,0, QTableWidgetItem(files[0][i-row]))
            pbar = QProgressBar(self.table)
            pbar.setAlignment(Qt.AlignCenter)            
            self.table.setCellWidget(i,1, pbar)
            
        self.createPlaylist()       

    def delList(self):        
        row = self.table.rowCount()      

        index = []       
        for item in self.table.selectedIndexes():
            index.append(item.row())        
        
        index = list(set(index))        
        index.reverse()        
        for i in index:
            self.table.removeRow(i)
        
        self.createPlaylist()       

    def btnClicked(self, id):
        
        if id==0: #◀◀
            self.player.prev()
        elif id==1: #▶
            if self.table.rowCount()>0:
                self.player.play(self.playlist, self.selectedList[0], self.playOption)
        elif id==2: #⏸
            self.player.pause()
        elif id==3: #▶▶
            self.player.next()
        else: #■
            self.player.stop()

    def tableDbClicked(self, e):
        self.player.play(self.playlist, self.selectedList[0], self.playOption)

    def volumeChanged(self):
        self.player.upateVolume(self.slider.value())

    def radClicked(self, id):
        self.playOption = id
        self.player.updatePlayMode(id)

    def paintEvent(self, e):
        self.table.setColumnWidth(0, self.table.width()*0.7)
        self.table.setColumnWidth(1, self.table.width()*0.2)

    def createPlaylist(self):
        self.playlist.clear()
        for i in range(self.table.rowCount()):
            self.playlist.append(self.table.item(i,0).text())

        #print(self.playlist)

    def updateMediaChanged(self, index):
        if index>=0:
            self.table.selectRow(index)            

    def updateDurationChanged(self, index, msec):        
        #print('index:',index, 'duration:', msec)
        self.pbar = self.table.cellWidget(index, 1)
        if self.pbar:
            self.pbar.setRange(0, msec)       

    def updatePositionChanged(self, index, msec):
        #print('index:',index, 'position:', msec)
        self.pbar = self.table.cellWidget(index, 1)
        if self.pbar:
            self.pbar.setValue(msec)


if __name__ == '__main__':
    app = QApplication(sys.argv)
    w = CWidget()
    sys.exit(app.exec_())

main.py 파일은 윈도우 창 생성을 담당하는 코드입니다.

대부분의 코드는 CWidget 이라는 QWidget으로부터 상속받은 클래스로 구성되어 있습니다.

코드가 조금 길어보이는데, GUI를 위해 버튼이나, 테이블, 그룹박스등을 생성하는 코드가 반정도 차지하므로 어려운 코드는 아닙니다.

Qt의 Designer로 GUI(Graphic User Interface) 컨트롤을 배치하면, 코드의 양은 줄겠지만, 개인적으로 직접 코드를 이용 컨트롤, 윈도우를 생성하는 방법을 선호합니다.

9번 라인 CWidget 클래스의 생성자 함수부터 살펴보겠습니다.

실제 음악 재생과 관련된 player.py 파일의 CPlayer 클래스, 및 음원 리스트를 저장하기 위한 리스트를 멤버 변수로 선언합니다.

그리고 initUI() 함수를 호출해 GUI를 구성합니다.

19번 라인 initUI() 함수는 각종 컨트롤을 배치하여 윈도우 창을 구성하는 함수입니다.

24~49번 라인은 QGroupbox, QTableWidget, QPushButton 등을 사용해 아래 Player List 창을 구성합니다.

[Play List 구성]

Play List 구성 절차

1. 그룹박스 및 레이아웃 박스 생성 연결

2. 음악 리스트 (QTableWidget) 생성 (읽기전용, 한줄 선택)

3. 음악 리스트 시그널, 슬롯 연결 (선택항목 변경, 더블 클릭)

4. 버튼 (음악 리스트 추가, 삭제) 생성 및 시그널 슬롯 연결


52~70번 라인은 QGroupBox, QPushButton, QSlider 등을 이용해 아래 Play Control 창을 생성합니다.

[Play Control 구성]

Play Control 구성 절차

1. 그룹박스 및 레이아웃 박스 생성 연결

2. 푸시버튼 생성 후 버튼 그룹으로 묶음 (버튼 마다 id 부여)

3. 버튼 그룹 클릭시 시그널, 슬롯 처리 (슬롯 호출시 버튼 id 전달)

4. 볼륨 슬라이더 생성 및 값 변경시 시그널, 슬롯 처리

일반적으로 버튼을 여러 개 만드는 경우, 해당 버튼이 눌러졌을때 수행되는 동작을 정의하기위해 버튼마다 클릭시 호출되는 함수를 따로 생성하면 코드가 지저분해지는 경향이 있습니다.

왜냐하면, 버튼의 수만큼 함수가 만들어지기 때문입니다.

이런 경우, 버튼들을 QButtonGroup 클래스를 이용, 그룹으로 묶어 id를 부여해 관리하면 해당 버튼이 눌러진 경우 하나의 함수로 버튼의 id를 체크해 어떤 버튼이 눌러졌는지 처리할 수 있습니다.

MS의 C++ GUI 라이브러리인 MFC는 ON_CONTROL_RANGE() 매크로 함수를 이용해 버튼 시작 ID와 끝 ID를 이용해 처리하는 반면, Qt는 좀 더 사용하기 편리한 기능을 제공합니다.

73~88번 라인은 QGroupbox, GRadioButton 클래스를 이용 Play Option 창을 구성합니다.

[Play Option 구성]

Play Option 구성 절차

1. 그룹박스 및 레이아웃 박스 생성 연결

2. 라디오 버튼 생성 후 버튼 그룹으로 묶기 (Default는 순차재생으로)

3. 버튼 그룹 클릭시, 시그널, 슬롯 처리 (슬롯 호출시 버튼 id 전달)


이제 모든 컨트롤이 vbox(수직레이아웃 박스)에 배치되었습니다.

마지막으로 self.setLayout(vbox) 코드를 이용 윈도우에 QVBoxLayout을 배치하면 끝입니다.

+

+

=

[GUI 완성 모습]

Qt의 QLayoutBox 클래스는 컨트롤 배치를 쉽게하고, 윈도우 크기 변경시 자동으로 Resizing 되는 편의성을 제공해 줍니다.

MFC에도 이런 클래스가 하나 있으면 얼마나 행복할까 생각해 봅니다...

여기까지가 main.py 파일의 CWidget 클래스 생성자 호출 부터 이어지는 initUI() 함수의 설명이었습니다.

이제부터 코드 설명은 코드 라인 순서가 아닌, 실제 플레이어를 동작하는 행위 (이벤트 처리)를 기준으로 코드와 연계해 설명드리겠습니다.

즉, 음악 파일을 추가하고 음악 리스트의 파일을 재생, 정지하는 행위를 하는 사용자 관점의 순서로 코드를 분석해 보겠습니다.

[사용자 관점 코드 분석]

사용자는 먼저 음원 파일을 추가하려 하겠죠.

1. Add List 버튼 클릭

104번 라인의 addList() 슬롯 함수가 호출 됩니다.

QFileDialog 로 파일 열기 창을 생성해, 파일을 하나 또는 다수를 선택합니다.

[파일 열기 창]

불러들인 음원 파일의 수를 구하고 반복문을 이용해 QTableWidget에 추가합니다.

[음원 파일 추가]

주의할 점은 음원파일이 있던 상태에서 다시 추가한 경우를 생각해야 합니다. 즉 음원 파일을 추가한 후 더 추가하는 경우이죠.

따라서 QTableWidget에 음원파일을 추가할 때,  항상 0번 행부터 추가하는 것이 아님을 잘 생각해 처리해야 합니다.


2. Del List 버튼 클릭

다음은 음원 리스트에서 하나, 또는 다수의 음원을 삭제하는 경우입니다.

120번 라인의 delList() 함수가 호출됩니다.

현재 음원 리스트의 개수를 구한 후 삭제하려는 음원 파일의 인덱스 번호를 수집해 리스트에 저장합니다.

예를 들어 [0,1,2] 번 음원을 리스트에서 삭제한다면 반대로 [2,1,0] 번의 순서대로 반복하며 QTableWidget에서 해당 행을 삭제해야 합니다.

왜냐하면 0번 리스트의 음원이 먼저 삭제되면 뒷 행 번호인 1번의 음원이 바로 0번으로 바뀌기 때문에 제대로 삭제되지 않는 문제가 발생합니다.

따라서 QTableWidget 음원리스트의 아래에서부터 삭제를 진행합니다.

즉 선택된 QTableWidget의 음원을 삭제하기 위해, 모든 선택된 행의 번호를 파악하고 순서를 내림차순 정렬해 아래쪽부터 삭제를 진행해야 합니다.


3. Play, Stop 등 재생 버튼 클릭

이제 음원리스트에 재생목록이 저장되어 있으니 음악을 들어 보겠습니다.

재생, 정지, 다음, 이전, 일시정지 버튼을 누른 경우입니다.

134번 라인의 btnClicked(id) 함수가 호출됩니다.

각 재생관련 버튼을 누르면 발생되는 함수이며, 전달인자로 들어오는 id의 구분은 아래와 같습니다.

뒤로 버튼(◀◀, id 0)
재생 버튼(▶, id 1)
일시정지 버튼(⏸, id 2)
앞으로 버튼(▶▶, id 3)
정지 버튼(■, id 4)

이젠 player.py 파일의 코드를 살펴볼 시점입니다.

QMediaPlayer, QMediaPlayList 등의 클래스를 이용해 실제 음원 파일을 재생하는 역할을 담당합니다.

코드를 한번 살펴보겠습니다.

from PyQt5.QtMultimedia import QMediaPlaylist, QMediaContent, QMediaPlayer
from PyQt5.QtCore import Qt, QUrl

class CPlayer:

    def __init__(self, parent):
        # 윈도우 객체
        self.parent = parent

        self.player = QMediaPlayer()
        self.player.currentMediaChanged.connect(self.mediaChanged)
        self.player.durationChanged.connect(self.durationChanged)
        self.player.positionChanged.connect(self.positionChanged)
        
        self.playlist = QMediaPlaylist()

    def play(self, playlists, startRow=0, option=QMediaPlaylist.Sequential):       
        if self.player.state() == QMediaPlayer.PausedState:
            self.player.play()
        else:              
            self.createPlaylist(playlists, startRow, option)            
            self.player.setPlaylist(self.playlist)
            self.playlist.setCurrentIndex(startRow)
            self.player.play()          
        
    def pause(self):
        self.player.pause()         

    def stop(self):
        self.player.stop()

    def prev(self):        
        self.playlist.previous()     

    def next(self):
        self.playlist.next()

    def createPlaylist(self, playlists, startRow=0, option=QMediaPlaylist.Sequential):        
        self.playlist.clear()      

        for path in playlists:
            url = QUrl.fromLocalFile(path)
            self.playlist.addMedia(QMediaContent(url))

        self.playlist.setPlaybackMode(option)

    def updatePlayMode(self, option):
        self.playlist.setPlaybackMode(option)

    def upateVolume(self, vol):
        self.player.setVolume(vol)

    def mediaChanged(self, e):
        self.parent.updateMediaChanged(self.playlist.currentIndex())       

    def durationChanged(self, msec):
        if msec>0:
            self.parent.updateDurationChanged(self.playlist.currentIndex(), msec)

    def positionChanged(self, msec):
        if msec>0:
            self.parent.updatePositionChanged(self.playlist.currentIndex(), msec)

CPlayer 클래스가 해당파일의 전부입니다.

main.py 의 CWidget 클래스 멤버변수인 self.player가 바로 이 클래스(CPlayer)의 객체 입니다.

이제 재생 버튼을 누르면 CPlayer 클래스의 play() 함수가 호출됩니다.

QMediaPlayList(음원 목록)를 생성하고, QMediaPlayer에 음원 목록을 등록한 후 소리를 재생하는 방식입니다.

주의해야 할 부분은 소리 재생 옵션 (한곡만, 반복재생 등)을 변경하면 호출되는 47번 라인  updatePlayerMode() 함수를 통해 QMediaPlayList의 PlaybackMode를 변경해야 하는 사실입니다.

음악파일을 재생하는 것은 QMediaPlayList를 통해 만든 음원리스트를 QMediaPlayer 에 등록하고, QMediaPlayer 클래스가 제공하는 play, pause, stop 함수를 이용해 쉽게 구현이 가능합니다.


다음으로 고민해볼 문제는 현재 곡을 재생하고 난 후 다음 곡이 재생될때 이를 감지해 화면에서 다음곡으로 선택 포커스를 넘기는 문제입니다.

위 그림에서 1번 음원 재생이 끝나면 2번 행으로 QTableWidget의 포커스를 이동해야 합니다.

11번 라인 QMediaPlayer 클래스의 currentMediaChanged() 시그널을 이용하면 가능합니다.

여기서 잠시 PyQt 클래스 도움말 활용법에 대한 팁을 소개하고자 합니다.

Qt는 C++로 만들어져 있는 클래스 모음입니다. 이를 Python에서 사용하기위해 영국의 Riverbank Computing 이라는 회사에서 Qt를 Python Binding으로 만든 것이 PyQt 입니다.

아래는 Qt 제작사 도움말이며, 저는 개인적으로 원제작사의 C++ 코드로 작성된 클래스 도움말을 보며 PyQt 코드 작성에 참조하고 있습니다.

Qt 문서에 아래와 같이 C++ 코드로 설명 되어 있습니다.

참조로 C++ 함수 선언은 리턴타입 + 함수명 + 전달인자() 로 구성됩니다.

[signal] void QMediaPlayer::currentMediaChanged(const QMediaContent &media)

Signals that the current playing content has been changed to media.

다음은 음원 파일의 재생시간을 알아내는 방법입니다.

12번 라인 durationChanged() 시그널을 이용합니다.

[signal] void QMediaPlayer::durationChanged(qint64 duration)

Signal the duration of the content has changed to duration, expressed in milliseconds.

마지막으로 현재 음원이 어디쯤 재생되고 있는지 알아야 합니다.

어디쯤인지 알아야 QProgressBar 로 진행률을 표시할 수 있겠죠.

13번 라인 positionChanged() 시그널을 이용합니다.

[signal] void QMediaPlayer::positionChanged(qint64 position)

Signal the position of the content has changed to position, expressed in milliseconds.

요약해 보자면 currentMediaChanged를 이용해 다음곡의 포커스를 이동하고, durationChanged를 이용 재생시간을 구해 QProgressBar의 시작, 끝 값을 설정합니다.

단위는 밀리초(1/1000) 단위로 얻습니다.

다음으로 positionChanged를 이용해 현재 재생시간(위치)을 알아내어 QProgressBar의 serValue() 함수를 통해 값을 변경하면 됩니다.


다 만들고 사용하다보니, "단축키를 추가하면 좋을 것 같은데" 라는 아쉬움이 남습니다.

이상 설명을 마칩니다.

실행파일 링크 : 음악플레이어

• 개발 환경

1. 운영체제 : MS Windows 10 Pro
2. 개발 언어 : Python 3.7 (32bit), PyQt5 (5.11.3)
3. 개발 도구 : MS Visual Studio 2017 Pro