PolygonItem

The PolygonItem allows to display polygonal primitives with color. More...

Import Statement: import VPlay 2.0
Since: V-Play 2.0.4
Inherits:

Item

Properties

Detailed Description

With PolygonItem you can display colored convex polygons. The shape can be closed, opened, filled or unfilled.

Example Usage

Following examples demonstrates the usage of the PolygonItem.

Simple Polygon

This example demonstrates how to use the PolygonItem to display a black Rectangle that is not filled.

 import VPlay 2.0
 import QtQuick 2.0

 GameWindow {
   Scene {
     PolygonItem {
       anchors.centerIn: parent
       vertices: [
         Qt.point(0, 0),
         Qt.point(10, 0),
         Qt.point(10, 10),
         Qt.point(0, 10)
       ]
     }
   }
 }

Filled Polygon

This example demonstrates how to use the PolygonItem to display a blue complex shape.

 import VPlay 2.0
 import QtQuick 2.0

 GameWindow {
   Scene {
     PolygonItem {
       id: polygon
       color: "blue"
       fill: true
       vertices: [
         Qt.point(0, 0),
         Qt.point(40, 15),
         Qt.point(100, 110),
         Qt.point(20, 210),
         Qt.point(10, 150),
         Qt.point(80, 110),
         Qt.point(10, 30)
       ]
     }
   }
 }

Animate Polygon color

This example demonstrates how to animate color changes of the polygon.

 import VPlay 2.0
 import QtQuick 2.0

 GameWindow {
   Scene {
     PolygonItem {
       id: polygon
       color: "blue"
       fill: true
       vertices: [
         Qt.point(0, 0),
         Qt.point(40, 15),
         Qt.point(100, 110),
         Qt.point(20, 210),
         Qt.point(10, 150),
         Qt.point(80, 110),
         Qt.point(10, 30)
       ]
     }

     SequentialAnimation {
       running: true
       loops: Animation.Infinite
       ColorAnimation {
         target: polygon
         property: "color"
         to: "red"
         duration: 1000
       }
       ColorAnimation {
         target: polygon
         property: "color"
         to: "green"
         duration: 1000
       }
       ColorAnimation {
         target: polygon
         property: "color"
         to: "blue"
         duration: 1000
       }
     }
   }
 }

Property Documentation

close : bool

This property is used to close the polygon silhouette. It is only used when the polygon is not filled. It connects the first vertex with the last vertex in the vertices list. The default value is true.


color : color

This property stores the color of the primitive. The default value is black.


fill : bool

This property is used to draw a filled polygon if true, otherwise it draws only its silhouettes. The default value is false to draw only silhouettes.


texture : url

The texture which is used to cover the polygon. By default no texture will be used.

The texture is repeated horizontally and vertically to fill the whole Polygon.

Note: Make sure to provide 3 different sized texture versions to support multiple screens and put them into the +hd and +hd2 subfolder, similar to MultiResolutionImage.

This QML property was introduced in V-Play 2.2.0.


vertices : variant

This property holds the border vertices of the polygon. By default no vertex is set.


Videos

Voted #1 for:

  • Easiest to learn
  • Most time saving
  • Best support

Develop Cross-Platform Apps and Games 50% Faster!

  • Voted the best supported, most time-saving and easiest to learn cross-platform development tool
  • Based on the Qt framework, with native performance and appearance on all platforms including iOS and Android
  • Offers a variety of plugins to monetize, analyze and engage users
FREE!
create apps
create games
cross platform
native performance
3rd party services
game network
multiplayer
level editor
easiest to learn
biggest time saving
best support