Burich6
7th June 2018, 16:14
Hello guys,
I am trying to create a custom widget for Qt Designer. I am including an svg image with an animated transition.
If I try opening the image with a browser, it shows with the correct animation. When I use QSvgRenderer , the widget is static..
According to the documentation ( http://doc.qt.io/qt-5/qsvgrenderer.html ) QSvgRenderer should be able to display animated svgs.
Here is my paint event definition:
painter = QPainter()
painter.begin(self)
painter.setRenderHint(QPainter.Antialiasing)
#---------------------------------------
if self.__status_flag:
self._color = self.__status_color
else:
self._color = "#19FFBA"
data = QByteArray()
data.append(self.setSVG3(self._angle, self._direction, self._color))
#---------------------------------------
renderer = QSvgRenderer(data)
renderer.render(painter)
painter.end()
And here is the image:
def setSVG3(self, angle, direction, color):
myDraw4 = (
' <?xml version="1.0" encoding="UTF-8"?>'
'<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">'
'<!-- Created with SVG-edit - http://svg-edit.googlecode.com/ -->'
'<g>'
' <title>Layer 1</title>'
'<circle id="svg_1" r="200" cy="240" cx="320" stroke-width="5" stroke="#000000" fill="#aaffff"/>'
'<path id="svg_3" d="m395.561676,270.517456c-17.577972,-31.65799 -21.009674,-41.274231 -15.197479,-42.577225c11.350861,-2.54921 9.068848,-17.138077 -6.823669,-43.600067c-19.92926,-33.183914 -58.970734,-53.562576 -95.644684,-49.925613c-14.231903,1.41687 -30.324097,4.331177 -35.751831,6.478638c-5.441162,2.151489 -2.104431,-1.854935 7.408112,-8.906158c47.569244,-35.245369 106.323914,-32.788689 153.192871,6.405731c18.68869,15.629211 44.405182,61.29126 44.405182,78.851456c0,4.98056 4.23996,9.798859 9.42218,10.712173c8.471344,1.501907 7.330566,5.451584 -11.319641,39.264984c-11.410187,20.673431 -22.14624,39.081757 -23.857971,40.892517c-1.720062,1.810089 -13.342102,-15.108459 -25.833069,-37.596436l0,0zm-151.122101,-61.03447c17.58194,31.657806 21.013611,41.270065 15.203796,42.581177c-11.357391,2.545181 -9.075211,17.133957 6.816895,43.596085c19.933533,33.183807 58.970917,53.561218 95.643127,49.924103c14.233643,-1.412659 30.324951,-4.327301 35.762054,-6.478546c5.428558,-2.151398 2.096069,1.850952 -7.416626,8.901855c-47.569305,35.251099 -106.319733,32.794434 -153.197296,-6.401215c-18.685333,-15.62796 -44.400726,-61.2901 -44.400726,-78.85022c0,-4.980713 -4.235718,-9.798996 -9.413681,-10.716431c-8.480927,-1.497849 -7.344452,-5.443436 11.309738,-39.25676c11.407318,-20.677551 22.142426,-39.08194 23.862442,-40.8965c1.715561,-1.810379 13.342239,15.104507 25.830276,37.596451l0,0z" stroke-linecap="null" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" stroke="#000000" fill="#000000"/>'
'<animateTransform attributeName="transform" type="rotate" from="0 320 240" to="360 320 240" dur="4s" repeatCount="indefinite" />'
'</g>'
'</svg>'
)
return myDraw4
I hope it is clear, let me know if you need more info, I tried including everything that seemed relevant.
Thank you very much
I am trying to create a custom widget for Qt Designer. I am including an svg image with an animated transition.
If I try opening the image with a browser, it shows with the correct animation. When I use QSvgRenderer , the widget is static..
According to the documentation ( http://doc.qt.io/qt-5/qsvgrenderer.html ) QSvgRenderer should be able to display animated svgs.
Here is my paint event definition:
painter = QPainter()
painter.begin(self)
painter.setRenderHint(QPainter.Antialiasing)
#---------------------------------------
if self.__status_flag:
self._color = self.__status_color
else:
self._color = "#19FFBA"
data = QByteArray()
data.append(self.setSVG3(self._angle, self._direction, self._color))
#---------------------------------------
renderer = QSvgRenderer(data)
renderer.render(painter)
painter.end()
And here is the image:
def setSVG3(self, angle, direction, color):
myDraw4 = (
' <?xml version="1.0" encoding="UTF-8"?>'
'<svg width="640" height="480" xmlns="http://www.w3.org/2000/svg" xmlns:svg="http://www.w3.org/2000/svg">'
'<!-- Created with SVG-edit - http://svg-edit.googlecode.com/ -->'
'<g>'
' <title>Layer 1</title>'
'<circle id="svg_1" r="200" cy="240" cx="320" stroke-width="5" stroke="#000000" fill="#aaffff"/>'
'<path id="svg_3" d="m395.561676,270.517456c-17.577972,-31.65799 -21.009674,-41.274231 -15.197479,-42.577225c11.350861,-2.54921 9.068848,-17.138077 -6.823669,-43.600067c-19.92926,-33.183914 -58.970734,-53.562576 -95.644684,-49.925613c-14.231903,1.41687 -30.324097,4.331177 -35.751831,6.478638c-5.441162,2.151489 -2.104431,-1.854935 7.408112,-8.906158c47.569244,-35.245369 106.323914,-32.788689 153.192871,6.405731c18.68869,15.629211 44.405182,61.29126 44.405182,78.851456c0,4.98056 4.23996,9.798859 9.42218,10.712173c8.471344,1.501907 7.330566,5.451584 -11.319641,39.264984c-11.410187,20.673431 -22.14624,39.081757 -23.857971,40.892517c-1.720062,1.810089 -13.342102,-15.108459 -25.833069,-37.596436l0,0zm-151.122101,-61.03447c17.58194,31.657806 21.013611,41.270065 15.203796,42.581177c-11.357391,2.545181 -9.075211,17.133957 6.816895,43.596085c19.933533,33.183807 58.970917,53.561218 95.643127,49.924103c14.233643,-1.412659 30.324951,-4.327301 35.762054,-6.478546c5.428558,-2.151398 2.096069,1.850952 -7.416626,8.901855c-47.569305,35.251099 -106.319733,32.794434 -153.197296,-6.401215c-18.685333,-15.62796 -44.400726,-61.2901 -44.400726,-78.85022c0,-4.980713 -4.235718,-9.798996 -9.413681,-10.716431c-8.480927,-1.497849 -7.344452,-5.443436 11.309738,-39.25676c11.407318,-20.677551 22.142426,-39.08194 23.862442,-40.8965c1.715561,-1.810379 13.342239,15.104507 25.830276,37.596451l0,0z" stroke-linecap="null" stroke-linejoin="null" stroke-dasharray="null" stroke-width="5" stroke="#000000" fill="#000000"/>'
'<animateTransform attributeName="transform" type="rotate" from="0 320 240" to="360 320 240" dur="4s" repeatCount="indefinite" />'
'</g>'
'</svg>'
)
return myDraw4
I hope it is clear, let me know if you need more info, I tried including everything that seemed relevant.
Thank you very much