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

animation_width と animation_height のインターフェイス¶

このページではanimation_widthとanimation_heightメソッドの各インターフェイスについて説明します。

各インターフェイスの概要¶

animation_widthインターフェイスはAnimationWidthクラスのインスタンスを生成します。そのインスタンスを使って幅のアニメーションを設定することができます。

同様にanimation_heightメソッドのインターフェイスはAnimationHeightクラスのインスタンスを生成します。そのインスタンスを使って高さのアニメーションを設定することができます。

これらの各インターフェイスはRectangleクラスなどのDisplayObjectの各サブクラス上に存在します。

基本的な使い方¶

以下のコード例ではanimation_widthメソッドを使って幅（50から100）のアニメーションを設定しています。

import apysc as ap

DURATION: int = 1000
EASING: ap.Easing = ap.Easing.EASE_OUT_QUINT


def on_animation_complete_1(e: ap.AnimationEvent[ap.Rectangle], options: dict) -> None:
    """
    The handler that the animation calls when its end.

    Parameters
    ----------
    e : ap.AnimationEvent
        Event instance.
    options : dict
        Optional arguments dictionary.
    """
    rectangle: ap.Rectangle = e.this.target
    animation_width: ap.AnimationWidth = rectangle.animation_width(
        width=50, duration=DURATION, easing=EASING
    )
    animation_width.animation_complete(on_animation_complete_2)
    animation_width.start()


def on_animation_complete_2(e: ap.AnimationEvent[ap.Rectangle], options: dict) -> None:
    """
    The handler that the animation calls when its end.

    Parameters
    ----------
    e : ap.AnimationEvent
        Event instance.
    options : dict
        Optional arguments dictionary.
    """
    rectangle: ap.Rectangle = e.this.target
    animation_width: ap.AnimationWidth = rectangle.animation_width(
        width=100, duration=DURATION, easing=EASING
    )
    animation_width.animation_complete(on_animation_complete_1)
    animation_width.start()


ap.Stage(
    stage_width=200,
    stage_height=150,
    background_color=ap.Color("#333"),
    stage_elem_id="stage",
)
sprite: ap.Sprite = ap.Sprite()
sprite.graphics.begin_fill(color=ap.Color("#00aaff"))
rectangle: ap.Rectangle = sprite.graphics.draw_rect(x=50, y=50, width=50, height=50)
animation_width: ap.AnimationWidth = rectangle.animation_width(
    width=100, duration=DURATION, easing=EASING
)
animation_width.animation_complete(on_animation_complete_1)
animation_width.start()

ap.save_overall_html(dest_dir_path="./animation_width_basic_usage/")

同様に以下のコード例ではanimation_heightメソッドを使って高さのアニメーションを設定しています。

import apysc as ap

DURATION: int = 1000
EASING: ap.Easing = ap.Easing.EASE_OUT_QUINT


def on_animation_complete_1(e: ap.AnimationEvent[ap.Rectangle], options: dict) -> None:
    """
    The handler that the animation calls when its end.

    Parameters
    ----------
    e : ap.AnimationEvent
        Event instance.
    options : dict
        Optional arguments dictionary.
    """
    rectangle: ap.Rectangle = e.this.target
    animation_height: ap.AnimationHeight = rectangle.animation_height(
        height=50, duration=DURATION, easing=EASING
    )
    animation_height.animation_complete(on_animation_complete_2)
    animation_height.start()


def on_animation_complete_2(e: ap.AnimationEvent[ap.Rectangle], options: dict) -> None:
    """
    The handler that the animation calls when its end.

    Parameters
    ----------
    e : ap.AnimationEvent
        Event instance.
    options : dict
        Optional arguments dictionary.
    """
    rectangle: ap.Rectangle = e.this.target
    animation_height: ap.AnimationHeight = rectangle.animation_height(
        height=100, duration=DURATION, easing=EASING
    )
    animation_height.animation_complete(on_animation_complete_1)
    animation_height.start()


ap.Stage(
    stage_width=150,
    stage_height=200,
    background_color=ap.Color("#333"),
    stage_elem_id="stage",
)
sprite: ap.Sprite = ap.Sprite()
sprite.graphics.begin_fill(color=ap.Color("#00aaff"))
rectangle: ap.Rectangle = sprite.graphics.draw_rect(x=50, y=50, width=50, height=50)
animation_height: ap.AnimationHeight = rectangle.animation_height(
    height=100, duration=DURATION, easing=EASING
)
animation_height.animation_complete(on_animation_complete_1)
animation_height.start()

ap.save_overall_html(dest_dir_path="./animation_height_basic_usage/")

Ellipse のインスタンスにおける特記事項¶

楕円のインスタンス（Ellipseクラス）のanimation_widthとanimation_heightの各インターフェイスは内部実行が異なる都合でAnimationWidthクラスなどの代わりに以下のコード例のようにAnimationWidthForEllipseクラスとAnimationHeightForEllipseクラスのインスタンスを返却します:

import apysc as ap

ap.Stage(
    stage_width=150,
    stage_height=200,
    background_color=ap.Color("#333"),
    stage_elem_id="stage",
)
sprite: ap.Sprite = ap.Sprite()
sprite.graphics.begin_fill(color=ap.Color("#00aaff"))
ellipse: ap.Ellipse = sprite.graphics.draw_ellipse(x=100, y=100, width=100, height=100)
animation_width: ap.AnimationWidthForEllipse = ellipse.animation_width(
    width=200, duration=1000
)
animation_width.start()

animation_width API¶

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

[インターフェイスの構造] animation_width(self, *, width: Union[int, apysc._type.int.Int], duration: Union[int, apysc._type.int.Int] = 3000, delay: Union[int, apysc._type.int.Int] = 0, easing: apysc._animation.easing.Easing = <Easing.LINEAR: 'function(x) {return x;}'>) -> apysc._animation.animation_width.AnimationWidth

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

幅のアニメーションを設定します。

[引数]

width: Int or int
- 幅のアニメーションの最終値。
duration: Int or int, default 3000
- アニメーション完了までのミリ秒。
delay: Int or int, default 0
- アニメーション開始までの遅延時間のミリ秒。
easing: Easing, default Easing.LINEAR
- イージング設定。

[返却値]

animation_width: AnimationWidth
- 生成されたアニメーションのインスタンス。

[特記事項]

アニメーションを開始するには返却されたインスタンスのstartメソッドを呼び出す必要があります。

[コードサンプル]

>>> import apysc as ap
>>> stage: ap.Stage = ap.Stage()
>>> sprite: ap.Sprite = ap.Sprite()
>>> sprite.graphics.begin_fill(color=ap.Color("#0af"))
>>> rectangle: ap.Rectangle = sprite.graphics.draw_rect(
...     x=50, y=50, width=50, height=50
... )
>>> _ = rectangle.animation_width(
...     width=100,
...     duration=1500,
...     easing=ap.Easing.EASE_OUT_QUINT,
... ).start()

[関連資料]

animation_height API¶