|
TalMap SDK Libary Reference |
HOWTO: Use UI Objects of TalMapX Control. |
|
Summary
|
This document describes how to use the UI functions provided in TalMapX Control.
TalMapX Control provides various kinds of Objects for UI(User Interface).
The UI Objects provided in TalMapX Control are XUIButton, XUICheckBox, XUIImage, XUIImageList, XUIImageText, XUIPanel, UIStatic, and etc.
With this document, users can learn how to easily use UI Objects.
|
|
|
Steps
|
1. Get Control Manager from TalMapX Control.
2. Get UI Manager with the Contorl Manager.
3. Make desired Objects with the UI Manager.
4. Use the created UI Objects to carry out the desired tasks.
|
|
|
Example
|
|
<html>
<head>
<script language="javascript">
<!--
// Create UI
function CreateUI() {
var ctrlman = m_Map.GetCtrlMan();
var uiman = ctrlman.GetUIMan();
var ctrlstate = ctrlman.GetControlState();
var dpsize = ctrlstate.GetSizeDP();
var util = m_Map.GetUtility();
var imageman = ctrlman.GetImageMan();
imageman.SetDefaultPath("http://www.talmap.co.kr/tutorial/");
// Zoom In Button
var btnZoomIn = uiman.CreateUI_Button(uiman);
btnZoomIn.SetParent(uiman);
btnZoomIn.SetUIID(11);
btnZoomIn.SetCaption("ZoomIn Button");
btnZoomIn.SetBound(4, 20, 47, 45);
btnZoomIn.SetImageList("image/btn_zoom_in.png", 47, 45);
btnZoomIn.SetAnchor(util.GetConstToValue("TMUIOBJ_ANCHOR_LEFT") | util.GetConstToValue("TMUIOBJ_ANCHOR_TOP"));
btnZoomIn.SetCanFocus(1);
btnZoomIn.SetCanClick(1);
btnZoomIn.SetBrush(util.GetConstToValue("BS_SOLID"), util.RGBColor(255, 0, 0), 0);
btnZoomIn.SetTransparent(util.GetConstToValue("TMUIOBJ_TRANSPARENT_ALL"));
btnZoomIn.SetCanDrag(1);
btnZoomIn.AddEventMode(util.GetConstToValue("TMEVENTTYPE_MOUSEDOWN") | util.GetConstToValue("TMEVENTTYPE_MOUSEUP"));
// Zoom Out Button
var btnZoomOut = uiman.CreateUI_Button(uiman);
btnZoomOut.SetParent(uiman);
btnZoomOut.SetUIID(12);
btnZoomOut.SetCaption("ZoomIn Button");
btnZoomOut.SetBound(4, 69, 47, 45);
btnZoomOut.SetImageList("image/btn_zoom_out.png", 47, 45);
btnZoomOut.SetAnchor(util.GetConstToValue("TMUIOBJ_ANCHOR_LEFT") | util.GetConstToValue("TMUIOBJ_ANCHOR_TOP"));
btnZoomOut.SetCanFocus(1);
btnZoomOut.SetCanClick(1);
btnZoomOut.SetBrush(util.GetConstToValue("BS_SOLID"), util.RGBColor(255, 0, 0), 0);
btnZoomOut.SetTransparent(util.GetConstToValue("TMUIOBJ_TRANSPARENT_ALL"));
btnZoomOut.SetCanDrag(1);
btnZoomOut.AddEventMode(util.GetConstToValue("TMEVENTTYPE_MOUSEDOWN") | util.GetConstToValue("TMEVENTTYPE_MOUSEUP"));
// Menu Button
var btn = uiman.CreateUI_Button(uiman);
btn.SetParent(uiman);
btn.SetUIID(10);
btn.SetCaption("Menu Button");
btn.SetBound(0, dpsize.CY - 72, 72, 72);
btn.SetImageList("image/btn_menu_72.png", 72, 72);
btn.SetAnchor(util.GetConstToValue("TMUIOBJ_ANCHOR_LEFT") | util.GetConstToValue("TMUIOBJ_ANCHOR_TOP"));
btn.SetCanFocus(1);
btn.SetCanClick(1);
btn.SetBrush(util.GetConstToValue("BS_SOLID"), util.RGBColor(255, 0, 0), 0);
btn.SetTransparent(util.GetConstToValue("TMUIOBJ_TRANSPARENT_ALL"));
btn.SetData(1);
btn.SetAlpha(70);
btn.AddEventMode(util.GetConstToValue("TMEVENTTYPE_MOUSEENTER") |
util.GetConstToValue("TMEVENTTYPE_MOUSELEAVE") |
util.GetConstToValue("TMEVENTTYPE_MOUSEDOWN") |
util.GetConstToValue("TMEVENTTYPE_MOUSEMOVE") |
util.GetConstToValue("TMEVENTTYPE_MOUSEUP"));
}
// OnUI_MouseUp Event Function
function MapEvent_UI_MouseUp(XUIObj, Code, Value1, Value2)
{
switch (XUIObj.GetUIID()) {
case 11: Map_ZoomIn(); break;
case 12: Map_ZoomOut(); break;
}
}
// OnUI_Click Event Function
function MapEvent_UI_Click(XUIObj, Code, Value1, Value2)
{
if (XUIObj.GetUIID() == 10) {
alert(XUIObj.GetCaption() + "is Clicked!!!");
}
}
// OnUI_MouseHover Event Function
function MapEvent_UI_MouseHover(XUIObj, Code, Value1, Value2)
{
if (XUIObj.GetUIID() == 10) { // Menu Button
XUIObj.SetAlpha(0);
}
}
// OnUI_MouseLeave Event Function
functionvoid CSampleDlg::OnUI_MouseLeaveTalmapxctrl1(LPDISPATCH Obj)
{
CXUIObj object = Obj;
if (object.GetUIID() == 10) {
object.SetAlpha(80);
}
} MapEvent_UI_MouseLeave(XUIObj, Code, Value1, Value2)
{
if (XUIObj.GetUIID() == 10) { // Menu Button
XUIObj.SetAlpha(70);
}
}
// Set Theme Related Path in the OnCreate Event
function MapEvent_OnCreate(Flag)
{
var ctrl = m_Map.GetCtrlMan();
var mapman = ctrl.GetMapMan();
var thememan = ctrl.GetThemeMan();
var ctrlstate = ctrl.GetControlState();
// Set Map Data Path
if (mapman.SetDefaultPath("http://localhost/MapData")) {
alert("Could not Set the Map Data Path.");
}
// Set Theme Path
thememan.SetDefaultPath("http://localhost/Theme");
if (thememan.LoadTheme("TalMap.TMT") != true) {
alert("Could not Load the Theme.");
}
ctrlstate.SetLevel(4);
ctrlstate.SetZoomScale(0.5);
}
-->
</script>
<script language="javascript" for="m_Map" event="OnCreate(Flag)">
<!--
MapEvent_OnCreate(Flag);
-->
</script>
<script language="javascript" for="m_Map" event="OnUI_MouseUp(XUIObj, Code, Value1, Value2)">
<!--
MapEvent_UI_MouseUp(XUIObj, Code, Value1, Value2);
-->
</script>
<script language="javascript" for="m_Map" event="OnUI_Click(XUIObj, Code, Value1, Value2)">
<!--
MapEvent_UI_Click(XUIObj, Code, Value1, Value2);
-->
</script>
<script language="javascript" for="m_Map" event="OnUI_MouseHover(XUIObj, Code, Value1, Value2)">
<!--
MapEvent_UI_MouseHover(XUIObj, Code, Value1, Value2);
-->
</script>
<script language="javascript" for="m_Map" event="OnUI_MouseLeave(XUIObj, Code, Value1, Value2)">
<!--
MapEvent_UI_MouseLeave(XUIObj, Code, Value1, Value2);
-->
|
|
|
#include "talmapxctrl1.h"
#include "CXCtrlMan.h"
#include "CXControlState.h"
#include "CXThemeMan.h"
#include "CXMapMan.h"
#include "CXAdminMan.h"
#include "CXUIMan.h"
#include "CXUtility.h"
BEGIN_EVENTSINK_MAP(CSampleDlg, CDialog)
ON_EVENT(CSampleDlg, IDC_TALMAPXCTRL1, 23, CSampleDlg::OnUI_ClickTalmapxctrl1, VTS_DISPATCH VTS_I4 VTS_I4 VTS_I4)
ON_EVENT(CSampleDlg, IDC_TALMAPXCTRL1, 21, CSampleDlg::OnUI_MouseUpTalmapxctrl1, VTS_DISPATCH VTS_I4 VTS_I4 VTS_I4)
ON_EVENT(CSampleDlg, IDC_TALMAPXCTRL1, 24, CSampleDlg::OnUI_MouseHoverTalmapxctrl1, VTS_DISPATCH)
ON_EVENT(CSampleDlg, IDC_TALMAPXCTRL1, 25, CSampleDlg::OnUI_MouseLeaveTalmapxctrl1, VTS_DISPATCH)
END_EVENTSINK_MAP()
// Create UI
void CSampleDlg::OnSmButtonAdd()
{
CXControlState ctrlstate = ctrlman.GetControlState();
CXSize dpsize = ctrlstate.GetSizeDP();
CXUtility util = m_Map.GetUtility();
CXUIMan uiman = ctrlman.GetUIMan();
CXImageMan imageman = ctrlman.GetImageMan();
imageman.SetDefaultPath("http://www.talmap.co.kr/tutorial/");
// Zoom In Button
CXUIButton btnZoomIn = uiman.CreateUI_Button(uiman);
btnZoomIn.SetParent(uiman);
btnZoomIn.SetUIID(11);
btnZoomIn.SetCaption("ZoomIn Button");
btnZoomIn.SetBound(4, 20, 47, 45);
btnZoomIn.SetImageList("image/btn_zoom_in.png", 47, 45);
btnZoomIn.SetAnchor(util.GetConstToValue("TMUIOBJ_ANCHOR_LEFT") | util.GetConstToValue("TMUIOBJ_ANCHOR_TOP"));
btnZoomIn.SetCanFocus(1);
//btnZoomIn.SetCanClick(1);
btnZoomIn.SetBrush(util.GetConstToValue("BS_SOLID"), util.RGBColor(255, 0, 0), 0);
btnZoomIn.SetCanDrag(1);
//btnZoomIn.AddEventMode(util.GetConstToValue("TMEVENTTYPE_MOUSEDOWN") | util.GetConstToValue("TMEVENTTYPE_MOUSEUP"));
// Zoom Out Buttono
CXUIButton btnZoomOut = uiman.CreateUI_Button(uiman);
btnZoomOut.SetParent(uiman);
btnZoomOut.SetUIID(12);
btnZoomOut.SetCaption("ZoomIn Button");
btnZoomOut.SetBound(4, 69, 47, 45);
btnZoomOut.SetImageList("image/btn_zoom_out.png", 47, 45);
btnZoomOut.SetAnchor(util.GetConstToValue("TMUIOBJ_ANCHOR_LEFT") | util.GetConstToValue("TMUIOBJ_ANCHOR_TOP"));
btnZoomOut.SetCanFocus(1);
btnZoomOut.SetCanClick(1);
btnZoomOut.SetBrush(util.GetConstToValue("BS_SOLID"), util.RGBColor(255, 0, 0), 0);
btnZoomOut.SetTransparent(util.GetConstToValue("TMUIOBJ_TRANSPARENT_ALL"));
btnZoomOut.SetCanDrag(1);
//btnZoomOut.AddEventMode(util.GetConstToValue("TMEVENTTYPE_MOUSEDOWN") | util.GetConstToValue("TMEVENTTYPE_MOUSEUP"));
// Menu Button
CXUIButton btn = uiman.CreateUI_Button(uiman);
btn.SetParent(uiman);
btn.SetUIID(10);
btn.SetCaption("Menu Button");
btn.SetBound(0, dpsize.GetCY() - 72, 72, 72);
btn.SetImageList("image/btn_menu_72.png", 72, 72);
btn.SetAnchor(util.GetConstToValue("TMUIOBJ_ANCHOR_LEFT") | util.GetConstToValue("TMUIOBJ_ANCHOR_TOP"));
btn.SetCanFocus(1);
btn.SetCanClick(1);
btn.SetBrush(util.GetConstToValue("BS_SOLID"), util.RGBColor(255, 0, 0), 0);
btn.SetTransparent(util.GetConstToValue("TMUIOBJ_TRANSPARENT_ALL"));
btn.SetAlpha(70);
btn.AddEventMode(util.GetConstToValue("TMEVENTTYPE_MOUSEENTER") |
util.GetConstToValue("TMEVENTTYPE_MOUSELEAVE") |
util.GetConstToValue("TMEVENTTYPE_MOUSEDOWN") |
util.GetConstToValue("TMEVENTTYPE_MOUSEMOVE") |
util.GetConstToValue("TMEVENTTYPE_MOUSEUP"));
}
// OnUI_MouseUp Event Function
void CSampleDlg::OnUI_MouseUpTalmapxctrl1(LPDISPATCH Obj, long Flag, long X, long Y)
{
CXUIObj object = Obj;
switch(object.GetUIID()) {
case 11: OnSmLevelup(); break;
case 12: OnSmLevelDown(); break;
}
}
// OnUI_Click Event Function
void CSampleDlg::OnUI_ClickTalmapxctrl1(LPDISPATCH Obj, long Flag, long X, long Y)
{
CXUIObj object = Obj;
if (object.GetUIID() == 10) {
MessageBox(object.GetCaption() + "is Clicked!!", "OK");
}
}
// OnUI_MouseHover Event Function
void CSampleDlg::OnUI_MouseHoverTalmapxctrl1(LPDISPATCH Obj)
{
CXUIObj object = Obj;
if (object.GetUIID() == 10) {
object.SetAlpha(0);
}
}
// OnUI_MouseLeave Event Function
|
|
|
|
See Also
|
|
Map Preview
|
|