見出し画像

配信に自分好みの現在時刻を表示したい（OBS script ArrangedClockの説明書）

七伏(ななふせ)🦇

  • CSSとかよくわからないけど自分好みのスタイルで時刻を表示したい

  • 日本標準時など正確な時刻を表示したい

  • 好きなタイムゾーンの時計を表示したい

こんなときにピッタリなOBS用のスクリプトを作りました。
OBSのテキストをそのまま時計として動かすことができ、自由にレイアウトすることができます。

※OBS28以降対応です。

やること

フォローしてね
https://twitter.com/7huse
https://www.twitch.tv/nanahuse

  1. 必要なもののダウンロード

  2. Pythonの設定

  3. OBSの設定

  4. 時計の設定

必要なもののダウンロード

ダウンロードするもの

  • Python 3.10 embeddable package

  • get-pip.py

  • ArrangedClock

Pythonのダウンロード

※Python3.11だとOBSで認識されないようです。（OBS28.1.2現在）
https://www.python.org/downloads/windows/
リンク先からPython3.10の一番新しいものを探してください
「Windows embeddable package」の32bitか64bitをダウンロードします。
32bitと64bitはOBSに合わせてください。
ダウンロードが完了したら好きな場所に展開してください。
（展開するまでのフォルダに日本語が混じっているとうまく動きません
　Cドライブ直下などがおすすめ）

記事作成時(2022/11/28)の最新版

get-pip.pyをダウンロード

https://bootstrap.pypa.io/get-pip.py
上のリンクを右クリックし、名前をつけてリンク先を保存。
展開したPythonフォルダの中、python.exeのある場所に「get-pip.py」の名前で保存する。

ArrangedClockのダウンロード

https://github.com/Nanahuse/ArrangedClock/releases/
最新のバージョンのSource code(zip)をダウンロードし、
任意の場所に展開してください。
（展開するまでのフォルダに日本語が混じっているとうまく動かない場合があります
　Cドライブ直下などがおすすめ）
展開したファイルの中からrequirements.txtをPythonフォルダの中のpython.exeのある場所にコピーする。

Pythonの設定

展開したPythonフォルダを開いてください。
そのファイルの中からpython310._pthを開いてください。
開くアプリを選択する画面が出たらメモ帳を選ぶ。
（違うバージョンのPythonを選んだ場合は名前が違います）

5行目「#import site」-> 「import site」に変更する。（#を一つ消す）
変更できたら保存して閉じる。

5行目を「import site」に変更して保存する。

展開したPythonフォルダの何もないあたりをShiftを押しながら右クリック。
「PowerShellウィンドウをここで開く」を選択する

PowerShellウィンドウをここで開く

開いたウィンドウに下記コマンドをコピーして貼り付ける。
貼り付けたらエンターで実行する。
一通り動いて＞が再度表示されたら完了です閉じてください。

.\python.exe .\get-pip.py install -r .\requirements.txt
PowerShellへの入力と実行の例

OBSの設定

※このスクリプトはOBS28で使用可能です。
　（Pythonのバージョンの問題）
OBSを開き、画面上のメニューバーから「ツール」->「スクリプト」を開く。

スクリプトを開く

「Pythonの設定」タブを選択し、参照ボタンから展開したPythonフォルダ（python.exeのあるフォルダ）を選択してください。

展開したPythonフォルダのパスを選択

「スクリプト」タブを選択し、左下の「＋」ボタンを押し、
ダウンロードし展開したArrangedClockフォルダのsrcフォルダ内にある「arrange_clock.py」を選択する。

スクリプトの追加

正常にロードされるとスクリプトの設定画面が表示される。

画面の例

時計の設定

  1. 時計を表示するためのテキストソースを用意する。

  2. 「ツール」->「スクリプト」から開けるスクリプトの設定画面から時計表示の設定をする。

  3. Display sourceの設定から表示したいテキストソースを選ぶ

  4. 海外の時計を表示したい場合はTime zoneの設定を選ぶ。

  5. 時計の表示形式を設定する。設定方法は下記参照

  6. （必要なら）時計の補正情報を設定する。設定方法は下記参照

  7. テキストソースのフォントや色などをお好みに設定する。

設定項目の説明

Display source

時計を表示するテキストソース。
表示したいテキストソースが選べない場合は左下の更新ボタンを押してください。

更新ボタン

Time zone

表示する時計のタイムゾーン。
この設定を変えることで別の国の時間も表示できる。

Clock format

時計の表示書式はPython datetime strftimeを使用します。-> Python datetime document
それ以外にいくつか追加の表示書式があります
※日本式の曜日表示（月、火など）はできません。
　気が向いたら要望あれば対応するかも。

追加の表示書式

表示書式の例
%Y年%m月%d日 %H時%M分%S秒
-> 2021年10月18日 21時00分00秒
%m/%d %I:%M%p
-> 10/18 09:00PM
%Y.%m.%d %a. %H:%M:%S
-> 2021.10.18 Mon. 21:00:00
%Y.%m.%d - %Y.%nm.%nd
-> 2021.01.01 - 2021.1.1

NTP server url

空欄でも問題なく動作します。（PCの時計がそのまま表示されます。）
正確な時刻に補正したい場合はNTPサーバーを指定します。
例：日本標準時に合わせたいｰ>「ntp.nict.jp」と入力

完成

お好みの時計を配信で表示しよう

活用例

以上

NTP補正できる無駄に正確な時計を求めていたら自分で作るはめになりました。

普段はtwitchでマリオワールドのRTAしたり、プログラミングしたりしてます。
フォローしてね
https://www.twitch.tv/nanahuse
https://twitter.com/7huse



この記事が気に入ったらサポートをしてみませんか？