Admin at 16:53, 12 December 2014

2014-12-12T16:53:09Z

Admin: Created page with "= Action = Draw a smooth color gradient. =
2014-12-12T16:45:31Z

Created page with "= Action = Draw a smooth color gradient. = <s..."

Neue Seite
= Action =

Draw a smooth color gradient.

 

 

= Syntax =

CmdGradient x0, y0, rgb0, x1, y1, rgb1

 

 

= Remarks =
<div style="padding: 0px; margin: 0px;">
{| cellspacing="0" cellpadding="0" border="0" style="border: none; border-spacing: 0px; border-collapse: collapse;"
|- style="vertical-align: top;"
| valign="top" width="65" style="width: 65px; border: 2px solid rgb(0, 0, 0);" |
x0

| valign="top" width="767" style="width: 767px; border: 2px solid rgb(0, 0, 0);" |
x-coordinate of point 0, in pixels

|- style="vertical-align: top;"
| valign="top" width="65" style="width: 65px; border: 2px solid rgb(0, 0, 0);" |
y0

| valign="top" width="767" style="width: 767px; border: 2px solid rgb(0, 0, 0);" |
y-coordinate of point 0, in pixels

|- style="vertical-align: top;"
| valign="top" width="65" style="width: 65px; border: 2px solid rgb(0, 0, 0);" |
rgb0

| valign="top" width="767" style="width: 767px; border: 2px solid rgb(0, 0, 0);" |
Color of point 0, as a 24-bit RGB number. r is the most significant 8 bits, b is the least. So &hff0000 is bright red.

|- style="vertical-align: top;"
| valign="top" width="65" style="width: 65px; border: 2px solid rgb(0, 0, 0);" |
x1

| valign="top" width="767" style="width: 767px; border: 2px solid rgb(0, 0, 0);" |
x-coordinate of point 1, in pixels

|- style="vertical-align: top;"
| valign="top" width="65" style="width: 65px; border: 2px solid rgb(0, 0, 0);" |
y1

| valign="top" width="767" style="width: 767px; border: 2px solid rgb(0, 0, 0);" |
y-coordinate of point 1, in pixels

|- style="vertical-align: top;"
| valign="top" width="65" style="width: 65px; border: 2px solid rgb(0, 0, 0);" |
rgb1

| valign="top" width="767" style="width: 767px; border: 2px solid rgb(0, 0, 0);" |
Color of point 1.

|}
</div>
 

All the colour step values are calculated based on smooth curve interpolated from the rgb0 to rgb1 parameter.

The smooth curve equation is independently calculated for all three colors and the equation used is R0 + t * (R1 - R0), where t is interpolated between 0 and 1.

Gradient must be used with Scissor function to get the intended gradient display

 

 

= Example =

← Nächstältere Version		Version vom 12. Dezember 2014, 16:53 Uhr
Zeile 75:		Zeile 75:

	= <span class="f_Header">Example</span> =		= <span class="f_Header">Example</span> =
		+
		+	<source lang="bascomavr">
		+	' Pseudocode
		+	ClearScreen
		+	ColorRGB 255, 255, 255
		+	ScissorSize wScissor, hScissor
		+	' Horizontal gradient effect
		+	ScissorXY xOffset, yOffset ' Clip the Display
		+	CmdGradient xOffset, yOffset, &H808080, xOffset + wScissor, yOffset, &HFFFF00
		+	</source>
		+
		+	<source lang="bascomavr">
		+	' Pseudocode
		+
		+	' A horizontal gradient from blue to red
		+	CmdGradColor 0, 0, &H0000ff, 160, 0, &Hff0000
		+	</source> [[File:Clip0020.png\|center\|Clip0020.png]] <source lang="bascomavr">
		+	' A vertical gradient
		+	CmdGradColor 0, 0, &H808080, 0, 120, &H80ff40
		+	</source> [[File:Clip0021.png\|center\|Clip0021.png]] <source lang="bascomavr">
		+	' The same colors in a diagonal gradient
		+	CmdGradColor 0, 0, &H808080, 160, 120, &H80ff40
		+	</source> [[File:Clip0023.png\|center\|Clip0023.png]] <source lang="bascomavr">
		+	'Using a scissor rectangle to draw a gradient stripe as a background for a title
		+	ScissorXY 20, 40
		+	ScissorSize 120, 32
		+	CmdGradient 20, 0, &H606060, 140, 0, &H404080
		+	CmdText 23, 40, 29, 0, "Heading 1"
		+	</source> [[File:Clip0022.png\|center\|Clip0022.png]]
		+
		+	<br/>{{Languages}}
		+
		+	[[Category:FT800 Commands]]