04/15/2023 1

by Nia Tomonaka ( @nia_tn1012 )

Mascot Chara Meter の紹介とカレンダーウィジェットの開発話

2

Nia （ニア）とは何者でしょう？

• 生まれも育ちも湘南の大学生• フルネーム : 　ニア・トモナカ• 学科は電気電子系、研究室は情報処理系• 主に C / C++ / C# / XAML / F# でプログラミング• アールグレイティーとコーヒー（ブラック無糖）、炭酸飲料が好物• 趣味は写真撮影と音ゲー（ Reflec Beat と Groove Coaster ）　（ Reflec Beat はレベル 10+ をクリアできる程度）

• Twitter : @nia_tn1012 （←フォローよろしくです）

3

• Myoga-TN.net のマスコットキャラクター• フルネーム : 　ミョウガ・スクリューブライト• 未来の時代（ 2414 年）からタイムスリップしてきた大学生

• Mascot Chara Meter の作成者

• Twitter : @myoga1012 （← Follow me please ! ）

• 中の人などいない・・・

Myoga （ミョウガ）とは何者でしょう？

4

Mascot Chara Meterの紹介

•マスコットアプリ文化祭に（ Myoga 名義で）応募した作品「 Mascot Chara Meter 」について簡単に紹介します。

5

• Rainmeter 上で動作するシンプルな PC リソースモニターのウィジェット（スキン）

• アクセントであるマスコットキャラクターでちょっとお洒落

Mascot Chara Meter とは

6

• PC のシステム情報や RSS フィードなどを表示することができる、ツールアプリ

• カスタマイズ性が高い→ 高性能なウィジェットが作成できる→ 画像だけ表示して、単なるデスクトップのアクセサリーにもなる

※ 右図はかつて作成したウィジェット

Rainmeter とは

7

Rainmeter の使用例

8

Rainmeter の使用例・その 2

© 2010 プログラミング生放送 © 2014 Myoga-TN.netCopyright © DeNA Co. Ltd. All Rights Reserved.

画像表示だけを使って、マスコットキャラそのものをデスクトップに置くことも

できるよ！

9

• 幅 160px とスリムサイズ（※カレンダーを除く）

Mascot Chara Meter の特徴

10

※ 窓○むつみさんの心の中の声です。

このむつみ、まだまだ新入りに

は負けませんわ！

11

カレンダーウィジェットの開発話

•ここでは Mascot Chara Meter のウィジェットの 1 つ「マスコットキャラ カレンダー」における開発話をします。

12

• マスコットキャラを背景に現在の月のカレンダーを表示するウィジェット

• 季節ごとに枠色が変化する

• スクリプトとして、プログラミング言語 Lua を使用

マスコットキャラ カレンダーとは

13

ウィジェットの設定ファイル（ .ini ）

• メタデータの設定• 色、文字の書式設定の定義• 現在の年月日及び曜日の読み込

み• 年月を表示• 曜日のヘッダー部分を表示• 日付表示用のオブジェクトを定

義

スクリプト（ .lua ）• 日付の書式設定• 季節に応じて枠色を設定• 月初め（ 1 日）の曜日、月末日

を計算し、日付を出力

マスコットキャラ カレンダーにおける役割

14

• 当月初日（ 1 日）の曜日に合わせて、先頭側を空白で埋める必要がある

カレンダーを作成するためには？

15

• Zeller の公式を利用して求める

※1 「」は年、「」は月、 「」は日、　　　「 mod 7 」は 7 の余剰 (7 で割った時の余り )※2 (但し、 ) は床関数 (小数点以下を切り捨て )※3 以下に曜日と「」の値の対応表を示す

年月日から月初め（ 1 日）の曜日「」を求めるには？

曜日 日 月 火 水 木 金 土値 0 1 2 3 4 5 6

16

→ 2014 年 12 月 1 日は月曜日

例： 2014 年 12 月 1 日の場合

17

• 現在の年月日の他に、現在の曜日も取得できる

• その曜日と現在の日を使って、当月初日の曜日が求められるのではないか・・・

Rainmeter では？

18

• 現在日を「」、現在の曜日を「」とすると、当月初日の曜日「」は、

で求められる。

※以下に曜日と「」、 「」の値の対応表を示す

現在日とその曜日から、当月初日の曜日を求める式

曜日 日 月 火 水 木 金 土値 0 1 2 3 4 5 6

19

• 式 (2)内」で、当月初日の曜日を日曜（ 0 ）にした時に対する、 日の曜日「」を求める

式 (2) の原理①

例： 2014 年 12 月 20 日の場合

𝑾𝒏′=𝟓

20

•式 (3) を使って、現在の曜日「」と「」との差を求める

•式 (4) の値が当月初日の曜日の値である

式 (2) の原理②

例： 2014 年 12 月 20 日の場合

𝑾𝒏′=𝟓

𝑾𝒏=𝟔

𝑾𝒏−𝑾𝒏′=𝟔−𝟓=𝟏

21

•式 (4) の値が当月初日の曜日の値であるには、

を満たす必要がある。

では式 (4) は正しい値にならない。

しかし・・・

𝑾𝒏=𝟎

𝑾𝒏′=𝟒

例： 2014 年 10 月 12 日の場合𝑾𝒏−𝑾𝒏

′=𝟎−𝟒=−𝟒?

22

• 式 (4) の値が必ず正の数になるように、 「」に 7 を加え、 7 の余剰を求める

• 「」に対する「」の余剰は、 「」に「」の整数倍を加算（減算）した値に対する「」の余剰に等しい

※但し、 とする

その問題を解決するには？

23

例： 2014 年 10 月 12 日の場合

𝑾𝒏=𝟎

𝑾𝒏′=𝟒

𝑾 𝟏=(𝑾𝒏+𝟕−𝑾 𝒏′)𝐦𝐨𝐝𝟕= (𝟎+𝟕−𝟒 )𝐦𝐨𝐝𝟕=𝟑𝐦𝐨𝐝𝟕=𝟑

24

例： 2014 年 12 月 20 日の場合

𝑾𝒏=𝟔

𝑾𝒏′=𝟓

𝑾 𝟏=(𝑾𝒏+𝟕−𝑾 𝒏′)𝐦𝐨𝐝𝟕= (𝟔+𝟕−𝟓 )𝐦𝐨𝐝𝟕=𝟖𝐦𝐨𝐝𝟕=𝟏

25

• 現在日を「」と現在の曜日を「」から、当月初日の曜日「」は以下の式で求められる

• Zeller の公式と比較すると、用途は限定される（当月初日の曜日の算出）が、式はシンプルでコーディングしやすい

まとめ

26

• Myoga-TN.net ではプログラミングやアプリの活用などにおける、ちょっとしたテクニックや気づいたことなどを紹介たり、開発したアプリなど公開したりしていきたいと思います。

•ホームページは http://myoga-tn.expressweb.jp です。　（ WordPress と WebMatrix を利用しています）

最後に、１つだけよろしいですか？

27

よろしくお願いいたします！

28

ご清聴ありがとうございました

Thank you for listening !