Code Life

chakemiです。
今回はWindowsMediaPlayerのスキンを作ってみたいと思います。

WindowsMediaPlayerのスキンと言えば、以下のページのように様々なものがあります。
Windows Media Player 用スキン

開発環境：
メモ帳
動作確認 WindowsMediaPlayer Version9～10

仕組みは至って単純でXML、JScript、アートファイル（MSではこう呼んでますが、.bmp、.gif、.jpg、.pngの画像ファイルです）から構成されています。

xmlはスキン定義ファイルで拡張子を.wmsとなります。JScriptはイベントなどに対し複雑な処理をさせたい場合に用います。
アートファイルはそのままビジュアル部分になります。

今回は時間が無いので、簡単にサンプルのテキストベースのプレイヤースキンにファイルオープンダイアログとビデオ表示部分を追加してみました。

<THEME>
        <VIEW
                height = "450"
                width = "400"
        >
                <VIDEO
            top = "150"
            left = "0"
            width = "400"
            height = "300"
                />

                <TEXT 
                        width = "150"
                        fontSize = "30"
                        hoverFontStyle = "Bold"
                        hoverForegroundColor = "red"
                        disabledForegroundColor = "#CCCCCC"
                        justification = "Center"
                        value = "Play"
                        cursor = "hand"
                        enabled = "wmpenabled:player.controls.play"
                        onClick = "JScript: player.controls.play();"
                />
                <TEXT
                        width = "600"
                        fontsize = "30"
                        hoverFontStyle = "bold"
                        hoverForegroundColor = "red"
                        disabledForegroundColor = "#CCCCCC"
                        justification = "Center"
                        value = "File Open"
                        cursor = "hand"
                        onClick = "JScript:player.URL=theme.openDialog('FILE_OPEN','FILES_ALL');"
                />
                <TEXT
                        top = "50"
                        width = "150"
                        fontSize = "30"
                        hoverFontStyle = "Bold"
                        hoverForegroundColor = "red"
                        disabledForegroundColor = "#CCCCCC"
                        justification = "Center"
                        value = "Stop"
                        cursor = "hand"
                        enabled = "wmpenabled:player.controls.stop"
                        onClick = "JScript: player.controls.stop();"
                />
                <TEXT
                        top = "100"
                        width = "150"
                        fontSize = "30"
                        hoverFontStyle = "Bold"
                        hoverForegroundColor = "red"
                        justification = "Center"
                        value = "Close"
                        cursor = "hand"
                        onClick = "JScript: view.close();"
                />

        </VIEW>
</THEME>

こんな感じになりました。

C:\Program Files\Windows Media Player\Skinsにコピーして
WindowsMediaPlayerの「表示」→「移動」→「スキンセレクタ」から選択出来ます。

詳しくは、WindowsMediaPlayerSDKのヘルプの「Windows Media Player Skins」の項目をご参照ください。

次回は、も少しデザインを意識するのとwms、js、アートファイルをzipアーカイブにしたwmzファイルを作成してみます。