※この翻訳ドキュメントはスクリプトによって出力・同期されています。内容が怪しそうな場合はGitHubにissueを追加したり英語の原文の確認をお願いします。

クイックスタートガイド

このページではapyscのライブラリの最初の一歩としての諸々について説明します。

インストール

apyscのライブラリを使うにはPython3.7もしくはそれ以降のPythonバージョンが必要です。

apyscはpipのコマンドを使ってインストールすることができます。

$ pip install apysc

Stageのインスタンスを作成し、HTMLを出力する

Stageのインスタンスはapyscの各グラフィックスを表示する領域となるインスタンスです。幅の設定としてのstage_width引数、高さの設定としてのstage_height引数、そして背景色としてのbackground_color引数を設定することができます。

import apysc as ap

stage = ap.Stage(
    stage_width=300,
    stage_height=180,
    background_color=ap.Color("#333"),
)

さらに、結果のHTMLとJavaScriptのファイルをsave_overall_html関数によって保存することができます（このケースではまだ黒い背景のステージが表示されるだけです）。

import apysc as ap

stage: ap.Stage = ap.Stage(
    stage_width=300,
    stage_height=180,
    background_color=ap.Color("#333"),
    stage_elem_id="stage",
)
ap.save_overall_html(dest_dir_path="quick_start_stage_creation/")

このコードではdest_dir_path引数に指定されたディレクトリに結果のHTMLとJavaScriptの各ファイルを生成します。以下のコード例ではindex.htmlのファイル（quick_start_stage_creation/index.html）を開くことで出力結果を確認することができます。

Spriteのコンテナとベクターグラフィックスを追加する

Spriteクラスは各表示オブジェクトのコンテナとなるクラスであり、graphics属性を使ってベクターグラフィックスを生成することもできます。

import apysc as ap

stage: ap.Stage = ap.Stage(
    stage_width=250,
    stage_height=150,
    background_color=ap.Color("#333"),
    stage_elem_id="stage",
)
sprite: ap.Sprite = ap.Sprite()

# Draw polyline vector graphics.
sprite.graphics.line_style(color=ap.Color("#fff"), thickness=3)
sprite.graphics.move_to(x=50, y=50)
sprite.graphics.line_to(x=100, y=50)
sprite.graphics.line_to(x=50, y=100)
sprite.graphics.line_to(x=100, y=100)

# Draw rectangle vector graphic.
sprite.graphics.begin_fill(color=ap.Color("#0af"))
sprite.graphics.draw_rect(x=150, y=50, width=50, height=50)

ap.save_overall_html(dest_dir_path="quick_start_sprite_graphics/")

SpriteやGraphicsクラスの詳細については各インターフェイスのドキュメントをご確認ください。

関連資料