Rainmeter WebParser 應用教學 - 桌布

WebParser 網頁分析的功能大部分用來訂閱RSS、新聞、天氣預報等等
簡單來講就是透過連結至網頁依照規則取數值回來秀在 Meter 上

接下來將從無到有講解一個 SKIN 的撰寫步驟
示範使用網頁分析取得 own3D.tv 網站上熱門的 LoL 直播清單

請先準備好製作面板的素材，這部分有點牽涉到美工能力(略)

建立一個INI檔案以供 SKIN 使用

[Rainmeter]
Author=June

這個區段控制一些全域的設置選項，例如更新間隔、背景模式等等...

[Metadata]
Name=
Config=
Description=
Instructions=
Version=1.0
Tags=
License=
Variant=
Preview=

這個區段控制軟體內建管理 SKIN 功能的一些細節顯示

[Variables]
Path=#CURRENTPATH#
Play=按一下左鍵開啟串流#CRLF#按一下中鍵連結至 own3D 頁面
SubstituteText="![CDATA[":"","]]":""

這個區段可以預先設置變數
第一個為設定路徑
第二個為工具提示文字
第三個為取值後要替換個文字

[TextStyleA]
FontSize=10 文字大小
FontColor=52,56,63 文字顏色
FontFace=Arial Unicode MS 文字字型
StringStyle=Bold 粗體樣式
StringEffect=Border 邊框特效
FontEffectColor=112,118,128 特效顏色

[TextStyleB]
...
因為我想要把 Meter 文字分成兩種風格，所以我預先定義出風格樣式

[MeasureGetList]
Measure=Plugin
Plugin=Plugins\WebParser.dll
UpdateRate=600 更新間隔
Url=http://api.own3d.tv/live?game=lol 解析網址
RegExp="(?si)</author>.*?<title>...." 取值規則(正規表達式)
StringIndex=1

這部分就是取數值的核心了，正規表達由於我也是初學者..使用方法就 Google 吧
(?si) s=忽略斷行字元 i=符合大小寫

[MeasureName1]
Measure=Plugin
Plugin=Plugins\WebParser.dll
Url=[MeasureGetList]
StringIndex=1
Substitute=#SubstituteText#

取得頻道名稱，即[MeasureGetList]的第一個返回值，並替換不需要的文字

[MeasureUrl1]
Measure=Plugin
Plugin=Plugins\WebParser.dll
Url=[MeasureGetList]
StringIndex=2

取得頻道頁面網址，即[MeasureGetList]的第二個返回值

[MeasureView1]
Measure=Plugin
Plugin=Plugins\WebParser.dll
Url=[MeasureGetList]
StringIndex=3

取得頻道觀眾人數，即[MeasureGetList]的第三個返回值

[MeasureStream1]
Measure=Plugin
Plugin=Plugins\WebParser.dll
Url=[MeasureGetList]
StringIndex=4
Substitute=#SubstituteText#

取得頻道串流網址，即[MeasureGetList]的第四個返回值，並替換不需要的文字
由於我有個功能是直接使用 Player 播放直播(不需開啟瀏覽器)，故取此值

[MeasureImage1]
Measure=Plugin
Plugin=Plugins\WebParser.dll
Url=[MeasureGetList]
StringIndex=5
Download=1

取得頻道預覽圖片，即[MeasureGetList]的第五個返回值，並下載供 Meter 使用

接下來直到 Meter 區段前除了名稱裡的數字不同及取值索引遞增之外
就是一大串的重複了.....所以就省略了
最多觀眾的10個頻道，每頻道取5個值，所以總共有50個

[MeterBackground5]
Meter=IMAGE
ImageName=background_5.png
ImageAlpha=255

1~5背景圖片，由於我有作開關分為兩段顯示清單所以有兩個

[MeterBackground10]
Meter=IMAGE
ImageName=background_10.png
ImageAlpha=255
Hidden=1

6~10背景圖片，設定隱藏之

[MeterButton5]
ImageName=button_5.png
Meter=Image
ImageAlpha=255
X=230
Y=28
ToolTipText=按一下左鍵切換清單#CRLF#按一下中鍵更新清單
LeftMouseDownAction=!Execute [!RainmeterHideMeter MeterName1]...
MiddleMouseDownAction=!Execute [!RainmeterRefresh]

1~5的開關按鈕，點擊左鍵會隱藏頻道1~5所有 Meter 並顯示6~10頻道

[MeterButton10]
...

6~10的開關按鈕，點擊左鍵會隱藏頻道6~10所有 Meter 並顯示1~5頻道

接下來的 Meter 顯示有幾點觀念要講一下
Rainmeter SKIN 的 INI 內容是有層級的，越下面的 Meter 層級越高
如果 Meter 位置是有規律性的建議依序寫入，可使用r直接繼承上一個的位置
這樣就不用每個 Meter 都去橋X,Y浪費一堆時間

[MeterName1]
MeasureName=MeasureName1
Meter=STRING
StringAlign=CENTER 置中
ClipString=1 過長省略
W=190 區域寬
H=18 區域高
X=215 X座標
Y=80 Y座標
MeterStyle=TextStyleA 使用先前定義的風格
AntiAlias=1 反鋸齒
ToolTipText=[MeasureName1] 工具提示
DynamicVariables=1 動態值(用於工具提示)

[MeterView1]
MeasureName=MeasureView1
Meter=STRING
StringAlign=CENTER
ClipString=1
W=190
H=18
X=0r X座標繼承上一個
Y=18r Y座標繼承上一個+18
MeterStyle=TextStyleB
AntiAlias=1

由於某些取回來的數值可能會長到超出背景圖範圍，所以我限制了顯示區域
這也是我要使用工具提示的原因，過長被截斷時可由工具提示觀看

接下來直到頻道預覽圖前除了名稱裡的數字及某些繼承的Y座標不同之外
就是一大串的重複了.....所以就省略了
由於6~10頻道的 Meter 是經由開關開啟的，所以要先設定為隱藏

[MeterImage1]
MeasureName=MeasureImage1
Meter=Image
ImageAlpha=250
W=88
H=50
X=29
Y=70
ToolTipText=#Play#
LeftMouseDownAction=!Execute ["#Path#\flashplayer.exe" "[MeasureStream1]...
MiddleMouseDownAction=!Execute ["[MeasureUrl1]"]

[MeterImage2]
MeasureName=MeasureImage2
Meter=Image
ImageAlpha=250
W=88
H=50
X=r
Y=65r
ToolTipText=#Play#
LeftMouseDownAction=!Execute ["#Path#\flashplayer.exe" "[MeasureStream2]...
MiddleMouseDownAction=!Execute ["[MeasureUrl2]"]

預覽圖的 Meter ，我設置為左鍵直接撥放，右鍵開啟網頁

接下來除了名稱裡的數字不同之外
就是一大串的重複了.....所以就省略了

[MeterMask]
Meter=IMAGE
ImageName=mask.png
ImageAlpha=255
X=25
Y=67
Hidden=1

由於嫌只有預覽圖太醜了，所以幫預覽圖做了個遮罩加個框
設為隱藏待第10個預覽圖取得才顯示，這樣才不會一載入就顯示，很突兀

[MeterShadow]
Meter=IMAGE
ImageName=shadow.png
ImageAlpha=255

上下橫幅加了個陰影效果
陰影我需要的效果是會蓋到某些 Meter 故我寫在最後面(最上層)



某些腳本因為過長有被我截斷，可以下載完成的 SKIN 觀看
http://db.tt/RnG6phlY

--