Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Native Development

Reply
Developer
Posts: 313
Registered: ‎03-13-2013
My Device: Z10
My Carrier: Tim
Accepted Solution

Add pin in a MapView

I have a mapview and an actonitem that it leaves a pin in the map. If it possible to put the pin when the mapview appear in the page without use the actionitem?

If this post is helpful, please click the "like" button! Smiley Happy
Developer
Posts: 6,152
Registered: ‎07-05-2012
My Device: Playbook, Dev Alpha C, Z10 LE, Z30
My Carrier: Orange

Re: Add pin in a MapView

Not sure what your actual problem is here?

 

Are you asking about how to store the marker, i.e. QSettings.

Are you asking how to place the marker back in, i.e. onCreationCreated() slot.

 

Or just how to use the marker...

 

http://developer.blackberry.com/native/reference/cascades/bb__platform__geo__marker.html


If you've been helped click on Like Button, if you've been saved buy the app. Smiley Happy

Developer of stokLocker, Sympatico and Super Sentences.
Developer
Posts: 313
Registered: ‎03-13-2013
My Device: Z10
My Carrier: Tim

Re: Add pin in a MapView

Hi BBSJdev, I already have the pin but i want that is in the map when I open the page and not add it with an actionitem. I try onCreationCompleted of the mapview but doesn't work
If this post is helpful, please click the "like" button! Smiley Happy
Developer
Posts: 6,152
Registered: ‎07-05-2012
My Device: Playbook, Dev Alpha C, Z10 LE, Z30
My Carrier: Orange

Re: Add pin in a MapView

Okay there could be may reasons for that, could you post your code?

If you've been helped click on Like Button, if you've been saved buy the app. Smiley Happy

Developer of stokLocker, Sympatico and Super Sentences.
Developer
Posts: 313
Registered: ‎03-13-2013
My Device: Z10
My Carrier: Tim

Re: Add pin in a MapView

import bb.cascades 1.2
import bb.platform 1.2
import QtMobility.sensors 1.3
import bb.cascades.maps 1.0
import QtMobilitySubset.location 1.2

Page {

    actions: [

        ActionItem {
            imageSource: "asset:///images/ic_nav_to.png"
            title: qsTr("Go")
            ActionBar.placement: ActionBarPlacement.OnBar
            onTriggered: {
                routeInvoker.endLatitude = itemLatitude
                routeInvoker.endLongitude = itemLongitude
                routeInvoker.go()
            }
        },
        ActionItem {
            title: qsTr("Drop Pin")
            imageSource: "asset:///images/pin.png"
            ActionBar.placement: ActionBarPlacement.OnBar
            onTriggered: {
                pinContainer.addPin(mapview2.latitude, mapview2.longitude);
            }
        }
    ]

    property alias itemPageTitle: titlebar.title
    property alias itemName: label1.text
    property alias itemLinea: label2.text
    property alias itemAddress: label3.text
    property alias itemCity: label4.text
    property alias itemLatitude: label5.text
    property alias itemLongitude: label6.text

    titleBar: TitleBar {
        id: titlebar
    }

    Container {

        minHeight: 3
        Label {
            text: qsTr("Station details")
            textStyle.fontSize: FontSize.Large
            textStyle.fontWeight: FontWeight.Bold
            textStyle.fontStyle: FontStyle.Italic
        }
        Divider {
            minHeight: 2
        }
        Container {
            layout: StackLayout {
                orientation: LayoutOrientation.LeftToRight
            }
            Label {
                text: qsTr("Station name:")
                textStyle.fontStyle: FontStyle.Italic
                textStyle.fontWeight: FontWeight.Bold
            }
            Label {
                id: label1
            }
        }
        Container {
            layout: StackLayout {
                orientation: LayoutOrientation.LeftToRight
            }
            Label {
                text: qsTr("Line:")
                textStyle.fontStyle: FontStyle.Italic
                textStyle.fontWeight: FontWeight.Bold
            }
            Label {
                id: label2
            }
        }
        Container {
            layout: StackLayout {
                orientation: LayoutOrientation.LeftToRight
            }
            Label {
                text: qsTr("Address:")
                textStyle.fontStyle: FontStyle.Italic
                textStyle.fontWeight: FontWeight.Bold
            }
            Label {
                id: label3
            }
        }
        Container {
            layout: StackLayout {
                orientation: LayoutOrientation.LeftToRight
            }
            Label {
                text: qsTr("City:")
                textStyle.fontStyle: FontStyle.Italic
                textStyle.fontWeight: FontWeight.Bold
            }
            Label {
                id: label4
            }
        }
        Container {
            layout: StackLayout {
                orientation: LayoutOrientation.LeftToRight
            }
            Label {
                text: qsTr("Latitude:")
                textStyle.fontStyle: FontStyle.Italic
                textStyle.fontWeight: FontWeight.Bold
            }
            Label {
                id: label5
            }
        }
        Container {
            layout: StackLayout {
                orientation: LayoutOrientation.LeftToRight
            }
            Label {
                text: qsTr("Longitude:")
                textStyle.fontStyle: FontStyle.Italic
                textStyle.fontWeight: FontWeight.Bold
            }
            Label {
                id: label6
            }
        }
        Container {
            id: root
            layout: DockLayout {
            }
            MapView {
                id: mapview2
                altitude: 1000
                latitude: itemLatitude
                longitude: itemLongitude
                preferredWidth: 768
                preferredHeight: 1280
                
            }
            Container {
                id: pinContainer
                // Must match the mapview width and height and position
                preferredHeight: 1280
                preferredWidth: 768
                //touchPropagationMode: TouchPropagationMode.PassThrough
                overlapTouchPolicy: OverlapTouchPolicy.Allow
                property variant currentBubble
                property variant me
                layout: AbsoluteLayout {
                }
                function addPin(lat, lon) {
                    var marker = pin.createObject();
                    marker.lat = lat;
                    marker.lon = lon;
                    var xy = _mapViewTest2.worldToPixelInvokable(mapview2, marker.lat, marker.lon);
                    marker.x = xy[0];
                    marker.y = xy[1];
                    pinContainer.add(marker);
                    marker.animDrop.play();
                }
                function showBubble(pin) {
                    pinContainer.remove(currentBubble);
                    var details = bubble.createObject();
                    details.lat = pin.lat;
                    details.lon = pin.lon;
                    var xy = _mapViewTest2.worldToPixelInvokable(mapview2, details.lat, details.lon);
                    details.x = xy[0];
                    details.y = xy[1];
                    pinContainer.add(details);
                    details.play();
                    currentBubble = details;
                }
                function showMe() {
                    var marker = pin.createObject();
                    marker.pinImageSource = "asset:///images/me.png"
                    marker.pointerOffsetX = 30
                    marker.pointerOffsetY = 30
                    pinContainer.insert(-1, marker);
                    marker.visible = false;
                    me = marker;
                }
                function updateMarkers() {
                    _mapViewTest2.updateMarkers(mapview2, pinContainer);
                }
                function removeBubble() {
                    pinContainer.remove(currentBubble);
                }
                onTouch: {
                    if (event.isDown()) {
                        if ((event.localX <= currentBubble.actualX) || (event.localX >= currentBubble.actualX + currentBubble.contentWidth) || (event.localY <= currentBubble.actualY) || (event.localY >= currentBubble.actualY + currentBubble.contentHeight)) {
                            removeBubble();
                        }
                    }
                }
            }
        }
        attachedObjects: [
            ComponentDefinition {
                id: pin
                source: "pin.qml"
            },
            ComponentDefinition {
                id: bubble
                source: "bubble.qml"
            },
            RouteMapInvoker {
                id: routeInvoker
                centerLatitude: startLatitude
                centerLongitude: startLongitude
            } 
        ]
    }
}

 I try the onCreationCompleted but nothing

MapView {
                id: mapview2
                altitude: 1000
                latitude: itemLatitude
                longitude: itemLongitude
                preferredWidth: 768
                preferredHeight: 1280
                onCreationCompleted: {
                    pinContainer.addPin(mapview2.latitude, mapview2.longitude); 
                }
            }

 

If this post is helpful, please click the "like" button! Smiley Happy
Developer
Posts: 6,152
Registered: ‎07-05-2012
My Device: Playbook, Dev Alpha C, Z10 LE, Z30
My Carrier: Orange

Re: Add pin in a MapView

It could be that something is not initialised at the point you are calling it, try putting in some console.debug() statements to make sure, especially on the item properties and in the addPin() function.


If you've been helped click on Like Button, if you've been saved buy the app. Smiley Happy

Developer of stokLocker, Sympatico and Super Sentences.
Developer
Posts: 1,746
Registered: ‎04-08-2010
My Device: Passport Silver, PRIV
My Carrier: Telekom.de, O2, Vodafone

Re: Add pin in a MapView

unfortunately there's no signal to know that the MapView is "ready"

you cannot use onCreationCompleted{}

 

you can experiment to use a QTimer to have some delay

-------------------------------------------------------------------------------
ekke (independent software architect, rosenheim, germany)

BlackBerry Elite Developer
BlackBerry Platinum Enterprise Partner
International Development native Mobile Business Apps
BlackBerry 10 | Qt Mobile (Android, iOS)
Workshops / Trainings / Bootcamps

blog: http://ekkes-corner.org
mobile-development: http://appbus.org Twitter: @ekkescorner
Developer
Posts: 313
Registered: ‎03-13-2013
My Device: Z10
My Carrier: Tim

Re: Add pin in a MapView

If it's possible to block the mapview? I wish that you could not move from that point

If this post is helpful, please click the "like" button! Smiley Happy
Developer
Posts: 313
Registered: ‎03-13-2013
My Device: Z10
My Carrier: Tim

Re: Add pin in a MapView

This is the workaround that I found, I think it's not the best method but for my case it's ok

 

MapView {
                id: mapview
                altitude: 800
                latitude: itemLatitude
                longitude: itemLongitude
                preferredWidth: 768
                preferredHeight: 1280
                
                onLatitudeChanged: {
                    pinContainer.addPin(itemLatitude, itemLongitude);
                }
                onLongitudeChanged: {
                    pinContainer.addPin(itemLatitude, itemLongitude);
                }
                onRequestRender: {
                    pinContainer.updateMarkers();
                }
                touchPropagationMode: TouchPropagationMode.None
            }

 

If this post is helpful, please click the "like" button! Smiley Happy
Developer
Posts: 17,012
Registered: ‎07-29-2008
My Device: Z10 LE, Z30, Passport
My Carrier: O2 Germany

Re: Add pin in a MapView

To add to this old post, this is my Q_INVOKABLE method to drop a pin:

 

GeoLocation* newDrop = new GeoLocation();
newDrop->setLatitude(mapView->latitude());
newDrop->setLongitude(mapView->longitude());
mapView->mapData()->clear();
mapView->mapData()->add(newDrop);

loosely based on the MapView sample.

----------------------------------------------------------
feel free to press the like button on the right side to thank the user that helped you.
please mark posts as solved if you found a solution.
@SimonHain on twitter