2015年8月27日 星期四

RTSP player with FFMEPG video streaming example step-by-step

操作環境:Mac OS 10.10.4、Xcode 6.4
準備工具:一台 wifi 攝影機。eg. SJ4000。


以下的例子說明如何用 DFURTSPPlayer 來呈現即時的影像。
  1. 找到該 player :https://github.com/durfu/DFURTSPPlayer
  2. 在網頁的右邊,複製 https 連結。
  3. Clone 這個專案:開啟 Mac 上的 Terminal ,執行
    git clone https://github.com/durfu/DFURTSPPlayer.git
  4. 下載下來後,用 Xcode 開啟該專案。
  5. Wifi 連線至使用 RTSP 做影像串流的攝影機
  6. 修改這段程式
  7. 連線 url 改至該台 wifi 攝影機的影片串流位址
  8. Xcode 執行專案起來看看 (Command + R)。

確認我們要用的功能正常後,接下來就是要建立自己的 view 跟把所需要的 library 放進來啦。
  1. 建一個新專案
    按「Next」後,再按「Create」。
  2. 首先建立該 library 專用的 Group
    建 Library and FFMpeg Group 完後:

  3. 依照建出的 Group 架構建立實體資料夾
  4. 把 DFURTSPPlayer 專案內用到的 library 複製到 FFMpeg 下,以後比較好整理檔案。
  5. 在 Xcode 內的 FFMpeg group 下,建立一樣的架構。
  6. 加進所需要的 Frameworks ,總共三個 dylib 檔。
  7. 加完後專案會看起來像這樣
  8. 做好分類,移到 Frameworks group 下
  9. 告訴 Xcode , library 的 h 檔要在哪找
  10. 此時 build (Command + B) 會出現錯誤
  11. 解決方法:在 Compile Sources 的 Compile Flags 加入參數 "-fno-objc-arc"
  12. 接下來,在目前的狀況下,把 DFUViewController.h 跟 DFUViewController.m 的內容完整複製。要注意如果內容有 DFUViewController 要改成 ViewController (有已存在的專案,就自行比對,把需要的 code 複製過來。)
  13. 在新版的 Xcode ,我們不需要 dealloc 這個 method,所以從 ViewController.m 拿掉。 
  14. 因為 DFURTSPPlayer 介面是用 xib 的方式,而我們的是 storyboard ,所以我們的程式碼會長這樣。(initWithNibName method 可以整段拿掉)
  15. 此外,該 player 的 view controller 有 UIImageView, UILabel, and UIButton ,所以同樣在我們的 storyboard 內 view controller 分別加入這三個 elements。
  16. 分別連結 image view, label, and button。 eg.
    完成後長這樣
  17. 執行後。看起來影片跟原本的不太一樣。
  18. 調整 ImageView 的 constraints
  19. 再執行後
  20. 這一個即時影像串流就完成了。

2 則留言:

  1. 你好!請問步驟7. 連線 url 改至該台 wifi 攝影機的影片串流位址中,應怎樣知道該台wifi攝影機的串流位址? 感謝!

    回覆刪除
    回覆
    1. 您好,新年快樂!
      連線上攝影機後,開啟Mac上的內建程式「Terminal」,指令下 ifconfig,可以列出目前連線網路相關的資訊。

      刪除