IOS開發之簡單音頻播放器

        今天第一次接觸IOS開發的UI部分，以前學OC的時候一直在模擬的使用Target-Action回調模式，今天算是真正的用了一次。爲了熟悉一下基本控件的使用方法，和UI部分的回調，下面開發了一個特別簡易的音頻播放器，來犒勞一下本身這一天的UI學習成果。在用到UI的控件時若是很好的理解以前博客在OC中的Target-Action回調模式，感受控件的用法會很順手。下面的簡易播放器沒有用到多高深的技術，只是一些基本控件和View的使用。

        話很少說簡單的介紹一下今天的音頻播放器。在播放器中咱們用到了UIProgressView(進度條)來顯示音頻的播放進度，用UILabel顯示播放的當前時間和總時間。用UIImageView和UIImagel來加入圖片，用UISegmentedControl來控制播放和暫停，用滑動器UISlider來控制音頻的音量。上面的執行組件都是UIKit中的組件，咱們要定時的獲取音頻的播放時間，咱們還要用到NSTimer來定時獲取CurrentTime。播放器怎麼能少的了關鍵的組件呢，咱們還須要引入框架AVFoundation.framework。咱們會用到組件AVAudioPlayer來播放咱們的音頻。

        下面是簡易音頻播放器的截圖：

               ​    ​    ​    ​    ​    ​           

    ​1.功能介紹：

    ​    ​點擊播放會播放默認歌曲，同時顯示播放進度和播放當前時間，下面的slider能夠調節音頻的聲音大小。

    ​

    ​2.主要開發過程

    ​    ​    ​1.在咱們的XCode中新建一個SingleView的iPhone的工程，爲了更好的理解和配置控件和view,就不使用storyboard來進行控件的拖拽啦。在咱們新建工程下面的ViewController.m編寫咱們的代碼，爲了隱藏咱們音頻播放器使用的控件和控件回調的方法，咱們在ViewController.m中用延展來對咱們的組件和方法進行聲明。代碼以下：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38

#import "ViewController.h"   @interface ViewController ()   //添加背景用的ImageView @property (strong, nonatomic) UIImageView *backView;   //播放進度條 @property (strong, nonatomic) UIProgressView *progress;   //選項卡按鈕，賦值播放和暫停 @property (strong, nonatomic) UISegmentedControl * segment;   //slider，用滑動器來設置音量的大小 @property (strong, nonatomic) UISlider *slider;   //timer，來更新歌曲的當前時間 @property (strong, nonatomic) NSTimer *timer;   //顯示時間的lable @property (strong, nonatomic) UILabel *label;   //加入圖片，中間的圖片 @property (strong, nonatomic) UIImageView *imageView;   //聲明播放器，來播放咱們的音頻文件 @property (strong, nonatomic) AVAudioPlayer *player;   //在暫停和播放時回調此按鈕 -( void )tapSegment;   //更新歌曲時間 -( void ) time ;   //改變聲音大小 -( void ) changeVo;   @end

 

    ​    ​2.上面是咱們的延展部分，來進行咱們的組件的聲明和方法的聲明，具體的實現就寫在本文件中的@implementation中，咱們把組件的實現和配置寫在-(void) viewDidLoad;方法中，該方法會在主視圖加載完畢後執行。在編寫實現代碼以前咱們要把咱們用到的媒體文件拖入到咱們的Project中，下面是具體代碼的實現。

    ​    ​    ​1.下面的代碼是爲咱們的應用添加背景圖片，也就是咱們上面圖片中的黑色背景圖片，在初始化ImageView的時候咱們知道view的位置和大小CGRectMack(x, y, width, height); 用Image來經過圖片文件的名稱來載入咱們的圖片，把圖片視圖插入到主視圖的最底層，同時設置其index來實現，代碼以下。

1 2 3 4 5 6 7 8 9

/*添加背景圖片*/ //初始化ImageView,並設置大小 self.backView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 20, 320, 480)]; //加載圖片，咱們的圖片名爲background UIImage *backImage = [UIImage imageNamed:@ "background" ]; //添加背景圖片到ImageView self.backView.image = backImage; //把ImageView添加到view的最底層 [self.view insertSubview:self.backView atIndex:0];

 

   ​    ​    ​2.初始化咱們的進度條並設置進度條的位置和大小，對進度值初始化爲零。同時把進度條經過addSubView加入到咱們的主視圖中

1 2 3 4

/*實例化進度條,並添加到主視圖*/ self.progress = [[UIProgressView alloc] initWithFrame:CGRectMake(30, 60, 240, 10)]; [self.view addSubview:self.progress]; self.progress.progress = 0;

 

    ​    ​    ​3.添加中間的圖片，和添加背景圖片類似，在這就不贅述了代碼以下：

1 2 3 4 5

//添加中間的圖片    self.imageView = [[UIImageView alloc] initWithFrame:CGRectMake(80, 90, 160, 150)];    UIImage *image = [UIImage imageNamed:@ "image.png" ];    self.imageView.image = image;    [self.view addSubview:self.imageView];

    ​    ​    ​

    ​    ​    ​4.初始化咱們的segment, 在初始化segment的同時，咱們經過便利初始化方法來指定有幾個按鍵和每一個按鍵中的值。配置的時候咱們能夠經過tintColor來設置咱們segment的顏色，經過Target-Action來註冊segment要回調的方法，同時指定回調的事件，咱們設置的時UIControlEventValueChange,就是當segment的selectedSegmentIndex改變時,調用咱們註冊的方法。代碼以下：   ​    ​

1 2 3 4 5 6 7

//添加segmentControl self.segment = [[UISegmentedControl alloc] initWithItems:@[@ "Play" , @ "Pause" ]]; self.segment.frame = CGRectMake(110, 255, 100, 40); self.segment.tintColor = [UIColor whiteColor]; //註冊回調方法，在segment的值改變的時候回調註冊的方法 [self.segment addTarget:self action:@selector(tapSegment) forControlEvents:UIControlEventValueChanged]; [self.view addSubview:self.segment];

 

    ​    ​    ​5.下面的代碼是要初始化並配置咱們的音頻播放器組件，配置的時候指定咱們音頻所在路徑的url,而且回寫播放的錯誤代碼以下

1 2 3 4 5 6 7 8 9

//配置播放器 NSBundle *bundle = [NSBundle mainBundle]; NSString * path = [bundle pathForResource:@ "music"  ofType:@ "mp3" ]; NSURL *musicURL = [NSURL fileURLWithPath:path]; NSError *error; self.player = [[AVAudioPlayer alloc] initWithContentsOfURL:musicURL error:&error]; if  (self.player == nil) {      NSLog(@ "error = %@" , [error localizedDescription]); }

 

    ​    ​    ​6.設置定時器，並註冊咱們要間隔調用的方法。下面的定時器是1秒中重複調用咱們當前view中的time方法，在time方法中咱們會獲取當前音頻的當前播放時間，並在lable中顯示，稍後會提到    ​

1 2	//設置時間，每一秒鐘調用一次綁定的方法 self.timer = [NSTimer scheduledTimerWithTimeInterval:1 target:self selector:@selector( time ) userInfo:nil repeats:YES];

    ​    ​    ​

    ​    ​    ​7.添加咱們的音量控制組件，並綁定當slider的值改變是調用哪個方法。同時指定slider的最大值和最小值，代碼以下：

1 2 3 4 5 6 7 8

//添加slider self.slider = [[UISlider alloc] initWithFrame:CGRectMake(100,300, 120 , 50)]; [self.slider addTarget:self action:@selector(changeVo) forControlEvents:UIControlEventValueChanged];   [self.view addSubview:self.slider]; //設置slider最小值和最大值 self.slider.minimumValue = 1; self.slider.maximumValue = 10;

 

    ​    ​3.組件初始化和配置完畢，接下來咱們就得實現各控件要回調的方法。

    ​    ​    ​1.當slider的值改變是咱們要調用的方法以下，就是要設置一下音頻播放器的聲音，代碼以下：

1 2 3 4 5

//改變聲音 -( void )changeVo {      self.player.volume = self.slider.value; }

    ​    ​    ​

    ​    ​    ​2.定時器定時調用的方法以下，在此方法中咱們要獲取音頻的總時間和當前播放時間，並把秒轉換成分鐘（下面的代碼沒有使用NSDateFormat來轉換時間，讀者能夠用本身的方法來轉換），轉換完之後在label中顯示當前時間和總時間，代碼以下

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21

//更新時間 -( void )  time {      //獲取音頻的總時間      NSTimeInterval totalTimer = self.player.duration;      //獲取音頻的當前時間      NSTimeInterval currentTime = self.player.currentTime;      //根據時間比設置進度條的進度      self.progress.progress = (currentTime/totalTimer);            //把秒轉換成分鐘      int currentM = currentTime/60;      currentTime = ( int )currentTime%60;            int totalM = totalTimer/60;      totalTimer = ( int )totalTimer%60;            //把時間顯示在lable上      NSString *timeString = [NSString stringWithFormat:@ "%02.0f:%02.0f|%02.0f:%02.0f" ,currentM, currentTime, totalM,totalTimer];      self.label.text = timeString; }

    ​    ​    ​3.下面是segment要回調的方法根據segment的selectedSegmentIndex來設置播放器的播放仍是中止，代碼以下：

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15

//segment所回調的方法 -( void ) tapSegment {      int  isOn = self.segment.selectedSegmentIndex;      if  (isOn == 0)      {          [self.player play];                }      else      {          [self.player pause];      }   }

​

    ​    ​    ​以上是整個簡易播放器的代碼，覺得功能特別簡單因此代碼也很少。主要經過上面的簡易播放器來熟悉一下IOS開發中控件和view的使用流程，筆者也在一直學習，水平有限，歡迎批評指正。