{"id":166813,"date":"2013-01-23T15:46:03","date_gmt":"2013-01-23T11:46:03","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=166813"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=166813","title":{"rendered":"<span class=\"post_title\">QtQuick 2.0 \u0438 \u0448\u0435\u0439\u0434\u0435\u0440\u044b OpenGL<\/span>"},"content":{"rendered":"<div class=\"content html_format\"> \t\t\t\u041d\u0430 \u0445\u0430\u0431\u0440\u0430\u0445\u0430\u0431\u0440\u0435 \u0443\u0436\u0435 \u0431\u044b\u043b\u0430 \u0441\u0442\u0430\u0442\u044c\u044f <a href=\"http:\/\/habrahabr.ru\/post\/133828\/\">\u00ab\u041f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432 OpenGL \u0432 QML\u00bb<\/a>, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u043d\u044b \u0442\u0435\u043e\u0440\u0438\u044f \u0438 \u043f\u0440\u0438\u043c\u0435\u0440\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432 \u0432 Qt Quick 1.0. \u041f\u0440\u043e\u0448\u043b\u043e \u0431\u043e\u043b\u044c\u0448\u0435 \u0433\u043e\u0434\u0430, \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u043f\u0440\u0435\u0442\u0435\u0440\u043f\u0435\u043b \u043c\u0430\u0441\u0441\u0443 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0439: \u0441\u043e\u0441\u0442\u043e\u044f\u043b\u0441\u044f <a href=\"http:\/\/habrahabr.ru\/post\/163217\/\">\u0440\u0435\u043b\u0438\u0437 Qt 5<\/a> \u0438 \u0448\u0435\u0439\u0434\u0435\u0440\u044b \u0442\u0435\u043f\u0435\u0440\u044c \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0447\u0430\u0441\u0442\u044c\u044e Qt Quick 2.0, \u0430 \u043d\u0435 \u0432\u044b\u043d\u0435\u0441\u0435\u043d\u044b \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c \u0438 \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441 \u0438\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f, \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u0442\u0430\u043a\u0436\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u0441\u044f. \u0421\u0440\u0430\u0437\u0443 \u043e\u0433\u043e\u0432\u043e\u0440\u044e\u0441\u044c, \u0447\u0442\u043e \u0441 GLSL \u044f \u0441\u0430\u043c \u0437\u043d\u0430\u043a\u043e\u043c \u0432\u0435\u0441\u044c\u043c\u0430 \u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u0437\u0430\u0442\u043e \u0438\u043c\u0435\u044e \u043e\u043f\u044b\u0442 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 QML, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u0445\u043e\u0447\u0443 \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c \u0440\u0430\u0431\u043e\u0442\u0443 \u0441 \u0444\u0440\u0430\u0433\u043c\u0435\u043d\u0442\u043d\u044b\u043c \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u043c \u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 LedScreen, \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u043d\u043d\u043e\u0433\u043e \u0441\u043e\u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e\u043c <a href=\"http:\/\/quitcoding.com\/\">QUIt Coding<\/a> (\u043d\u0430\u0432\u0435\u0440\u043d\u044f\u043a\u0430 \u043c\u043d\u043e\u0433\u0438\u0435 \u0438\u0437 \u0432\u0430\u0441 \u0432\u0438\u0434\u0435\u043b\u0438 \u0435\u0433\u043e \u0432 \u0434\u0435\u043c\u043e-\u0440\u043e\u043b\u0438\u043a\u0435 \u043d\u0430 YouTube):<br \/>  <img decoding=\"async\" src=\"http:\/\/habrastorage.org\/storage2\/65e\/c31\/48e\/65ec3148e65622214a25583bd26bad2a.gif\"\/><br \/>  <a name=\"habracut\"><\/a><br \/>  \u0412\u043f\u0435\u0440\u0432\u044b\u0435 \u0443\u0437\u043d\u0430\u0432 \u043f\u0440\u043e \u0448\u0435\u0439\u0434\u0435\u0440\u044b \u044f \u043f\u043e\u0447\u0435\u043c\u0443-\u0442\u043e \u0441\u0440\u0430\u0437\u0443 \u0432\u043e\u0441\u043f\u0440\u0438\u043d\u044f\u043b \u0442\u0435\u0445\u043d\u043e\u043b\u043e\u0433\u0438\u044e \u043a\u0430\u043a \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u043e \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u0438\u0441\u043a\u0430\u0436\u0435\u043d\u0438\u044f \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439 \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u044b\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432. \u042d\u0442\u043e \u043e\u0442\u043d\u044e\u0434\u044c, \u0442\u043e\u0447\u043d\u0435\u0435, \u043d\u0435 \u0441\u043e\u0432\u0441\u0435\u043c, \u0442\u0430\u043a, \u0447\u0442\u043e \u0441\u0435\u0439\u0447\u0430\u0441 \u0438 \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u043e\u0434\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043e.<\/p>\n<h4>\u041f\u043e\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 \u0437\u0430\u0434\u0430\u0447\u0438<\/h4>\n<p>  <\/p>\n<ol>\n<li>\u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 LedScreen, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0443\u0434\u0435\u0442 \u043b\u044e\u0431\u0443\u044e \u0437\u0430\u0434\u0430\u043d\u043d\u0443\u044e \u0441\u0442\u0440\u043e\u043a\u0443 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c \u0432 \u0432\u0438\u0434\u0435 \u0442\u0435\u043a\u0441\u0442\u0430 \u043d\u0430 <a href=\"http:\/\/ru.wikipedia.org\/wiki\/%D0%A1%D0%B2%D0%B5%D1%82%D0%BE%D0%B4%D0%B8%D0%BE%D0%B4%D0%BD%D1%8B%D0%B9_%D0%B3%D1%80%D0%B0%D1%84%D0%B8%D1%87%D0%B5%D1%81%D0%BA%D0%B8%D0%B9_%D1%8D%D0%BA%D1%80%D0%B0%D0%BD\">\u0441\u0432\u0435\u0442\u043e\u0434\u0438\u043e\u0434\u043d\u043e\u043c \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u043e\u043c \u044d\u043a\u0440\u0430\u043d\u0435<\/a>;<\/li>\n<li>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0441\u0446\u0435\u043d\u044b, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u044d\u0442\u043e\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d \u0441 \u043d\u0430\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c \u043d\u0430 \u043d\u0435\u0433\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u044b\u0445 \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u0439.<\/li>\n<\/ol>\n<h4>\u0427\u0430\u0441\u0442\u044c \u043f\u0435\u0440\u0432\u0430\u044f: LedScreen \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442<\/h4>\n<p>  <img decoding=\"async\" src=\"http:\/\/habrastorage.org\/storage2\/d33\/32d\/ffa\/d3332dffaf91ec7634367e0e8e77cf11.png\"\/><br \/>  \u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0441\u0432\u0435\u0442\u043e\u0434\u0438\u043e\u0434\u043e\u0432 \u0431\u0443\u0434\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u044b \u044d\u0442\u0438 \u0434\u0432\u0430 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f:<br \/>  <img decoding=\"async\" src=\"http:\/\/habrastorage.org\/storage2\/ec1\/b83\/c73\/ec1b83c73f8acd391ab18b9aaca03226.png\"\/> \u2014 \u0432\u043a\u043b\u044e\u0447\u0435\u043d\u043d\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 <img decoding=\"async\" src=\"http:\/\/habrastorage.org\/storage2\/5f0\/429\/ac4\/5f0429ac42edd1aab791367971e6504b.png\"\/> \u2014 \u0432\u044b\u043a\u043b\u044e\u0447\u0435\u043d\u043d\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435<br \/>  \u0418\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0441\u0442\u0440\u043e\u043a\u0438 \u2014 \u0431\u0438\u0442\u043e\u0432\u044b\u0439 \u043c\u0430\u0441\u0441\u0438\u0432, \u043f\u043e \u043a\u043e\u0442\u043e\u0440\u043e\u043c\u0443 \u043c\u043e\u0436\u043d\u043e \u0441\u0444\u043e\u0440\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u044b\u0445\u043e\u0434\u043d\u043e\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435. \u0415\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u043c\u043e\u0436\u043d\u043e \u043e\u0431\u043e\u0439\u0442\u0438\u0441\u044c \u0432\u043e\u0432\u0441\u0435 \u0431\u0435\u0437 \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432, \u043d\u043e \u0433\u0440\u0430\u043c\u043e\u0442\u043d\u043e\u0435 \u0438\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043c\u043e\u0436\u0435\u0442 \u0441\u0438\u043b\u044c\u043d\u043e \u043e\u0431\u043b\u0435\u0433\u0447\u0438\u0442\u044c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443: \u0443\u0432\u0435\u043b\u0438\u0447\u0438\u0442\u044c \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0432 \u0446\u0435\u043b\u043e\u043c \u0438 \u0443\u043c\u0435\u043d\u044c\u0448\u0438\u0442\u044c \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u0433\u043e \u043a\u043e\u0434\u0430. \u0418\u0442\u0430\u043a, LedScreen \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0431\u0430\u0437\u043e\u0432\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 <a href=\"http:\/\/qt-project.org\/doc\/qt-5.0\/qtquick\/qml-qtquick2-item.html\">Item<\/a> \u0438 \u0431\u0443\u0434\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c \u0432 \u0441\u0435\u0431\u0435 \u0434\u0432\u0430 \u0434\u0440\u0443\u0433\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430: <a href=\"http:\/\/qt-project.org\/doc\/qt-5.0\/qtquick\/qml-qtquick2-shadereffectsource.html\">ShaderEffectSource<\/a> (\u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442 \u0440\u0435\u043d\u0434\u0435\u0440\u0438\u043d\u0433 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u043e\u0433\u043e sourceItem \u0432 \u0442\u0435\u043a\u0441\u0442\u0443\u0440\u0443 \u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442 \u0435\u0451) \u0438 <a href=\"http:\/\/qt-project.org\/doc\/qt-5.0\/qtquick\/qml-qtquick2-shadereffect.html\">ShaderEffect<\/a> (\u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442 \u0437\u0430\u0434\u0430\u043d\u043d\u044b\u0439 \u0448\u0435\u0439\u0434\u0435\u0440 \u043a \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u0443):  <\/p>\n<pre><code class=\"javascript\">import QtQuick 2.0  Item {     id: root     property alias sourceItem: effectSource.sourceItem     property real ledSize: 48     property color ledColor: Qt.rgba(1.0, 1.0, 0.0, 1.0);     property bool useSourceColors: false     property real threshold: 0.5      ShaderEffectSource {         id: effectSource         hideSource: true         smooth: false     }      ShaderEffect {         id: effectItem         width: screenWidth * root.ledSize         height: screenHeight * root.ledSize         anchors.centerIn: parent         smooth: false          property real screenWidth: Math.floor(root.width \/ root.ledSize)         property real screenHeight: Math.floor(root.height \/ root.ledSize)         property var source: effectSource         property var sledOn: Image { source: &quot;images\/led_on.png&quot;; sourceSize.width: root.ledSize; sourceSize.height: root.ledSize; visible: false }         property var sledOff: Image { source: &quot;images\/led_off.png&quot;; sourceSize.width: root.ledSize; sourceSize.height: root.ledSize; visible: false }         property point screenSize: Qt.point(screenWidth, screenHeight)         property alias ledColor: root.ledColor         property real useSourceColors: root.useSourceColors ? 1.0 : 0.0         property alias threshold: root.threshold          fragmentShader: &quot;                          varying highp vec2 qt_TexCoord0;                          uniform lowp float qt_Opacity;                          uniform sampler2D source;                          uniform sampler2D sledOn;                          uniform sampler2D sledOff;                          uniform highp vec2 screenSize;                          uniform highp vec4 ledColor;                          uniform lowp float useSourceColors;                          uniform lowp float threshold;                           void main() {                              highp vec2 cpos = (floor(qt_TexCoord0 * screenSize) + 0.5) \/ screenSize;                              highp vec4 tex = texture2D(source, cpos);                              highp vec2 lpos = fract(qt_TexCoord0 * screenSize);                              lowp float isOn = step(threshold, tex.a);                              highp vec4 pix = mix(texture2D(sledOff, lpos), texture2D(sledOn, lpos), isOn);                              highp vec4 color = mix(ledColor, tex, isOn * useSourceColors);                              gl_FragColor = pix * color * qt_Opacity;                          }&quot;     } } <\/code><\/pre>\n<p>  \u0427\u0442\u043e \u0442\u0443\u0442 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442? \u0421\u043e\u0437\u0434\u0430\u0451\u0442\u0441\u044f \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 Item, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u044b \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0441\u0432\u043e\u0439\u0441\u0442\u0432 (property) \u0434\u043b\u044f \u0443\u0434\u043e\u0431\u043d\u043e\u0439 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f. \u0417\u0434\u0435\u0441\u044c \u0441\u0442\u043e\u0438\u0442 \u043e\u0442\u043c\u0435\u0442\u0438\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u0432\u0430 \u043c\u043e\u043c\u0435\u043d\u0442\u0430: \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0441\u044f \u0441\u0432\u044f\u0437\u044b\u0432\u0430\u043d\u0438\u0435 (alias) \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 sourceItem \u0441 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u043c \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e\u043c effectSource (\u0442\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u0434\u043e\u0441\u0442\u0438\u0433\u0430\u0435\u0442\u0441\u044f \u0441\u0432\u043e\u0435\u0433\u043e \u0440\u043e\u0434\u0430 \u0438\u043d\u043a\u0430\u043f\u0441\u0443\u043b\u044f\u0446\u0438\u044f \u0448\u0435\u0439\u0434\u0435\u0440\u0430) \u0438 \u0437\u0430\u0434\u0430\u0451\u0442\u0441\u044f \u043f\u043e\u0440\u043e\u0433\u043e\u0432\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 threshold: \u0435\u0441\u043b\u0438 \u0432 \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u043c \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0438 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c \u043f\u0438\u043a\u0441\u0435\u043b\u044f \u043c\u0435\u043d\u044c\u0448\u0435 \u044d\u0442\u043e\u0439 \u0432\u0435\u043b\u0438\u0447\u0438\u043d\u044b, \u0431\u0443\u0434\u0435\u043c \u0441\u0447\u0438\u0442\u0430\u0442\u044c, \u0447\u0442\u043e \u0441\u0432\u0435\u0442\u043e\u0434\u0438\u043e\u0434 \u0432 \u044d\u0442\u043e\u043c \u043c\u0435\u0441\u0442\u0435 \u0432\u044b\u043a\u043b\u044e\u0447\u0435\u043d.<br \/>  \u0422\u0435\u043f\u0435\u0440\u044c \u0441\u0430\u043c\u043e\u0435 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e\u0435: \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0448\u0435\u0439\u0434\u0435\u0440. \u041e \u0442\u043e\u043c, \u043a\u0430\u043a \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0441\u0432\u044f\u0437\u044b\u0432\u0430\u043d\u0438\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u0442\u043e\u0432 QML \u0441 \u0442\u0435\u043a\u0441\u0442\u0443\u0440\u0430\u043c\u0438 \u0432\u043d\u0443\u0442\u0440\u0438 \u0448\u0435\u0439\u0434\u0435\u0440\u0430 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u0440\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u0432 <a href=\"http:\/\/habrahabr.ru\/post\/133828\/\">\u0432\u044b\u0448\u0435\u0443\u043f\u043e\u043c\u044f\u043d\u0443\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435<\/a>, \u044f \u0436\u0435 \u043f\u0435\u0440\u0435\u0439\u0434\u0443 \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u043a \u0440\u0430\u0437\u0431\u043e\u0440\u0443 GLSL:<\/p>\n<pre><code>highp vec2 cpos = (floor(qt_TexCoord0 * screenSize) + 0.5) \/ screenSize;<\/code><\/pre>\n<p>  \u0417\u0434\u0435\u0441\u044c \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u0442\u0435\u043a\u0441\u0442\u0443\u0440\u043d\u044b\u0445 \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442 \u0441\u0446\u0435\u043d\u044b \u0432 \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u044b \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u043f\u0438\u043a\u0441\u0435\u043b\u044f \u0434\u043b\u044f \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u0433\u043e \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f (\u0441\u0442\u0440\u043e\u043a\u0438). \u0414\u0435\u043b\u043e \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u0432 \u0441\u0430\u043c\u043e\u043c \u0448\u0435\u0439\u0434\u0435\u0440\u0435 \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u044b \u0442\u0435\u043a\u0441\u0442\u0443\u0440\u044b \u043d\u043e\u0440\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u044b \u0438 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u044b \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438 \u043e\u0442 0 \u0434\u043e 1.<\/p>\n<pre><code>highp vec4 tex = texture2D(source, cpos);<\/code><\/pre>\n<p>  \u0412 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0443\u044e tex \u0437\u0430\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u043c \u0446\u0432\u0435\u0442 \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u043f\u0438\u043a\u0441\u0435\u043b\u044f \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u0433\u043e \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f.<\/p>\n<pre><code>highp vec2 lpos = fract(qt_TexCoord0 * screenSize);<\/code><\/pre>\n<p>  \u0412 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0443\u044e lpos \u0437\u0430\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u043c \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u044b \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u043f\u0438\u043a\u0441\u0435\u043b\u044f \u0442\u0435\u043a\u0441\u0442\u0443\u0440\u044b (sledOn \u0438\u043b\u0438 sledOff).<\/p>\n<pre><code>lowp float isOn = step(threshold, tex.a);<\/code><\/pre>\n<p>  \u0412 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0443\u044e isOn \u0437\u0430\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 <a href=\"http:\/\/www.opengl.org\/sdk\/docs\/manglsl\/xhtml\/step.xml\">step()<\/a>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 0.0 \u0438\u043b\u0438 1.0 \u0438 \u0441\u043b\u0443\u0436\u0438\u0442 \u0437\u0434\u0435\u0441\u044c \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0437\u0430\u043c\u0435\u043d\u044b \u043b\u043e\u0433\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e \u043e\u043f\u0435\u0440\u0430\u0442\u043e\u0440\u0430 if. \u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u043c\u044b \u0443\u0437\u043d\u0430\u0451\u043c, \u043a\u0430\u043a \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u043f\u0438\u043a\u0441\u0435\u043b\u044f \u043a \u043d\u0430\u0448\u0435\u043c\u0443 \u043f\u043e\u0440\u043e\u0433\u043e\u0432\u043e\u043c\u0443 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044e. \u0413\u0434\u0435-\u0442\u043e \u0431\u044b\u043b\u043e \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u043e, \u0447\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 if \u0432 \u043a\u043e\u0434\u0435 \u0448\u0435\u0439\u0434\u0435\u0440\u0430 \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u043c\u043e\u0432\u0435\u0442\u043e\u043d\u043e\u043c \u0438 \u0441\u043f\u043e\u0441\u043e\u0431\u043d\u043e \u0441\u0438\u043b\u044c\u043d\u043e \u0437\u0430\u043c\u0435\u0434\u043b\u0438\u0442\u044c \u0435\u0433\u043e \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435; \u0432\u0438\u0434\u0438\u043c\u043e, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043a\u0430\u043a \u0440\u0430\u0437 \u0437\u0434\u0435\u0441\u044c \u0442\u0430\u043a \u0438 \u0441\u0434\u0435\u043b\u0430\u043d\u043e.<\/p>\n<pre><code>highp vec4 pix = mix(texture2D(sledOff, lpos), texture2D(sledOn, lpos), isOn);<\/code><\/pre>\n<p>  \u041f\u0440\u043e\u0434\u043e\u043b\u0436\u0435\u043d\u0438\u0435 \u0445\u0438\u0442\u0440\u043e\u0433\u043e \u043f\u0440\u0438\u0451\u043c\u0430: \u043e\u0431\u044b\u0447\u043d\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u044f <a href=\"http:\/\/www.opengl.org\/sdk\/docs\/manglsl\/xhtml\/mix.xml\">mix()<\/a> \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u043b\u0438\u043d\u0435\u0439\u043d\u043e\u0439 \u0438\u043d\u0442\u0435\u0440\u043f\u043e\u043b\u044f\u0446\u0438\u0438 \u043c\u0435\u0436\u0434\u0443 \u0434\u0432\u0443\u043c\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438 (\u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0433\u0440\u0430\u0434\u0438\u0435\u043d\u0442\u043e\u0432), \u0442\u0443\u0442 \u0436\u0435 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0435\u0451 \u0441\u0438\u0433\u043d\u0430\u0442\u0443\u0440\u0430 <code>genType mix(genType x, genType y, float a)<\/code> \u0438 \u043a\u043e\u043d\u0435\u0447\u043d\u044b\u0439 \u0446\u0432\u0435\u0442 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u043c\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0440\u0430\u0441\u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043f\u043e \u0444\u043e\u0440\u043c\u0443\u043b\u0435 <code>x*(1-a)+y*a<\/code>. \u0422\u0430\u043a \u043a\u0430\u043a \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 <code>a<\/code> \u0443 \u043d\u0430\u0441 \u0441\u043b\u0443\u0436\u0438\u0442 isOn, \u0442\u043e \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442: \u0435\u0441\u043b\u0438 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c \u043f\u0438\u043a\u0441\u0435\u043b\u044f \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u0439 \u0441\u0442\u0440\u043e\u043a\u0438 \u043c\u0435\u043d\u044c\u0448\u0435 0.5, \u0442\u043e \u0446\u0432\u0435\u0442 \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u043f\u0438\u043a\u0441\u0435\u043b\u044f \u0431\u0435\u0440\u0451\u0442\u0441\u044f \u0438\u0437 \u0442\u0435\u043a\u0441\u0442\u0443\u0440\u044b sledOff, \u0438\u043d\u0430\u0447\u0435 \u2014 \u0438\u0437 sledOn.<\/p>\n<pre><code>highp vec4 color = mix(ledColor, tex, isOn * useSourceColors);<\/code><\/pre>\n<p>  \u0415\u0441\u043b\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e, \u0437\u0430\u0434\u0430\u0451\u043c \u0446\u0432\u0435\u0442 color \u0434\u043b\u044f \u043a\u043e\u043b\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u0438 \u0432\u044b\u0445\u043e\u0434\u043d\u043e\u0433\u043e \u043f\u0438\u043a\u0441\u0435\u043b\u044f.<\/p>\n<pre><code>gl_FragColor = pix * color * qt_Opacity;<\/code><\/pre>\n<p>  \u0426\u0432\u0435\u0442 \u0432\u044b\u0445\u043e\u0434\u043d\u043e\u0433\u043e \u043f\u0438\u043a\u0441\u0435\u043b\u044f \u0441\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0438\u0437 \u0446\u0432\u0435\u0442\u0430 \u0442\u0435\u043a\u0441\u0442\u0443\u0440\u044b sledOn \u0438\u043b\u0438 sledOff \u0438 \u0446\u0432\u0435\u0442\u0430 \u043a\u043e\u043b\u043e\u0440\u0438\u0437\u0430\u0446\u0438\u0438 color \u0441 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0435\u043c \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u0438, \u0437\u0430\u0434\u0430\u043d\u043d\u043e\u0439 \u043a \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0443 \u0448\u0435\u0439\u0434\u0435\u0440\u0430 \u0438\u0437 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0439 qt_Opacity, \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0439 \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f \u0447\u0442\u0435\u043d\u0438\u044f.<\/p>\n<p>  \u0422\u0435\u043f\u0435\u0440\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u0441\u0432\u043e\u0434\u0438\u0442\u0441\u044f \u0432\u0441\u0435\u0433\u043e \u043b\u0438\u0448\u044c \u043a \u0437\u0430\u0434\u0430\u043d\u0438\u044e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0435 sourceItem, \u043a\u043e\u0442\u043e\u0440\u044b\u043c, \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u0435\u043a\u0441\u0442, \u043d\u043e \u0438 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043c\u0430\u0441\u043a\u0438:  <\/p>\n<pre><code class=\"javascript\">LedScreen {     id: ledScreen     anchors.fill: parent     sourceItem: Item {         id: sourceArea         width: 44         height: 10         Text {             anchors.verticalCenter: parent.verticalCenter             font.pixelSize: 14             font.family: &quot;arial&quot;             font.bold: true             smooth: false             text: &quot;test&quot;         }     }     ledSize: 18     ledColor: &quot;#ff8800&quot; } <\/code><\/pre>\n<h4>\u0427\u0430\u0441\u0442\u044c \u0432\u0442\u043e\u0440\u0430\u044f: \u0440\u0435\u043a\u043b\u0430\u043c\u043d\u044b\u0439 \u0449\u0438\u0442 (billboard)<\/h4>\n<p>  \u041d\u0430\u043c \u043f\u043e\u043d\u0430\u0434\u043e\u0431\u044f\u0442\u0441\u044f \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f:<br \/>  \u0424\u043e\u043d \u0441 \u0449\u0438\u0442\u043e\u043c<br \/>  <a href=\"http:\/\/habrastorage.org\/storage2\/46b\/ddc\/e93\/46bddce93940697ec13ae08d824dfb13.png\"><img decoding=\"async\" src=\"http:\/\/habrastorage.org\/storage2\/3b0\/f8d\/de1\/3b0f8dde1d152b3b9f620ad4d9f0d0ac.png\"\/><\/a><br \/>  \u0422\u0435\u043a\u0441\u0442\u0443\u0440\u0430 \u0434\u043b\u044f \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u0437\u0430\u0442\u0435\u043c\u043d\u0435\u043d\u0438\u044f<br \/>  <a href=\"http:\/\/habrastorage.org\/storage2\/7a9\/646\/999\/7a9646999101b8225ebff9a7ccdd019e.png\"><img decoding=\"async\" src=\"http:\/\/habrastorage.org\/storage2\/d2a\/867\/ada\/d2a867adab3b163c5f7a4130ac78a071.png\"\/><\/a><br \/>  \u0422\u0443\u0442 \u0432\u0441\u0451 \u043f\u0440\u043e\u0441\u0442\u043e: \u043d\u0430\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0435\u043c \u0444\u043e\u043d, \u0441\u043e\u0437\u0434\u0430\u0451\u043c Item \u0441 \u0442\u0435\u043a\u0441\u0442\u043e\u043c, \u044d\u0444\u0444\u0435\u043a\u0442 \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u044f \u0434\u043e\u0441\u0442\u0438\u0433\u0430\u0435\u0442\u0441\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 QML. \u0414\u0430\u043b\u0435\u0435 \u0441\u043e\u0437\u0434\u0430\u0451\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 LedScreen, \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u043c \u0442\u0435\u043a\u0441\u0442 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u0430, \u043d\u0430\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0435\u043c \u043f\u043e\u0432\u0435\u0440\u0445 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435-\u043c\u0430\u0441\u043a\u0443 \u0438 \u043a \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u043d\u043e\u043c\u0443 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u043c \u0433\u0435\u043e\u043c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u044f. \u0418\u0441\u0445\u043e\u0434\u043d\u044b\u0439 \u043a\u043e\u0434 \u0441\u0446\u0435\u043d\u044b:  <\/p>\n<pre><code class=\"javascript\">import QtQuick 2.0 import &quot;ledscreencomponent&quot;  Rectangle {     id: root     property int scrollSpeed: 500     width: 854     height: 480     color: &quot;#000000&quot;      Image {         id: backgroundImage         anchors.centerIn: parent         source: &quot;images\/billboard.png&quot;     }      Item {         id: sourceArea         width: 41         height: 15         Text {             id: textItem             property int textXPos             x: textXPos             anchors.verticalCenter: parent.verticalCenter             font.family: &quot;Fixedsys&quot;             font.pixelSize: 14             font.bold: true             color: &quot;#ffffff&quot;             smooth: false             text: &quot;Hello Habrahabr&quot;             NumberAnimation on textXPos {                 loops: Animation.Infinite                 from: sourceArea.width; to: -textItem.paintedWidth; duration: textItem.text.length*scrollSpeed             }         }     }      LedScreen {         id: ledScreen         sourceItem: sourceArea         width: 656         height: 240         anchors.centerIn: backgroundImage         anchors.horizontalCenterOffset: 40         anchors.verticalCenterOffset: -10         transform: [             Rotation { origin.x: backgroundImage.width\/2; origin.y: backgroundImage.height\/2; axis { x: 0; y: 0; z: 1 } angle: -4 },             Rotation { origin.x: backgroundImage.width\/2; origin.y: backgroundImage.height*2; axis { x: 0; y: 1; z: 0 } angle: 19 },             Rotation { origin.x: backgroundImage.width\/2; origin.y: backgroundImage.height\/2; axis { x: 1; y: 0; z: 0 } angle: 20 }         ]         ledSize: 16         threshold: 0.48         Image {             anchors.fill: parent             source: &quot;images\/reflection.png&quot;         }     } } <\/code><\/pre>\n<h4>\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435<\/h4>\n<p>  \u041b\u0443\u0447\u0448\u0435 \u0432\u0441\u0435\u0433\u043e \u0440\u0430\u0441\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u0442\u044c \u043c\u043e\u044e \u0441\u0442\u0430\u0442\u044c\u044e \u043a\u0430\u043a \u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0435\u043d\u0438\u0435 <a href=\"http:\/\/habrahabr.ru\/post\/133828\/\">\u044d\u0442\u043e\u0439<\/a>, \u0442\u0430\u043a \u043a\u0430\u043a \u0442\u0435\u043c\u0430 \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432 \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u043d\u0435\u043f\u0440\u043e\u0441\u0442\u0430\u044f. \u042f \u0443\u0447\u0443 Qt \u0443\u0436\u0435 \u0431\u043e\u043b\u044c\u0448\u0435 \u0442\u0440\u0451\u0445 \u043b\u0435\u0442 \u0438 \u043c\u043e\u0433\u0443 \u0441\u043a\u0430\u0437\u0430\u0442\u044c, \u0447\u0442\u043e Qt 5 \u043f\u0440\u0438\u0432\u043d\u0451\u0441 \u043e\u0447\u0435\u043d\u044c \u043c\u043d\u043e\u0433\u043e; \u043a\u0430\u043a \u0438 \u0434\u0440\u0443\u0433\u0438\u043c \u0430\u0434\u0435\u043f\u0442\u0430\u043c \u043a\u043e\u043d\u0446\u0435\u043f\u0446\u0438\u0438 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432, \u043c\u043d\u0435 \u0431\u044b\u043b\u0430 \u043d\u0435\u043f\u043e\u043d\u044f\u0442\u043d\u0430 \u043c\u043e\u0442\u0438\u0432\u0430\u0446\u0438\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432, \u043a\u043e\u0433\u0434\u0430 \u0432\u043f\u0435\u0440\u0432\u044b\u0435 \u0431\u044b\u043b\u043e \u0437\u0430\u044f\u0432\u043b\u0435\u043d\u043e, \u0447\u0442\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u044b \u0437\u0430\u043c\u0435\u043d\u0438\u0442 \u0434\u0435\u043a\u043b\u0430\u0440\u0430\u0442\u0438\u0432\u043d\u043e\u0435 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435. \u0421\u0435\u0439\u0447\u0430\u0441 \u0436\u0435 \u044f \u043d\u0438\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043d\u0435 \u0436\u0430\u043b\u0435\u044e, \u0447\u0442\u043e \u043f\u0435\u0440\u0435\u0441\u0438\u043b\u0438\u043b \u0441\u0435\u0431\u044f \u0438 \u043d\u0430\u0447\u0430\u043b \u0443\u0447\u0438\u0442\u044c QML\/JavaScript: \u0443\u0434\u0438\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e, \u043a\u0430\u043a \u043f\u0440\u043e\u0441\u0442\u043e \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u044d\u0442\u043e\u0433\u043e \u044f\u0437\u044b\u043a\u0430 \u0441\u043e\u0437\u0434\u0430\u044e\u0442\u0441\u044f \u0442\u0430\u043a\u0438\u0435 <a href=\"http:\/\/youtu.be\/2nYk2eO-wRE\">\u043d\u0435\u0432\u0435\u0440\u043e\u044f\u0442\u043d\u043e \u043a\u0440\u0430\u0441\u0438\u0432\u044b\u0435 \u0438 \u0437\u0440\u0435\u043b\u0438\u0449\u043d\u044b\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b<\/a>.<br \/>  \u0412 \u043f\u043b\u0430\u043d\u0430\u0445 \u0435\u0449\u0451 \u0434\u0432\u0435 \u0441\u0442\u0430\u0442\u044c\u0438: \u0431\u043e\u043b\u044c\u0448\u0435 \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432 \u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 QML \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e C++ (\u043a\u043e\u0442\u043e\u0440\u044b\u0435, \u043a \u0441\u043b\u043e\u0432\u0443, \u043e\u0444\u043e\u0440\u043c\u043b\u044f\u044e\u0442\u0441\u044f \u0432 \u0432\u0438\u0434\u0435 \u043f\u043b\u0430\u0433\u0438\u043d\u043e\u0432).<br \/>  \u041d\u0430\u0434\u0435\u044e\u0441\u044c, \u0432\u0430\u043c \u0431\u044b\u043b\u043e \u0442\u0430\u043a \u0436\u0435 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e \u0447\u0438\u0442\u0430\u0442\u044c \u044d\u0442\u0443 \u0441\u0442\u0430\u0442\u044c\u044e, \u043a\u0430\u043a \u043c\u043d\u0435 \u0435\u0451 \u043f\u0438\u0441\u0430\u0442\u044c \ud83d\ude42<\/p>\n<p>  \u0418\u0441\u0445\u043e\u0434\u043d\u044b\u0435 \u043a\u043e\u0434\u044b, \u0432\u0437\u044f\u0442\u044b\u0435 \u0437\u0430 \u043e\u0441\u043d\u043e\u0432\u0443: <a href=\"http:\/\/quitcoding.com\/?page=work#ledscreen\">http:\/\/quitcoding.com\/?page=work#ledscreen<\/a><\/p>\n<p>  P. S. \u041f\u043e\u0434 Windows \u0440\u0435\u043d\u0434\u0435\u0440\u0438\u043d\u0433 Qt Quick 2.0 <a href=\"http:\/\/qt-project.org\/forums\/viewthread\/23566\/\">\u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043e\u0447\u0435\u043d\u044c \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u044b\u043c<\/a> \u0438\u0437-\u0437\u0430 \u043e\u0432\u0435\u0440\u0445\u0435\u0434\u0430 \u0432 \u0432\u0438\u0434\u0435 <a href=\"http:\/\/code.google.com\/p\/angleproject\/\">ANGLE<\/a>; \u043d\u0430 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0445 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u043c\u044b\u0445 \u043f\u043b\u0430\u0442\u0444\u043e\u0440\u043c\u0430\u0445 \u0432\u0441\u0451 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0437\u0430\u043c\u0435\u0447\u0430\u0442\u0435\u043b\u044c\u043d\u043e. \t\t\t \t\t\t<\/p>\n<div class=\"clear\"><\/div>\n<\/p><\/div>\n<p> \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"http:\/\/habrahabr.ru\/post\/166813\/\"> http:\/\/habrahabr.ru\/post\/166813\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<div class=\"content html_format\"> \t\t\t\u041d\u0430 \u0445\u0430\u0431\u0440\u0430\u0445\u0430\u0431\u0440\u0435 \u0443\u0436\u0435 \u0431\u044b\u043b\u0430 \u0441\u0442\u0430\u0442\u044c\u044f <a href=\"http:\/\/habrahabr.ru\/post\/133828\/\">\u00ab\u041f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432 OpenGL \u0432 QML\u00bb<\/a>, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u043d\u044b \u0442\u0435\u043e\u0440\u0438\u044f \u0438 \u043f\u0440\u0438\u043c\u0435\u0440\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432 \u0432 Qt Quick 1.0. \u041f\u0440\u043e\u0448\u043b\u043e \u0431\u043e\u043b\u044c\u0448\u0435 \u0433\u043e\u0434\u0430, \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u043f\u0440\u0435\u0442\u0435\u0440\u043f\u0435\u043b \u043c\u0430\u0441\u0441\u0443 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0439: \u0441\u043e\u0441\u0442\u043e\u044f\u043b\u0441\u044f <a href=\"http:\/\/habrahabr.ru\/post\/163217\/\">\u0440\u0435\u043b\u0438\u0437 Qt 5<\/a> \u0438 \u0448\u0435\u0439\u0434\u0435\u0440\u044b \u0442\u0435\u043f\u0435\u0440\u044c \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0447\u0430\u0441\u0442\u044c\u044e Qt Quick 2.0, \u0430 \u043d\u0435 \u0432\u044b\u043d\u0435\u0441\u0435\u043d\u044b \u0432 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u043c\u043e\u0434\u0443\u043b\u044c \u0438 \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441 \u0438\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f, \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u0442\u0430\u043a\u0436\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u0441\u044f. \u0421\u0440\u0430\u0437\u0443 \u043e\u0433\u043e\u0432\u043e\u0440\u044e\u0441\u044c, \u0447\u0442\u043e \u0441 GLSL \u044f \u0441\u0430\u043c \u0437\u043d\u0430\u043a\u043e\u043c \u0432\u0435\u0441\u044c\u043c\u0430 \u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u0437\u0430\u0442\u043e \u0438\u043c\u0435\u044e \u043e\u043f\u044b\u0442 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 QML, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u0445\u043e\u0447\u0443 \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c \u0440\u0430\u0431\u043e\u0442\u0443 \u0441 \u0444\u0440\u0430\u0433\u043c\u0435\u043d\u0442\u043d\u044b\u043c \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u043c \u043d\u0430 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 LedScreen, \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u043d\u043d\u043e\u0433\u043e \u0441\u043e\u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e\u043c <a href=\"http:\/\/quitcoding.com\/\">QUIt Coding<\/a> (\u043d\u0430\u0432\u0435\u0440\u043d\u044f\u043a\u0430 \u043c\u043d\u043e\u0433\u0438\u0435 \u0438\u0437 \u0432\u0430\u0441 \u0432\u0438\u0434\u0435\u043b\u0438 \u0435\u0433\u043e \u0432 \u0434\u0435\u043c\u043e-\u0440\u043e\u043b\u0438\u043a\u0435 \u043d\u0430 YouTube):<br \/>  <img decoding=\"async\" src=\"http:\/\/habrastorage.org\/storage2\/65e\/c31\/48e\/65ec3148e65622214a25583bd26bad2a.gif\"\/>  <\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-166813","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/166813","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=166813"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/166813\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=166813"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=166813"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=166813"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}