Картография Bada — от сложного к простому


Здравствуйте! Сегодня я написал топик, посвященный решению задачи загрузки карты в смартфон с Bada и некоторым простым манипуляциям с ней. Откровенно говоря, способ сложный, требующий обилия кода и при этом сама карта не балует детальностью. К счастью, есть способ сделать тоже самое попроще, и при этом убить двух вальдшнепов одним патроном — использовать детальные карты Google (или Yandex — вот почему-то в Украине Google наполовину впереди Яндекса ?) и при этом манипуляции с картой обеспечиваются более простым способом — привычным JavaScript.
(Для новичков в Bada есть мой первый топик)

Приступим.


Идея


Идея будет заключаться в следующем — мы будем использовать возможности HTTP-компонентов Bada, загружая реальную карту Google Maps на форму и отображая её имеющимся элементом управления.

Реализация


Создадим form-based приложение, перейдем в заголовочный файл формы и сразу добавим в include секцию файл «FWeb.h», что обеспечит нас возможностью использования HTTP-компонентов. Затем в private секции класса формы объявим ссылку на Web-браузер так:

Osp::Web::Controls::Web *__pWeb;


Теперь вернемся в реализацию класса формы и объявим там пространство имен:

using namespace Osp::Web::Controls;


Не забудем в конструкторе формы проинициализировать __pWeb.

Почти готово:)

Найдем здесь же метод 
OnInitializing(void)
и там создадим браузер таким образом, чтобы он занимал всю клиентскую область формы (метод GetClientAreaBounds()), добавим его к формк и загрузим в него некий URL:

__pWeb = new Web();
r = __pWeb->Construct( GetClientAreaBounds());
 AddControl(*__pWeb);
__pWeb->LoadUrl(L"http://www.google.com");


Уже ради интереса можно запустить приложение и посмотреть как оно выглядит. У меня вот так:



Вот здесь можно вклиниться со своим файлом html. В папке проекта Res разместим файл test_map.html со следующим содержанием (за простым описанием возможностей Google Maps API можно обратиться сюда, спасибо автору!):

<html>
<head>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
  var map;
  function initialize() {
    var latlng = new google.maps.LatLng(48, 37.8);
    var myOptions = {
      zoom: 8,
      center: latlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
  }

</script>
</head>
<body onload="initialize()">
  <div id="map_canvas" style="width:100%; height:100%"></div>
</body>
</html>


и изменим предыдущий вызов loadUrl так, чтобы он указывал на test_map.html:

__pWeb->LoadUrl(L"/Res/test_map.html");


Запустим симулятор и полюбуемся на получившееся:



Как же выполнить что-нибудь с этой картой? Просто:)
Добавим к форме программную кнопку (SoftKey) — подробности можно найти в моих предыдущих статьях — и назначим ей идентификатор и «слушатель » события нажатия на кнопку.

    SetSoftkeyActionId(SOFTKEY_0,ID_ZOOM_IN);
    AddSoftkeyActionListener(SOFTKEY_0,*this);


Предварительно, константа ID_ZOOM_IN должна быть объявлена в ptotected секции класса формы.

Обработчик нажатия на эту кнопку будет находиться в методе формы actionPerformed, где надо проанализировать параметр actionId. Сделайте это таким образом: 

void
FormGoogleMapBada::OnActionPerformed(const Osp::Ui::Control& source, int actionId)
{
	
	switch(actionId)
	{
	case ID_ZOOM_IN:
		{
			Zoom++;
			__pWeb->EvaluateJavascriptN(L"map.setZoom("+Integer::ToString(Zoom)+");");

		}
		break;
	default:
		break;
	}
}


(И я знаю, конечно, что такое printf-форматирование:)))

Единственной пояснение здесь простое — функция EvaluateJavascriptN работает также как функция eval из JavaScript, выполняя строку как код.

Запустим и посмотрим (для сравнения см. снимок выше):



По-моему, гораздо более гибкий и мощный способ использования карт в Bada, в отличие от стандартного. Даже несмотря на то, что здесь для отображения используется промежуточный слой — web-браузер — и на симуляторе и на смартфоне я разницы в быстродействии не почувствовал. А классное API Google Maps говорит само за себя.

UPD: Забыл… Скачать пример можно здесь.