лично я вообще не понял как должна выглядеть эта стрелка и как/куда она будет двигаться. может картинка есть?

надо было сказать «как в спидометре»

твой Rectangle — это внешняя черная окружность? не вижу чем рисование стрелки отличается от рисования любой из рисочек. ты знаешь угол наклона стрелки, а ее длина — это радиус большой окружности минус радиус маленькой.

для анимации надо всего лишь угол стрелки изменить, что поменяет координаты ее Shape'а.

давай так. какие у тебя входные данные? т.е. по каким данным ты собираешься строить стрелку?

глядя на картинку, предполагаю, что у тебя всё нарисовано кроме стрелки (соответственно, в qml доступны все видимые объекты). из С++ будет приходить значение «скорости» от 0 до 1.2?

«невидимый прямоугольник» — это ж просто координаты обрамляющего стрелку прямоугольника, насколько я понимаю?

модифицируем предыдущий пример с отметками в часах так, чтобы каждая отметка стала стрелочкой. по сути нам надо лишь добавить две линии (правый и левый кусок стрелки) в ShapePath. будем пользоваться теми же соображениями о полярных координатах: нам надо просто отклонить кусок стрелки от отметки на заданный угол (т.е. добавить или вычесть угол стрелки из угла отметки). также для удобства вычислений введем функции конвертации полярных координат в обычные (декартовы).

в твоем случае стрелка двумерная, но это ничего принципиально не меняет. кончик стрелки как раз будет указывать на отметку. зачем тебе передавать координаты стрелки в С++ я не очень понял, ты ж можешь наоборот их оттуда и брать.

надеюсь, суть подхода ясна как видишь, никакие стороны для стрелки определять отдельно не надо, всё работает «само по себе».

import QtQuick 2.15
import QtQuick.Controls 2.15
import QtQuick.Window 2.15
import QtQuick.Layouts 1.3
import QtQuick.Shapes 1.15
 
Window {
	readonly property real quarterLength: 50
	readonly property real minuteLength: 20
	readonly property real arrowAngle: Math.PI / 6 // 30
	readonly property real arrowLength: 15
 
	width: 640
	height: 480
	visible: true
	title: qsTr("Hello World")
 
	function polarLineX(angle, length) {
		return length * Math.cos(angle)
	}
	function polarLineY(angle, length) {
		return length * Math.sin(angle)
	}
 
	Rectangle {
		id: circle
 
		anchors.centerIn: parent
		width: Math.min(parent.width, parent.height)
		height: width
 
		radius: width / 2
		border.color: "red"
 
		Repeater {
			id: tickmarks
 
			model: 12
			Shape {
				id: tickmark
				required property int index
				readonly property real phi: index * 2 * Math.PI / tickmarks.count
 
				x: polarLineX(phi, circle.radius)
				y: polarLineY(phi, circle.radius)
				transform: Translate {
					x: circle.radius
					y: circle.radius
				}
 
				ShapePath {
					strokeColor: "blue"
					strokeWidth: 1
 
					PathLine {
						readonly property real tickmarkLength: index % 3 == 0 ? quarterLength : minuteLength
						x: polarLineX(tickmark.phi, -tickmarkLength)
						y: polarLineY(tickmark.phi, -tickmarkLength)
					}
 
					PathMove {
						x: 0
						y: 0
					}
					PathLine {
						readonly property real angle: tickmark.phi + arrowAngle
						x: polarLineX(angle, -arrowLength)
						y: polarLineY(angle, -arrowLength)
					}
 
					PathMove {
						x: 0
						y: 0
					}
					PathLine {
						readonly property real angle: tickmark.phi - arrowAngle
						x: polarLineX(angle, -arrowLength)
						y: polarLineY(angle, -arrowLength)
					}
				}
			}
		}
	}
}
 

Может быть я не правильно понимаю ваш пример кода, но все тикмарки стали стрелками?)
Мне же надо 1 стрелку сделать, https://ibb.co/2Mj9qX6 вот она. Я по этому и писал что стрелка это 5 точек.
По этому и писал про 2 варианта создания стрелки, или внутри rectangle и его поворачивать по нужному углу, или без rectangle но тогда все точки пересчитывать.

да. это сделано для примера, т.к. я подумал, что у тебя трудности с рисованием кончика твоей стрелки (диагональных линий). адаптировать уже надо самому
ну тут вопрос откуда ты хочешь координаты стрелки брать. раз ты говоришь, что тебе в итоге их все равно надо в С++ отправить, то проще там сразу их и вычислить как я написал выше (и не придется трогать полярные координаты), а в QML просто нарисовать Shape/ShapePath по вычисленным координатам (можно забайндить на свойство С++ объекта, которое будет отдавать полигон, тогда все будет работать автоматически, без какого-либо императивного жс кода). Shape — это ведь Item со всеми вытекающими, поэтому непонятно зачем нужен дополнительный невидимый Rectangle.
как короткую нарисовать я уже писал выше (длина = радиус1 - радиус2), да и это ж ровно то же самое, что и отметки рисовать, просто линия не одна.

в твоем примере кода стрелка — это Rectangle, но ведь можно ее сразу Shape делать. Да и координаты там явно как-то должны зависеть от размера рута.

до сих пор не могу понять в чем именно у тебя проблема айтем стрелки нарисовать? повернуть его можно через свойство rotation / transform.

да, можно стрелку и через PathPolyline нарисовать (можно и через набор PathLine).
они как раз завязаны, рисование выполняется последовательно от «текущей точки». мы начинаем с границы окружности и рисуем рисочку, текущая точка становится концом рисочки. но оба куска стрелки мы хотим начать с границы окружности, поэтому возвращаемся в исходную точку 0,0.

вот пример. здесь мы определяем размер стрелки через относительные величины, а потом масштабируем ее до нужного размера через scale (можно и сразу задавать координаты с учетом размера, это не столь существенно). также тут есть небольшая хитрость: стрелка приклеена к маленькой окружности (для случая в 0 градусов), а дальше мы просто выполняем вращение этой окружности, чтоб установить стрелку в нужное положение. в качестве альтернативы можно окружность не вращать, а вращать эфемерный айтем-родитель для стрелки (он будет иметь anchors.fill: smallCircle). но если ты будешь в коде считать координаты заранее, то в этой хитрости нет необходимости.

Rectangle {
	id: smallCircle
	readonly property real angle: 31
 
	anchors.centerIn: parent
	width: circle.radius / 3
	height: width
 
	radius: width / 2
	border.color: "black"
 
	rotation: angle
 
	Shape {
		id: arrow
		readonly property real arrowLength: circle.radius - smallCircle.radius
		readonly property real arrowWidth: 10
		readonly property real arrowRelativeLength: 6
		readonly property real arrowTipRelativeLength: 2
 
		anchors.verticalCenter: parent.verticalCenter
		anchors.left: parent.right
 
		ShapePath {
			fillColor: "black"
			scale: Qt.size(arrow.arrowLength / arrow.arrowRelativeLength, arrow.arrowWidth)
 
			PathPolyline {
				readonly property point topLeft: Qt.point(0, 1)
				path: [
					topLeft,
					Qt.point(arrow.arrowRelativeLength - arrow.arrowTipRelativeLength, 1),
					Qt.point(arrow.arrowRelativeLength, 0),
					Qt.point(arrow.arrowRelativeLength - arrow.arrowTipRelativeLength, -1),
					Qt.point(0, -1),
					topLeft,
				]
			}
		}
	}
}

просто добавить этот элемент после репитера.