APIの説明・サンプル（GUIコンポーネント詳細）

画像コントロール

||manifestファイルに指定します
{component file logo1,
location = “curl/images/logo1.png”
}

|| simple-imageプロシージャ
{simple-image
name = “new_image_g”,
{manifest-url “file”, “logo1”}
}

|| SimpleImageGraphicクラス
set self.image-g = {self.find-graphic-by-name “new_image_g”} asa SimpleImageGraphic

|| ボタン押下時に画像を入れ替える
{self.logo12btn.add-event-handler
{on Action do
set self.image-g.source = {manifest-url “file”, “logo2”}
}
}

|| デスクトップ版で御馴染みのpopup-message

def pm = {self.find-graphic-by-name “popup-message”} asa CommandButton
{pm.add-event-handler
{on Action do
{popup-message “Hello!”　}
}
}

|| show-toastプロシージャ

def toast = {self.find-graphic-by-name “toast”} asa CommandButton
{toast.add-event-handler
{on Action do
{show-toast “This is message.”}
}
}

|| インジケータ
def indicator = {self.find-graphic-by-name “indicator”} asa CommandButton
{indicator.add-event-handler
{on Action do
    {with-busy-indicator
      message = “WAIT…..”
    do
      {for i = 0 below 10000 do
      def i = 1000 * 0.2 * 20
    }
    }
}
}

show-toast、with-mobile-processing-messageを使う場合は、以下のパッケージをインポートする必要があります。

{import * from COM.CURL.CAEDE.GUI}

MAP(GOOGLE-MAP)

||画面（グラフィック）クラス——————————————————————-

|| マップを表示するために、GoogleMapを画面クラスに配置します。

{GoogleMap
name = “map”,
width = 400px,
height = 500px
}

||ロジック（スクリーン）クラス—————————————————————-

|| GoogleMapの初期表示座標、ズーム、マップタイプなどを設定します。
def map = {self.find-graphic-by-name “map”} asa GoogleMap
{map.init-map
{MapOptions
    center = {Location
                   35.024052390233784,
                   135.76209587478638,
                   0.0,
                   0.0,
                   {DateTime},
                   0.0,
                  0.0
                 },
    zoom = 14,
    map-type-control = true,
    map-type-id = MapTypeId.ROADMAP
}
}

|| イベント追加は通常のコントロールへのイベント追加と同様です。
{map.add-event-handler
{on e:MapClickEvent do
{popup-message “”Clicked Map!”}
}
}

MAP（GOOGLE-MAP）を使う場合は、以下のパッケージをインポートする必要があります。

{import * from COM.CURL.CAEDE.WEB-SERVICE.GOOGLE-MAPS}

Movie

||画面（グラフィック）クラス——————————————————————-

|| 画面にVideoPlayerコントロール用のオブジェクトを配置する。

{VideoPlayer
name = “video”,
width = 320px,
height = 200px
}

||ロジック（スクリーン）クラス—————————————————————-
|| VideoPlayer、MOVIEの選択
def video = {self.find-graphic-by-name “video”} asa VideoPlayer
set video.controls = true
def mg-movie = {self.find-graphic-by-name “run-mg-movie”} asa CommandButton
{mg-movie.add-event-handler
{on Action do
    {run-media-gallery
      type = MediaType.video,
      {on e:MediaGalleryFinishedEvent do
        {if not e.canceled? then
          set video.source = {url e.media-url.name}
          {video.add-event-handler
            {on MediaPauseEvent do
              {output “Paused video.”}
            }
          }
        }
      }
    }
}
}

MOVIEを使う場合は、以下のパッケージをインポートする必要があります。

{import * from COM.CURL.CAEDE.MEDIA}

対応しているすべてのGUIコンポーネントにつきましては、Caede API リファレンスを参照ください。

今後、さらなる機能拡張をユーザニーズに併せて実施していく予定ですので、ご要望をコミュニティ・サイトに投稿いただければと思います。