QGraphicsView实现简易地图4『局部加载-地图漫游』

这篇具有很好参考价值的文章主要介绍了QGraphicsView实现简易地图4『局部加载-地图漫游』。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

前文链接:QGraphicsView实现简易地图3『局部加载-地图缩放』
当鼠标拖动地图移动时,需要实时增补和删减瓦片地图,大致思路是计算地图从各方向移动时进出视口的瓦片坐标值,根据变化后的瓦片坐标值来增减地图瓦片,以下将提供实现此需求的核心代码。
1、动态演示效果


2、静态展示图片
QGraphicsView实现简易地图4『局部加载-地图漫游』,地图,qt,开发语言

核心代码文章来源地址https://www.toymoban.com/news/detail-642659.html

void MapView::moveScene()
{
	QString appPath = QApplication::applicationDirPath();
	QString dirPath = QString("%1/MapData/GaoDeMap/Map/MapPng/L0%2").arg(appPath).arg(m_curLevel + 1);
	// 视口宽度和高度
	int vw = viewport()->width();
	int vh = viewport()->height();

	// 计算呈现的瓦片地图左上角的场景坐标和视口坐标、呈现的瓦片地图右下角的场景坐标和视口坐标
	QPoint topLeftScenePos(m_topLeftTileCoord.x * PIXMAP_SIZE, m_topLeftTileCoord.y * PIXMAP_SIZE);
	QPointF topLeftViewPos = mapFromScene(topLeftScenePos);
	QPoint bottomRightScenePos(m_bottomRightTileCoord.x * PIXMAP_SIZE, m_bottomRightTileCoord.y * PIXMAP_SIZE);
	QPointF bottomRightViewPos = mapFromScene(bottomRightScenePos);

	int mapSideCount = pow(2, m_curLevel);
	
	if (MapUtility::sceneSize(m_curLevel) > vw)
	{
		// 1、水平瓦片坐标控制:判断最左侧瓦片是否完全进入视口、最右侧瓦片是否完全离开视口
		if (topLeftViewPos.x() > 0)
		{
			int count = qCeil(topLeftViewPos.x() / PIXMAP_SIZE);	// 左侧进入视口瓦片数量
			int oldLeftTileCoordX = m_topLeftTileCoord.x;			// 保存原左侧瓦片坐标X
			m_topLeftTileCoord.x -= count;							// 更新现左侧瓦片坐标X
			if (m_topLeftTileCoord.x < 0)
				m_topLeftTileCoord.x = 0;

			// 增加从左侧进入视口的图片
			for (int row = m_topLeftTileCoord.y; row <= m_bottomRightTileCoord.y; ++row)
			{
				for (int col = m_topLeftTileCoord.x; col < oldLeftTileCoordX; ++col)
				{
					QString fileName = QString("%1/Map_%2-%3.png").arg(dirPath)
						.arg(QString::number(row + 1).rightJustified(2, '0')).arg(QString::number(col + 1).rightJustified(2, '0'));
					QPixmap pixmap(fileName);
					QGraphicsPixmapItem *item = new QGraphicsPixmapItem(pixmap);
					item->setPos(PIXMAP_SIZE * col, PIXMAP_SIZE * row);
					m_scene->addItem(item);
					m_mapItems[row][col] = item;
				}
			}
		}
		if (bottomRightViewPos.x() > vw)
		{
			int count = qFloor((bottomRightViewPos.x() - vw) / PIXMAP_SIZE) + 1;	// 右侧离开视口瓦片数量
			int oldRightTileCoordX = m_bottomRightTileCoord.x;					// 保存原右侧瓦片坐标X
			m_bottomRightTileCoord.x -= count;									// 更新现右侧瓦片坐标X
			if (m_bottomRightTileCoord.x < 0)
				m_bottomRightTileCoord.x = 0;

			// 删除从右侧离开视口的图片
			for (int row = m_topLeftTileCoord.y; row <= m_bottomRightTileCoord.y; ++row)
			{
				for (int col = oldRightTileCoordX; col > m_bottomRightTileCoord.x; --col)
				{
					QGraphicsPixmapItem *item = m_mapItems[row][col];
					m_scene->removeItem(item);
					m_mapItems[row].remove(col);
					delete item;
				}
			}
		}

		// 2、水平瓦片坐标控制:判断最右侧瓦片是否完全进入视口、最左侧瓦片是否完全离开视口
		if (bottomRightViewPos.x() + 255 < vw)
		{
			int count = qCeil((vw - (bottomRightViewPos.x() + 255)) / PIXMAP_SIZE);	// 右侧进入视口瓦片数量
			int oldRightTileCoordX = m_bottomRightTileCoord.x;						// 保存原右侧瓦片坐标X
			m_bottomRightTileCoord.x += count;										// 保存现右侧瓦片坐标X
			if (m_bottomRightTileCoord.x >= mapSideCount)
				m_bottomRightTileCoord.x = mapSideCount - 1;

			// 增加从右侧进入视口的图片
			for (int row = m_topLeftTileCoord.y; row <= m_bottomRightTileCoord.y; ++row)
			{
				for (int col = m_bottomRightTileCoord.x; col > oldRightTileCoordX; --col)
				{
					QString fileName = QString("%1/Map_%2-%3.png").arg(dirPath)
						.arg(QString::number(row + 1).rightJustified(2, '0')).arg(QString::number(col + 1).rightJustified(2, '0'));
					QPixmap pixmap(fileName);
					QGraphicsPixmapItem *item = new QGraphicsPixmapItem(pixmap);
					item->setPos(PIXMAP_SIZE * col, PIXMAP_SIZE * row);
					m_scene->addItem(item);
					m_mapItems[row][col] = item;
				}
			}
		}

		if (topLeftViewPos.x() + 255 < 0)
		{
			int count = qFloor(fabs(topLeftViewPos.x()) / PIXMAP_SIZE);	// 左侧离开视口瓦片数量
			int oldLeftTileCoordX = m_topLeftTileCoord.x;				// 保存原左侧瓦片坐标X
			m_topLeftTileCoord.x += count;								// 保存现左侧瓦片坐标X
			if (m_topLeftTileCoord.x >= mapSideCount)
				m_topLeftTileCoord.x = mapSideCount - 1;

			// 删除从左侧离开视口的图片
			for (int row = m_topLeftTileCoord.y; row <= m_bottomRightTileCoord.y; ++row)
			{
				for (int col = oldLeftTileCoordX; col < m_topLeftTileCoord.x; ++col)
				{
					QGraphicsPixmapItem *item = m_mapItems[row][col];
					m_scene->removeItem(item);
					m_mapItems[row].remove(col);
					delete item;
				}
			}
		}
	}
	
	if (MapUtility::sceneSize(m_curLevel) > vh)
	{
		// 3、垂直瓦片坐标控制:判断最上侧瓦片是否完全进入视口,最下侧瓦片是否完全离开视口
		if (topLeftViewPos.y() > 0)
		{
			int count = qCeil(topLeftViewPos.y() / PIXMAP_SIZE);	// 上侧进入视口瓦片数量
			int oldTopTileCoordY = m_topLeftTileCoord.y;			// 保存原上侧瓦片坐标Y
			m_topLeftTileCoord.y -= count;							// 保存现上侧瓦片坐标Y
			if (m_topLeftTileCoord.y < 0)
				m_topLeftTileCoord.y = 0;

			// 增加从上侧进入视口的图片
			for (int row = m_topLeftTileCoord.y; row < oldTopTileCoordY; ++row)
			{
				for (int col = m_topLeftTileCoord.x; col <= m_bottomRightTileCoord.x; ++col)
				{
					QString fileName = QString("%1/Map_%2-%3.png").arg(dirPath)
						.arg(QString::number(row + 1).rightJustified(2, '0')).arg(QString::number(col + 1).rightJustified(2, '0'));
					QPixmap pixmap(fileName);
					QGraphicsPixmapItem *item = new QGraphicsPixmapItem(pixmap);
					item->setPos(PIXMAP_SIZE * col, PIXMAP_SIZE * row);
					m_scene->addItem(item);
					m_mapItems[row][col] = item;
				}
			}
		}

		if (bottomRightViewPos.y() > vh)
		{
			int count = qFloor((bottomRightViewPos.y() - vh) / PIXMAP_SIZE) + 1;	// 下侧离开视口瓦片数量
			int oldBottomTileCoordY = m_bottomRightTileCoord.y;					// 保存原下侧瓦片坐标Y
			m_bottomRightTileCoord.y -= count;									// 保存现下侧瓦片坐标Y
			if (m_bottomRightTileCoord.y < 0)
				m_bottomRightTileCoord.y = 0;

			// 删除从下侧离开视口的图片
			for (int row = oldBottomTileCoordY; row > m_bottomRightTileCoord.y; --row)
			{
				for (int col = m_topLeftTileCoord.x; col <= m_bottomRightTileCoord.x; ++col)
				{
					QGraphicsPixmapItem *item = m_mapItems[row][col];
					m_scene->removeItem(item);
					m_mapItems[row].remove(col);
					delete item;
				}
			}
		}

		// 4、垂直瓦片坐标控制:判断最下侧瓦片是否完全进入视口,最上侧瓦片是否完全离开视口
		if (bottomRightViewPos.y() + 255 < vh)
		{
			int count = qCeil((vh - (bottomRightViewPos.y() + 255)) / PIXMAP_SIZE);	// 下侧进入视口瓦片数量
			int oldBottomTileCoordY = m_bottomRightTileCoord.y;						// 保存原下侧瓦片坐标Y
			m_bottomRightTileCoord.y += count;										// 保存现下侧瓦片坐标Y
			if (m_bottomRightTileCoord.y >= mapSideCount)
				m_bottomRightTileCoord.y = mapSideCount - 1;

			// 增加从下侧进入视口的图片
			for (int row = m_bottomRightTileCoord.y; row > oldBottomTileCoordY; --row)
			{
				for (int col = m_topLeftTileCoord.x; col <= m_bottomRightTileCoord.x; ++col)
				{
					QString fileName = QString("%1/Map_%2-%3.png").arg(dirPath)
						.arg(QString::number(row + 1).rightJustified(2, '0')).arg(QString::number(col + 1).rightJustified(2, '0'));
					QPixmap pixmap(fileName);
					QGraphicsPixmapItem *item = new QGraphicsPixmapItem(pixmap);
					item->setPos(PIXMAP_SIZE * col, PIXMAP_SIZE * row);
					m_scene->addItem(item);
					m_mapItems[row][col] = item;
				}
			}
		}

		if (topLeftViewPos.y() + 255 < 0)
		{
			int count = qFloor(fabs(topLeftViewPos.y()) / PIXMAP_SIZE);	// 上侧离开视口瓦片数量
			int oldTopTileCoordY = m_topLeftTileCoord.y;				// 保存原上侧瓦片坐标Y
			m_topLeftTileCoord.y += count;								// 保存现上侧瓦片坐标Y
			if (m_topLeftTileCoord.y >= mapSideCount)
				m_topLeftTileCoord.y = mapSideCount - 1;

			// 删除从上侧离开视口的图片
			for (int row = oldTopTileCoordY; row < m_topLeftTileCoord.y; ++row)
			{
				for (int col = m_topLeftTileCoord.x; col <= m_bottomRightTileCoord.x; ++col)
				{
					QGraphicsPixmapItem *item = m_mapItems[row][col];
					m_scene->removeItem(item);
					m_mapItems[row].remove(col);
					delete item;
				}
			}
		}
	}
}

到了这里,关于QGraphicsView实现简易地图4『局部加载-地图漫游』的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • QGraphicsView 实例3地图浏览器

    主要介绍Graphics View框架,实现地图的浏览、放大、缩小,以及显示各个位置的视图、场景和地图坐标 效果图:  mapwidget.h  mapwidget.cpp

    2024年02月12日
    浏览(25)
  • 【Qt图形视图框架】自定义QGraphicsItem和QGraphicsView,实现鼠标(移动、缩放)及键盘事件、右键事件

    说明 在使用Qt的图形视图框架实现功能时,一般会在其基础上进行自定义功能实现。 如:滚轮对场景的缩放,鼠标拖动场景中的项,以及可以在场景中进行右键操作等。 示例 myitem 为自定义QGraphicsItem,实现了边框、重绘事件、鼠标悬停、按键、右键菜单等功能。 myitem.h myi

    2024年02月04日
    浏览(37)
  • qt中使用QGIS实现二次开发导入shp格式地图(MSVC2019_64bit+qt5.15+qgis)

    在qt开发过程中可能要导入自定义格式的图层地图,那么可以把这些数据导入qgis然后导出为shp格式文件,然后下载qgis源码,在qt项目中配置环境变量导入qgis有关的头文件,然后再引入shp数据格式的地图。 QGIS安装 QGIS安装 QGIS导入数据 然后保存点击Layer-save as导出为shp格式文件

    2024年02月05日
    浏览(40)
  • el-tree 懒加载数据,增删改时局部刷新实现

    1.数据过多时进行懒加载孩子节点,根据层级传参获取后端孩子数据 懒加载主要部分: 1参数:         :load=\\\"loadNode\\\"          lazy         :props=\\\"defaultProps\\\" 2.defaultProps  需要设置isLeaf: \\\'isLeaf\\\',去除最后一层孩子节点的展开图表       defaultProps: {           childre

    2024年02月14日
    浏览(32)
  • Qt中QGraphicsView总体架构学习

    前段时间学习了下如何在QGraphicsView架构中绘制刻度尺,主要是与OnPainter中进行比较的,那么今天就来详细讲解下我对QGraphicsView框架的认知吧~ 最近一段时间想学习下,如果我有不正确的,欢迎留言探讨哟~ 使用过OnPainter绘制过图形的,QPainter绘制需要在绘制设备的paintEvent()事

    2024年02月02日
    浏览(26)
  • Qt开发简易蓝牙调试助手(低功耗蓝牙)

    Qt中是有蓝牙模块的,直接用此模块开发就行。但是注意使用的是低功耗蓝牙的类,连接方式和经典蓝牙会有区别 大致的连接步骤是: 搜索附近的蓝牙设备 连接指定的蓝牙设备 获取服务 指定服务进行连接(因为每一种下的特征对象的权限是不一样的,有的只有读取权限,没

    2024年02月16日
    浏览(28)
  • 介绍 QT 的 QGraphicsView 和 QGraphicsScene

    当绘制复杂的图形或实现交互式图形应用程序时,可以使用 QGraphicsView 和 QGraphicsScene 来进行绘图。 QGraphicsScene: QGraphicsScene 是一个场景,可以容纳和管理图形项(QGraphicsItem)。它提供了一个二维坐标系统,可以在其中添加、删除和管理图形项。您可以在 QGraphicsScene 中添加多

    2024年01月20日
    浏览(39)
  • Qt中QGraphicsView架构下实时鼠标绘制图形

    上一章节介绍了关于QGraphicsView的基础讲解,以及简单的类图创建,由上一章节中最后展示的动画效果来看,今年主要讲述如何在QGraphicsView架构下,实时拖动鼠标绘制图形! 今天主要以矩形为例,再来看一下展示效果吧! 想要实现鼠标拖拽绘图的效果,离不开鼠标的三大事件

    2024年01月22日
    浏览(35)
  • QT QGraphicsView 在鼠标点击处进行放大缩小

    一、前段时间在用QGraphicsView对图元进行放大缩小时,发现图形总是越来越跑偏,无法像地图中那样,点击哪里就能放大哪个地方。 如下所示:此时放大缩小的焦点并不在鼠标位置 方法,使用QGraphicsView类的设置属性函数.在构造函数中增加下面两个函数即可。 此时以鼠标为中

    2024年02月16日
    浏览(32)
  • QT QGraphicsView 提升到 QChartView报错 解决方案

    本文主要描述, 使用QT提供的QChartView来绘制图表,提升QGraphicsView控件 继承QChartView后,然后将QGraphicsView提升到我们自己写的类,怎么才能确保提升后编译不报错. 临时方案(主要是修改ui_xxxx.h文件) 终极解决方案(针对网上好多方案都是修改ui_xxx.h文件,然后重新编译后又报错,又要修改

    2024年02月05日
    浏览(28)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包