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

Graphics クラスの draw_ellipse インターフェイス

このページではGraphicsクラスのdraw_ellipseメソッドのインターフェイスについて説明します。

インターフェイス概要

draw_ellipseインターフェイスは楕円のベクターグラフィックスを描画します。

基本的な使い方

draw_ellipseインターフェイスはx、y、width、heightの各インターフェイスを持っています。xとyの引数は楕円の中央座標となります。widthとheightは楕円の幅と高さを決定します。これらのサイズは半径の倍の値（直径）で指定する必要があります。

import apysc as ap

ap.Stage(
    background_color=ap.Color("#333"),
    stage_width=325,
    stage_height=200,
    stage_elem_id="stage",
)

sprite: ap.Sprite = ap.Sprite()

# Set the cyan fill color and draw the ellipse.
sprite.graphics.begin_fill(color=ap.Color("#0af"))
sprite.graphics.draw_ellipse(x=125, y=100, width=150, height=100)

# Set the only dotted-line style and draw the ellipse.
sprite.graphics.begin_fill(color=ap.COLORLESS)
sprite.graphics.line_style(
    color=ap.Color("#fff"),
    thickness=3,
    dot_setting=ap.LineDotSetting(dot_size=3),
)
sprite.graphics.draw_ellipse(x=200, y=100, width=150, height=100)

ap.save_overall_html(dest_dir_path="graphics_draw_ellipse_basic_usage/")

返却値

draw_ellipseインターフェイスの返却値はEllipseクラスのインスタンスとなります。

このクラスのインスタンスは他のグラフィックス系のクラスと同様にxやy、widthなどの基本的なインターフェイスを持っています。

以下のコード例ではクリックのイベントハンドラを設定しており、楕円をクリックするたびに幅と高さが大きくなるようにしています。

import apysc as ap


def on_ellipse_click(e: ap.MouseEvent[ap.Ellipse], options: dict) -> None:
    """
    The handler that the ellipse calls when clicked.

    Parameters
    ----------
    e : MouseEvent
        Event instance.
    options : dict
        Optional arguments dictionary.
    """
    ellipse: ap.Ellipse = e.this
    ellipse.width += 15
    ellipse.height += 10


ap.Stage(
    background_color=ap.Color("#333"),
    stage_width=250,
    stage_height=200,
    stage_elem_id="stage",
)

sprite: ap.Sprite = ap.Sprite()

sprite.graphics.begin_fill(color=ap.Color("#0af"))
ellipse: ap.Ellipse = sprite.graphics.draw_ellipse(x=125, y=100, width=150, height=100)
ellipse.click(on_ellipse_click)

ap.save_overall_html(dest_dir_path="graphics_draw_ellipse_return_value/")

draw_ellipse API

特記事項: このAPIドキュメントはドキュメントビルド用のスクリプトによって自動で生成・同期されています。そのためもしかしたらこの節の内容は前節までの内容と重複している場合があります。

[インターフェイスの構造] draw_ellipse(self, *, x: Union[float, apysc._type.number.Number], y: Union[float, apysc._type.number.Number], width: Union[int, apysc._type.int.Int], height: Union[int, apysc._type.int.Int], variable_name_suffix: str = '') -> '_ellipse.Ellipse'

[インターフェイス概要]

楕円のベクターグラフィックスを描画します。

[引数]

  • x: float or Number

    • 楕円の中央のX座標。

  • y: float or Number

    • 楕円の中央のY座標。

  • width: Int or int

    • 楕円の幅。

  • height: Int or int

    • 楕円の高さ。

  • variable_name_suffix: str, default “”

    • JavaScript上の変数のサフィックスの設定です。この設定はJavaScriptのデバッグ時に役立つことがあります。

[返却値]

  • ellipse: Ellipse

    • 作成された楕円のグラフィックスのインスタンス。

[コードサンプル]

>>> import apysc as ap
>>> stage: ap.Stage = ap.Stage()
>>> sprite: ap.Sprite = ap.Sprite()
>>> sprite.graphics.begin_fill(color=ap.Color("#0af"))
>>> ellipse: ap.Ellipse = sprite.graphics.draw_ellipse(
...     x=100, y=100, width=100, height=50
... )
>>> ellipse.x
Number(100.0)

>>> ellipse.y
Number(100.0)

>>> ellipse.width
Int(100)

>>> ellipse.height
Int(50)

>>> ellipse.fill_color
Color("#00aaff")