【QT】QT的学习:在qml的地图中如何让某一个图标旋转

在地图中,如何让marker旋转,例如:地图中车辆的朝向的变化意味着图标要进行旋转。


import QtQuick 2.4
import QtQuick.Window 2.2
import QtPositioning 5.5
import QtQuick.Controls 1.4
import QtLocation 5.9
import QtPositioning 5.5

Window {
    width: 700
    height: 500
    visible: true

    Map {
        id: mapOfEurope
        anchors.centerIn: parent;
        anchors.fill: parent

        plugin: Plugin {
            name: "mapboxgl"

            PluginParameter {
                name: "mapboxgl.mapping.items.insert_before"
                value: "road-label-small"
            }

            PluginParameter {
                name: "mapboxgl.access_token"
                value: "pk.eyJ1IjoidG1wc2FudG9zIiwiYSI6ImNqMWVzZWthbDAwMGIyd3M3ZDR0aXl3cnkifQ.FNxMeWCZgmujeiHjl44G9Q"
            }

            PluginParameter {
                name: "mapboxgl.mapping.additional_style_urls"
                value: "mapbox://styles/mapbox/navigation-guidance-day-v2,mapbox://styles/mapbox/navigation-guidance-night-v2,mapbox://styles/mapbox/navigation-preview-day-v2,mapbox://styles/mapbox/navigation-preview-night-v2"
            }
        }
        center: QtPositioning.coordinate(52.5175, 13.384)

        MapQuickItem {
            id: qmlPlane1
            coordinate: QtPositioning.coordinate(52.5175, 13.384)
            anchorPoint.x: image1.width/2
            anchorPoint.y: image1.height/2
            sourceItem: Image
            {
            id:image1
            transformOrigin:Item.Center
            source:"qrc:/heavyTruck.png"}
        }
    }
    Button{
    id:buuu
    text: "press"
    onClicked: {
        image1.rotation = Math.random()*100

    }}
}

使用上面的例子发现,图标旋转都是以左上角为原点进行旋转,不能以中心旋转,自己怎么修改都有问题。因此在原有代码的基础上修改MapQuickItem,加上Grid。即:

MapQuickItem {
            id: qmlPlane1
            coordinate: QtPositioning.coordinate(52.5175, 13.384)
            anchorPoint.x: image1.width/2
            anchorPoint.y: image1.height/2
            sourceItem: Grid{
                Image
                {
                    id:image1
                    transformOrigin:Item.Center
                    source:"qrc:/heavyTruck.png"}
            }
        }

图标可以以中心旋转。欢迎指正。

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值