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 リファレンスを参照ください。

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