hollywis's diary (はりうすブログ)

はりうすの活動日記です

渋谷のスクランブル交差点と同期するLED信号機を作った話 作業メモ編: Swiftとの連携、スクショ等 | さいぞうのArduino初心者日記 8

Arudinoのチュートリアルをやる連載の8回目です。

f:id:hollywis:20160204085013j:plain今回から完成したものを見せる本編と、作業中のいろいろを書くメモをわけてみます。

コンテンツの水増し。

こちらは技術者、実際にやってみたい人向けの作業メモです。

内容

Arudinoチュートリアル的にはここでやるのは、複数のLEDをついでの信号機ということになっています。

ただし、あまり面白くないので、実際の渋谷のスクランブル交差点信号機に同期して動くLED信号機を作ってみたいと思います。

方法

公開されているライブカメラの映像を使います。

渋谷のスクランブル交差点のリアルタイムな映像は、ネット上で公開されています。 そこで、それを利用して、以下の流れでできると思いました。

  1. ブラウザ等で映像を開く(PC側の処理)

  2. スクリーンショットとる(PC側の処理)

  3. 画像処理(ってほどじゃないけど)で信号の色か、人の流れを見て、赤、青、できたら黄色信号を判別(PC側の処理)

  4. Arduinoにシリアル通信でその情報を送る(PC側の処理)

  5. LED光らせる(Arduinoの処理)

例によって面白いところはほとんどパソコン側のプログラミングです。

Arduinoの方のチュートリアルが進んでないので、こうなっちゃいます。

早く先に進みたい!

前回までは、パソコン側はRubyでいろいろ処理してました。

hollywis.hatenablog.com

でもこれも飽きてきたので、最近いじってるSwiftで作るOSXアプリでやってみたいとおもいます。

ソースコード

PC側(Swift)はこちら

https://bitbucket.org/aoyagikwansei/traficsignalsyncaruino

Arudinoスケッチはこちら

<まだない>

作業

SwiftArduinoのシリアル通信

最初にやり方だけ調査。

適当にググると、IOKITというライブラリを使えばいいらしい。じゃあこれでいいや。

実は今手元にArduinoがないので次に進む。

参考 Mac OS X Drivers for CH340 / CH341 / PL2303 USB to RS-232 Devices

Macと色々なものをつなげる話。2014 - Qiita

ライブカメラ

適当にググってください。

渋谷駅前の交差点ので、ちょど利用できそうなやつがあったので、この記事はそれをつかいます。

しかし、そのサイトは映像の2次利用をしつこく禁止しています。

なので、この記事では一般的なライブカメラ映像を使う、という体でかきます。

Swiftで画面キャプチャ

ググると、iOSのやつはたくさんでてくるけど、OSXのやつはあまりない。

これとか 画面スクリーンキャプチャ取得 - Swiftサラリーマン

 
参考になりそうなの

WKWebViewの使い方 SwiftでWKWebViewを使ってみた - Qiita

WKWebView(WebKit)とSwiftでウェブページを表示 | EasyRamble

GitHub - ShingoFukuyama/WKWebViewTips: WKWebView Tips (iOS 8.1.0)

なんか上記のとおりつくっても表示されないなーと2時間くらいハマったけど、 この記事のようにNSAppTransportSecurityの設定をしたらできた。 SwiftでWebView(1) - リハビリエンジニア

WKWebViewのなかみを保存 swift - WKWebView Screenshots - Stack Overflow

GitHub - lemonmojo/WKWebView-Screenshot: WKWebView+Screenshot provides simple methods that use private(!) APIs of the WebKit framework to capture a screenshot of a WKWebView running on OS X.

ここにのっている方法は、OSXのプライベートなAPI?を使っているとのことで、AppStore公開申請を出しても通らない。 個人的に使うだけのアプリにはこれでいいらしいので、やってみる。

SwiftからObjective-Cのコードを使う方法 Objective-CベースのプロジェクトからSwiftのクラスを呼び出す - Qiita

WKWebView-Screenshotで使ってたdispatch_timeのswiftでの書き方 Swiftでdispatch_afterを使う - Qiita

なんと、上記の方法では、動画のスクショがとれない? iframeがダメなのか? media要素がだめなのか?

WKWebViewではなく、画面全体のスクリーンショットを取るアプローチに変更する。

GitHub - Arasthel/SayCheese: A screenshot taking app written in Swift

うごかそうとしたらこれになった

初めてのCocoaPodsでLinker command failed with exit code 1でハマる | 生きる

SayCheeseのコードを細かく追っていくと、こんなのが!

 system("screencapture -c -x");
 let imageFromClipboard = NSImage(pasteboard: NSPasteboard.generalPasteboard())

これだけの事だったのか.. osxにscreencaptureというコマンドがあるんだろう。 これでとったスクショはクリップボードに保存されるから、この内容を取得する。

できた!!!!

繰り返し&タイマー

Webサイトを開いた画面を繰り返しキャプチャするのに、タイマー処理が必要。

swiftで、タイマー(Timer)を使ってみる - Three.jsを使って、作ってみた

画像処理

執筆途中...

宣伝

こういう感じでArduinoでいろんな物が作れる、初心者用つめあわせキットがこちら。

作ってみたいな、と思った人は買ってください。

 
このキットと私がアップしたコードの組み合わせで作れます。

こういう有名ドコロのでも可。

みんなのArduino入門:基本キット

みんなのArduino入門:基本キット

これまでの記事など

前回

hollywis.hatenablog.com

総合もくじ

hollywis.hatenablog.com