ONLINE HELP
 WINDEVWEBDEV AND WINDEV MOBILE

This content has been translated automatically.  Click here  to view the French version.
Help / WLanguage / WLanguage functions / Controls, pages and windows / Drawing functions
  • Gradient parameters
  • Drawing in Browser code
WINDEV
WindowsLinuxJavaReports and QueriesUser code (UMC)
WEBDEV
WindowsLinuxPHPWEBDEV - Browser code
WINDEV Mobile
AndroidAndroid Widget iPhone/iPadIOS WidgetApple WatchMac Catalyst
Others
Stored procedures
Draws a rectangle:
  • in an Image control,
  • WEBDEV - Server codeWindowsLinux in a variable of type Image.
  • WEBDEV - Server code in a variable of type WDPic (on the background layer),
  • WEBDEV - Server code in a variable of type picLayer.
Note: To draw custom rectangles, use the dBorder function..
Linux Caution: Using this function under Linux requires a specific configuration.. For more details, see The drawings.
Example
// Dessin d'un rectangle dont le fond passe du rouge au bleu
// en passant par le jaune
dStartDrawing(IMG_Image1)
dRectangleGradient(10, 20, 100, 150, LightRed, LightBlue, 0, LightYellow, 30)
Syntax

Drawing a rectangle by specifying the points of the rectangle and the gradient Hide the details

dRectangleGradient([<Image>, ] <X1> , <Y1> , <X2> , <Y2> , <Start color> , <End color> [, <Angle> [, <Color 3> [, <Distance color 3> [, <Color 4> [, <Distance color 4>]]]]])
<Image>: Optional control name or optional Image, WDPic or picLayer variable
WindowsLinux Image to use. This image can correspond to:
  • the name of an Image control.
  • the name of a variable of type Image.
  • WEBDEV - Server code the name of a variable of type WDPic. Only the background layer will be handled.
  • WEBDEV - Server code the name of a variable of type picLayer.
If this parameter is not specified, it is necessary to define the drawing destination with dStartDrawing.
<X1>: Integer
X-coordinate (in pixels) of the upper-left corner of the rectangle.
<Y1>: Integer
Y-coordinate (in pixels) of the upper-left corner of the rectangle.
<X2>: Integer
X-coordinate (in pixels) of the lower-right corner of the rectangle.
<Y2>: Integer
Y-coordinate (in pixels) of the lower-right corner of the rectangle.
<Start color>: Integer or constant
Start color of the gradient. This color can correspond to:
<End color>: Integer or constant
End color of the gradient. This color can correspond to:
<Angle>: Optional integer
Angle that will be used for the selection of colors in the gradient. The angle value is included between 0 (horizontal angle, default value) and 360°.
<Color 3>: Optional constant or integer
Color that will be used in the gradient. This color can correspond to:
<Distance color 3>: Optional integer
Percentage separating the start color from color 3.
<Color 4>: Optional constant or integer
Color that will be used in the gradient. This color can correspond to:
<Distance color 4>: Optional integer
Percentage separating the start color from color 4.
WEBDEV - Server code

Drawing a rectangle by specifying the points of the rectangle and by using the Background type Hide the details

dRectangleGradient([<Image>, ] <X1> , <Y1> , <X2> , <Y2> , <Gradient>)
<Image>: Optional control name or optional Image, WDPic or picLayer variable
WindowsLinux Image to use. This image can correspond to:
  • the name of an Image control.
  • the name of a variable of type Image.
  • WEBDEV - Server code the name of a variable of type WDPic. Only the background layer will be handled.
  • WEBDEV - Server code the name of a variable of type picLayer.
If this parameter is not specified, it is necessary to define the drawing destination with dStartDrawing.
<X1>: Integer
X-coordinate (in pixels) of the upper-left corner of the rectangle.
<Y1>: Integer
Y-coordinate (in pixels) of the upper-left corner of the rectangle.
<X2>: Integer
X-coordinate (in pixels) of the lower-right corner of the rectangle.
<Y2>: Integer
Y-coordinate (in pixels) of the lower-right corner of the rectangle.
<Gradient>: Background variable
Name of the Background variable the with the gradient characteristics.
WEBDEV - Server code

Drawing a rectangle by using the Rectangle type and by specifying the gradient Hide the details

dRectangleGradient([<Image>, ] <Rectangle> , <Start color> , <End color> [, <Angle> [, <Color 3> [, <Distance color 3> [, <Color 4> [, <Distance color 4>]]]]])
<Image>: Optional control name or optional Image, WDPic or picLayer variable
WindowsLinux Image to use. This image can correspond to:
  • the name of an Image control.
  • the name of a variable of type Image.
  • WEBDEV - Server code the name of a variable of type WDPic. Only the background layer will be handled.
  • WEBDEV - Server code the name of a variable of type picLayer.
If this parameter is not specified, it is necessary to define the drawing destination with dStartDrawing.
<Rectangle>: Rectangle variable
Name of the Rectangle variable that defines the coordinates of the rectangle to draw.
<Start color>: Integer or constant
Start color of the gradient. This color can correspond to:
<End color>: Integer or constant
End color of the gradient. This color can correspond to:
<Angle>: Optional integer
Angle that will be used for the selection of colors in the gradient. The angle value is included between 0 (horizontal angle, default value) and 360°.
<Color 3>: Optional constant or integer
Color that will be used in the gradient. This color can correspond to:
<Distance color 3>: Optional integer
Percentage separating the start color from color 3.
<Color 4>: Optional constant or integer
Color that will be used in the gradient. This color can correspond to:
<Distance color 4>: Optional integer
Percentage separating the start color from color 4.
WEBDEV - Server code

Drawing a rectangle by using the Rectangle type and the Background type Hide the details

dRectangleGradient([<Image>, ] <Rectangle> , <Gradient>)
<Image>: Optional control name or optional Image, WDPic or picLayer variable
WindowsLinux Image to use. This image can correspond to:
  • the name of an Image control.
  • the name of a variable of type Image.
  • WEBDEV - Server code the name of a variable of type WDPic. Only the background layer will be handled.
  • WEBDEV - Server code the name of a variable of type picLayer.
If this parameter is not specified, it is necessary to define the drawing destination with dStartDrawing.
<Rectangle>: Rectangle variable
Name of the Rectangle variable that defines the coordinates of the rectangle to draw.
<Gradient>: Background variable
Name of the Background variable the with the gradient characteristics.
Remarks

Gradient parameters

The color parameters are used as follows:
The angle is used to define the orientation of the gradient.
Gradients with 3 or 4 colors are only available for 0 or 90 degree angles.
Note: On some systems (e.g. Windows 98 or Me) or under TSE 256 colors, gradients are not available.. In this case, a rectangle whose color corresponds to <Start color> is displayed.
WEBDEV - Browser code

Drawing in Browser code

Some drawing functions are available in Browser code. The drawing functions in Browser code are based on the HTML 5 standard. More specifically, these functions are based on the "canvas" tag of HTML 5.
The drawing features in browser code are available for the recent browsers only (supporting the HTML 5 standard). To find out whether the drawing features are proposed by your browser, use DrawingAvailable.
Attention: To use the drawing functions with Internet Explorer 9, the project must include the reference to the DTD file. To do so, the HTML mode must be "HTML 4.01 Transitional + DTD". This option is available in the "Advanced" tab of the project description window.
Reminder: To display the project description window, under the "Project" pane, in the "Project" group, click on "Description".
Special case: Drawing in the browser of an Android phone: Browser drawing functions are only available in Android version 3 and higher..
Related Examples:
The drawing functions Unit examples (WINDEV): The drawing functions
[ + ] Using the main drawing functions of WINDEV to:
- Initialize an Image control for drawing
- Draw simple shapes
- Write a text into a drawing
- Change the color in a drawing
Business / UI classification: Neutral code
Component: wd300pnt.dll
Minimum version required
  • Version 12
This page is also available for…
Comments
Click [Add] to post a comment

Last update: 09/21/2024

Send a report | Local help