【Affinity】 「スクリプト」機能の使い方(例:バージョンを表示する)

この記事は約4分で読めます。
サーバー等の運営維持費を得るため記事内に自動表示される広告が含まれています

ダイアログの画面

こんにちは、さち です。

このブログでは、無料で高機能な画像アプリ「Affinity」を使って画像を作成しています。

今回は、この Affinity で使用できる「スクリプト」の使い方について書いていきます。

ついでに、最近 Affinity で「3.3」のようなバージョン表記が「製品情報」で見れなくなったのが不便なので、勉強ついでに「スクリプト」で表示できるようにしてみます。

この記事の内容は、バージョン「3.3(2026年9月)」以降の Affinity で使用できます

スポンサーリンク

やりたいこと

製品情報の画面

Affinity でメニューの「ヘルプ」→「製品情報」と進んでも、「3.3」のようなバージョン表記が確認できなくなってしまいました。

一応、上記の画像のように「2026年11月上旬」や「5004」といったバージョンに近い情報はあります。

しかし、ネット上の Affinity の記事や動画では「3.3」のようなバージョン表記も多く、自分が今どのバージョンを使っているのか調べたいことがあるんですよね。

もともと Affinity の新機能「スクリプト」を試したいと思っていたので、この機会に「3.3」のようなバージョンを表示するスクリプトを作ってみます。

スクリプトの使い方

【事前準備】 スクリプトを有効にする(初回のみ)

設定の画面

Ctrl + , キーを押して「設定」を表示します。(メニューの「編集」→「設定」でもOK)

左側のメニューから「スクリプト」を選択して、「Affinityスクリプティングを有効化」をオンにします。

これで、Affinity で「スクリプト」が使えるようになります。

「デフォルトの権限」「ファイルシステムへのアクセス」などの他の項目は、使用するスクリプトに合わせて適切な設定に変更して下さい。

【作る】 スクリプトを自作する

  1. メニューの「ウィンドウ」→「スクリプト」→「スクリプトエディター」と進みます。
    メニューの画面
  2. 「スクリプトエディター」が表示されるので、スクリプト(JavaScript)を記述していきます。
    スクリプトエディターの画面
  3. 今回は、Affinity の「バージョン」を表示するスクリプトを書いてみました。
    // Function, Data
    function getJpdate(endate) {
      const [month, day, year] = endate.split(' ');
      const jpdate = `${year}.${monthnum[month]}.${day}`;
      return jpdate;
    }
    
    const monthnum = {
      'Jan': '01', 'Feb': '02', 'Mar': '03', 'Apr': '04', 'May': '05', 'Jun': '06',
      'Jul': '07', 'Aug': '08', 'Sep': '09', 'Oct': '10', 'Nov': '11', 'Dec': '12'
    };
    
    // Main
    try {
      // 使いたいライブラリを読み込む
      const {app} = require('/application.js');
    
      // バージョン情報の取得
      const version = `v${app.majorVersion}.${app.minorVersion}.${app.buildVersion} (${app.revisionVersion})`;
      const compiledate = getJpdate(app.compileDate);
    
      // ダイアログでバージョンを表示
      alert(`コンパイル: ${compiledate}` ,`Affinity ${version}`);
    } catch(e) {
      alert(e);  
    }
    
  4. 右下にある「名前を付けて保存」をクリック。
    スクリプトエディターの画面
  5. 「名前」「カテゴリ」「説明」を入力して「保存」します。
    スクリプトエディターの画面

【使う】 スクリプトを実行する

  1. 「スクリプトライブラリ」パネルから、作成した「スクリプト」をクリックします。
    スクリプトライブラリの画面
  2. スクリプトが実行されます。
    ダイアログの画面
スクリプトの再編集(修正)は、「スクリプトライブラリ」パネルのスクリプト上で「右クリック」→「編集スクリプト(スクリプトを編集)」から行えます

スクリプトの勉強用資料

私が Affinity の「スクリプト」について勉強したときの資料や方法を残しておきます。何かのお役に立てれば幸いです。

公式のライブラリ・API 情報

Affinity 公式が Affinity SDK で「ライブラリ」「API」の情報を公開しています。(Affinity のメニュー「ヘルプ」→「SDKドキュメント」からもアクセス可能)

「ライブラリ」ファイルのダウンロードもできます。

console.dir() の使用

「スクリプトエディター」でライブラリが入った「オブジェクト」を、console.dir() に投げることで取得可能な情報をコンソール(スクリプトエディターの下のエリア)で確認できます。

実際のコードとしてはこんな感じです。

const {app} = require('/application.js');
console.dir(app);

ライブラリファイル

Affinity をインストールした場所にあるフォルダーを「Resources」→「JSLib」と進むと、実際に使用している「ライブラリ」ファイルがあります。

「ライブラリ」ファイルの中身を見ることで、そのライブラリでどんなことができるか分かります。

コメント

タイトルとURLをコピーしました