alex_lip
alex_lip7 августа 2018 г. 13:14

Rotate canvas QML

Разбираю пример , который должен нарисовать квадрат и такой же квадрат повернутый на 45 градусов.
Почему-то не работает ни translate ни rotate. Пример из книжки(мои только заголовки) - где может быть проблема?

import QtQuick.Window 2.2
import QtQuick 2.10
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3

import "content" ApplicationWindow { id:window visible: true width: 840 height: 480 title: qsTr("TEST")
Canvas {
id: root
width: 240; height: 120
onPaint: {
var ctx = getContext("2d")
ctx.strokeStyle = "blue"
ctx.lineWidth = 4

ctx.beginPath()
ctx.rect(-20, -20, 40, 40)
ctx.translate(120,60)
ctx.stroke()

// draw path now rotated
ctx.strokeStyle = "green"
ctx.rotate(Math.PI/4)
ctx.stroke()
}
} }
Рекомендуем хостинг TIMEWEB
Рекомендуем хостинг TIMEWEB
Стабильный хостинг, на котором располагается социальная сеть EVILEG. Для проектов на Django рекомендуем VDS хостинг.

Вам это нравится? Поделитесь в социальных сетях!

4
Evgenii Legotckoi
  • 7 августа 2018 г. 13:25
  • Ответ был помечен как решение.

Ну вот так это будет работать

import QtQuick.Window 2.2
import QtQuick 2.10
import QtQuick.Controls 2.2
import QtQuick.Layouts 1.3


//import "content"
ApplicationWindow {
    id:window
    visible: true
    width: 840
    height: 480
    title: qsTr("TEST")


    Canvas {
        anchors.centerIn: parent
        id: root
        width: 200; height: 200
        onPaint: {
            var ctx = getContext("2d")
            ctx.strokeStyle = "blue"
            ctx.lineWidth = 4

            ctx.beginPath()             // Начинаем рисовать
            ctx.translate(120,60)       // Устанавливаем translation перед началом рисования
            ctx.rect(0, 0, 40, 40)      // Отрисовываем квадрат
            ctx.stroke()                // Заканчиваем рисовать

            // draw path now rotated
            ctx.strokeStyle = "green"
            ctx.beginPath()             // Начинаем рисовать
            ctx.rotate(Math.PI/4)       // Поворачиваем
            ctx.rect(-20, -20, 40, 40)  // Отрисовываем квадрат
            ctx.stroke()                // Заканчиваем рисовать
        }
    }
}

Получается, что изменения translate и rotate нужно устанавливать перед отрисовкой квадратов. Также, если отрисовываем квадраты выходят за область Canvas, это у вас там отрицательные координаты были, то те части квадратов не отрисовываются. Возможно, это можно настроить, но нужно внимательно читать документацию, поскольку
clip: false

не сработало для того, что отрисовывается в обработчике onPaint
    alex_lip
    • 7 августа 2018 г. 14:18
    • (ред.)
    Вы два квадрата рисуете - а в примере один и тот же. Там смысл примера в том, что квадрат подготавливается, перемещается, рисуется, канвас поворачивается и опять отрисовывается .

      alex_lip
      • 7 августа 2018 г. 14:33
      Видимо пример неверен и нужно два квадрата рисовать (я немного координаты подправил чтобы результат соответствовал картинке).
      ApplicationWindow {
          id:window
          visible: true
          width: 840
          height: 480
          title: qsTr("TEST")
      
      
          Canvas {
                 anchors.centerIn: parent
                 id: root
                 width: 200; height: 200
                 onPaint: {
                     var ctx = getContext("2d")
                     ctx.strokeStyle = "blue"
                     ctx.lineWidth = 4
      
                     ctx.beginPath()             // Начинаем рисовать
                     ctx.translate(120,60)       // Устанавливаем translation перед началом рисования
                     ctx.rect(-20, -20, 40, 40)      // Отрисовываем квадрат
                     ctx.stroke()                // Заканчиваем рисовать
      
                     // draw path now rotated
                     ctx.strokeStyle = "green"
                     ctx.beginPath()             // Начинаем рисовать
                     ctx.rotate(Math.PI/4)       // Поворачиваем
                     ctx.rect(-20, -20, 40, 40)  // Отрисовываем квадрат
                     ctx.stroke()                // Заканчиваем рисовать
                 }
             }
      
      }
      





        Evgenii Legotckoi
        • 7 августа 2018 г. 14:38

        Мне тоже кажется, что пример ошибочный.. просто совсем никак иначе не работает.

          Комментарии

          Только авторизованные пользователи могут публиковать комментарии.
          Пожалуйста, авторизуйтесь или зарегистрируйтесь
          B

          C++ - Тест 002. Константы

          • Результат:16баллов,
          • Очки рейтинга-10
          B

          C++ - Тест 001. Первая программа и типы данных

          • Результат:46баллов,
          • Очки рейтинга-6
          FL

          C++ - Тест 006. Перечисления

          • Результат:80баллов,
          • Очки рейтинга4
          Последние комментарии
          k
          kmssr9 февраля 2024 г. 5:43
          Qt Linux - Урок 001. Автозапуск Qt приложения под Linux как сделать автозапуск для флэтпака, который не даёт создавать файлы в ~/.config - вот это вопрос ))
          АК
          Анатолий Кононенко5 февраля 2024 г. 12:50
          Qt WinAPI - Урок 007. Работаем с ICMP Ping в Qt Без строки #include <QRegularExpressionValidator> в заголовочном файле не работает валидатор.
          EVA
          EVA25 декабря 2023 г. 21:30
          Boost - статическая линковка в CMake проекте под Windows Ошибка LNK1104 часто возникает, когда компоновщик не может найти или открыть файл библиотеки. В вашем случае, это файл libboost_locale-vc142-mt-gd-x64-1_74.lib из библиотеки Boost для C+…
          J
          JonnyJo25 декабря 2023 г. 19:38
          Boost - статическая линковка в CMake проекте под Windows Сделал всё по-как у вас, но выдаёт ошибку [build] LINK : fatal error LNK1104: не удается открыть файл "libboost_locale-vc142-mt-gd-x64-1_74.lib" Хоть убей, не могу понять в чём дел…
          G
          Gvozdik19 декабря 2023 г. 8:01
          Qt/C++ - Урок 056. Подключение библиотеки Boost в Qt для компиляторов MinGW и MSVC Для решения твой проблемы добавь в файл .pro строчку "LIBS += -lws2_32" она решит проблему , лично мне помогло.
          Сейчас обсуждают на форуме
          P
          Pisych27 февраля 2023 г. 15:04
          Как получить в массив значения из связанной модели? Спасибо, разобрался:))
          AC
          Alexandru Codreanu19 января 2024 г. 22:57
          QML Обнулить значения SpinBox Доброго времени суток, не могу разобраться с обнулением значение SpinBox находящего в делегате. import QtQuickimport QtQuick.ControlsWindow { width: 640 height: 480 visible: tr…
          BlinCT
          BlinCT27 декабря 2023 г. 19:57
          Растягивать Image на парент по высоте Ну и само собою дял включения scrollbar надо чтобы был Flickable. Так что выходит как то так Flickable{ id: root anchors.fill: parent clip: true property url linkFile p…
          Дмитрий
          Дмитрий10 января 2024 г. 15:18
          Qt Creator загружает всю оперативную память Проблема решена. Удалось разобраться с помощью утилиты strace. Запустил ее: strace ./qtcreator Начал выводиться весь лог работы креатора. В один момент он начал считывать фай…
          Evgenii Legotckoi
          Evgenii Legotckoi12 декабря 2023 г. 17:48
          Побуквенное сравнение двух строк Добрый день. Там случайно не высылается этот сигнал textChanged ещё и при форматировани текста? Если решиать в лоб, то можно просто отключать сигнал/слотовое соединение внутри слота и …

          Следите за нами в социальных сетях