アニメーションボタン | CURL DEVELOPER CENTER

動作

ボタンにフォーカスを当てたり、ポインタを合わせるとボタンアイコン画像の大きさが変化するコマンドボタンです。

バージョン

Curl Advanced UI 0.5

API説明

AnimationButtonクラス

ボタンにフォーカスイン、または、ボタン上にポインタを乗せるとボタンのアイコンが大きくなります。

ボタンからフォーカスアウト、または、ボタン上からポインタを離すとボタンのアイコンは元に戻ります。

パッケージ

COM.CURLAP.ADVANCED-UI.CONTROLS

スーパークラス

CommandButton

プロパティ

image-placement:LabelImagePlacement　ボタンアイコン画像の位置

コンストラクタ

default
引数1（static-label:#Label = “”）:ボタンに表示する名称ラベル

引数2(label-image:Pixmap):ボタンアイコン画像

引数3(image-placement:LabelImagePlacement = LabelImagePlacement.right):ボタンアイコン画像の位置

※初期設定ではボタンアイコン画像の位置は名称ラベルの右側になります。

LabelImagePlacement(列挙型)

ボタンアイコン画像の位置情報を持ちます。

パッケージ

COM.CURLAP.ADVANCED-UI.UTILS

スーパークラス

なし

要素

top　ボタンアイコン画像の位置は名称ラベルの上側になります。

bottom　ボタンアイコン画像の位置は名称ラベルの下側になります。

left　ボタンアイコン画像の位置は名称ラベルの左側になります。

right　ボタンアイコン画像の位置は名称ラベルの右側になります。

overlap　ボタンアイコン画像の位置は名称ラベルに重なります。

利用方法

ボタンアイコン画像、名称ラベルを設定してアニメーションボタンを作成します。

{curl 6.0 applet}
{curl-file-attributes character-encoding = “utf8”}
{applet manifest = “manifest.mcurl”}

{import * from COM.CURLAP.ADVANCED-UI.CONTROLS}
{import * from CURL.GUI.SHAPES}

{import * from COM.CURL.GUI.STYLED-CONTROLS}
{install-style-sheet
{manifest-url “file”, “DEFAULT-STYLE-SHEET”}
}

{let acb1:AnimationCommandButton =
    {AnimationCommandButton
        static-label = {bold {big Search}},
        {Pixmap.from-url
            {url “./images/mono-lens3.png”}
        },
        {on Action do
            {popup-message
                modal? = false,
                “PUSHED!”
            }
        }
    }
}

{let acb2:AnimationCommandButton =
    {AnimationCommandButton
        static-label = {bold {big Search}},
        {Pixmap.from-url
            {url “./images/mono-lens3.png”}
        }
    }
}

{View
    {Dialog
        height = 400pt,
        width = 400pt,
        background = “white”,
        valign = “center”,
        halign = “center”,
        {spaced-vbox
            spacing = 20pt,
            acb1,
            acb2,
            {DropdownList
                “top”,
                “left”,
                “bottom”,
                “right”,
                “overlap”,
                {on ValueFinished at ddl:DropdownList do
                    set acb1.image-placement = ddl.value
                    set acb2.image-placement = ddl.value
                }
            }
        }
    },
    visibility = “normal”,
    {on WindowClose do
        {exit}
    }
}

このサンプルでは、ドロップダウンリストから値を選択しますと、ボタンアイコン画像の位置が変更されます。

サンプル

t-animation-button.dcurl

動作

バージョン

API説明

利用方法

サンプル

関連Curl標準API