You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: powerapps-docs/maker/canvas-apps/functions/data-types.md
+1-1Lines changed: 1 addition & 1 deletion
Original file line number
Diff line number
Diff line change
@@ -29,7 +29,7 @@ This article provides details for the data types that canvas apps support. When
29
29
|**DateTime**| A date with a time, in the time zone of the app's user. |**DateTimeValue( "May 16, 2019 1:23:09 PM" )**|
30
30
|**GUID**| A [Globally Unique Identifier](https://en.wikipedia.org/wiki/Universally_unique_identifier). |**GUID()**<br>**GUID( "123e4567-e89b-12d3-a456-426655440000" )**|
31
31
|**Hyperlink**| A text string that holds a hyperlink. |**"http://powerapps.microsoft.com"**|
32
-
|**Image**| A [Universal Resource Identifier (URI)](https://en.wikipedia.org/wiki/Uniform_Resource_Identifier)text string to an image in .jpeg, .png, .svg, .gif, and other common web-image formats. |**MyImage** added as an app resource<br>**"https://northwindtraders.com/logo.jpg"**<br>**"appres://blobmanager/7b12ffa2..."**|
32
+
|**Image**| A [Universal Resource Identifier (URI)](https://en.wikipedia.org/wiki/Uniform_Resource_Identifier) text string to an image in .jpeg, .png, .svg, .gif, or other common web-image format. |**MyImage** added as an app resource<br>**"https://northwindtraders.com/logo.jpg"**<br>**"appres://blobmanager/7b12ffa2..."**|
33
33
|**Media**| A URI text string to a video or audio recording. |**MyVideo** added as an app resource<br>**"https://northwindtraders.com/intro.mp4"**<br>**"appres://blobmanager/3ba411c..."**|
34
34
|**Number**| A floating-point number. |**123**<br>**-4.567**<br>**8.903e121**|
35
35
|**Option set**| A choice from a set of options, backed by a number. This data type combines a localizable text label with a numeric value. The label appears in the app, and the numeric value is stored and used for comparisons. |**ThisItem.OrderStatus**|
Copy file name to clipboardExpand all lines: powerapps-docs/maker/canvas-apps/functions/function-colors.md
+24-20Lines changed: 24 additions & 20 deletions
Original file line number
Diff line number
Diff line change
@@ -15,52 +15,56 @@ search.app:
15
15
- PowerApps
16
16
---
17
17
# Color enumeration and ColorFade, ColorValue, and RGBA functions in PowerApps
18
-
Using built in color values, defining custom colors, and using alpha channel.
18
+
19
+
Use built-in color values, define custom colors, and use the alpha channel.
19
20
20
21
## Description
21
22
22
-
The **Color** enumeration is an easy way to access the colors defined by HTML's Cascading Style Sheets (CSS). For example, **Color.Red** returns a pure red color. The list of these colors is included at the end of this article.
23
+
By using the **Color** enumeration, you can easily access the colors that are defined by HTML's Cascading Style Sheets (CSS). For example, **Color.Red** returns pure red. You can find a list of these colors at the end of this topic.
24
+
25
+
The **ColorValue** function returns a color based on a color string in a CSS. The string can take any of these forms:
23
26
24
-
The **ColorValue** function returns a color based on a CSS color string. The string can be in one of three forms:
25
-
-**CSS color name:** For example **"RoxyBrown"** or **"OliveDrab"**. Spaces are omitted. See the list of supported colors below.
26
-
-**6 digit hex value:** For example **"#ffd700"** (which is the same as **"Gold"**). The string is in the format "#*rrggbb*" where *rr* is the two hexadecimal digit red portion, *gg* the green, and *bb* the blue.
27
-
-**8 digit hex value:** For example **"#ff7f5080"** (which is the same as **"Coral"** with a 50% alpha channel). The string is in the format "#*rrggbbaa*" where *rr*, *gg*, and *bb* are identical to the 6 digit form. Alpha channel is represented by *aa* with "00" representing fully transparent and *ff* representing fully opaque.
27
+
-**CSS color name:****"RoxyBrown"** and **"OliveDrab"** are examples. These names don't include spaces. The list of supported colors appears later in this topic.
28
+
-**6-digit hex value:** As an example **"#ffd700"** is the same as **"Gold"**. The string is in the format "#*rrggbb*" where *rr* is the red portion in two hexadecimal digits, *gg* is the green, and *bb* is the blue.
29
+
-**8-digit hex value:** As an example, **"#ff7f5080"** is the same as **"Coral"** with a 50% alpha channel. The string is in the format "#*rrggbbaa*" where *rr*, *gg*, and *bb* are identical to the 6-digit form. The alpha channel is represented by *aa*: **00** represents fully transparent, and **ff** represents fully opaque.
28
30
29
-
The **RGBA** function returns a color based on Red, Green, and Blue color components. It also includes an alpha channel used for mixing colors of objects layered on top of one another. Alpha varies from 0 or 0% which is fully transparent and invisible to 1 or 100% which is fully opaque and completely blocks out layers below.
31
+
The **RGBA** function returns a color based on red, green, and blue components. The function also includes an alpha channel for mixing colors of controls that are layered in front of one another. An alpha channel varies from 0 or 0% (which is fully transparent and invisible) to 1 or 100% (which is fully opaque and completely blocks out any layers behind a control).
30
32
31
-
The **ColorFade** function returns a brighter or darker version of a color. The amount of fade varies from -1 which fully darkens a color to black, to 0 which has no impact on the color, to 1 which fully brightens a color to white.
33
+
The **ColorFade** function returns a brighter or darker version of a color. The amount of fade varies from -1 (which fully darkens a color to black) to 0 (which doesn't affect the color) to 1 (which fully brightens a color to white).
32
34
33
-
## Alpha channel
35
+
## Alpha channel
34
36
35
-
Controls in a canvas appcan be layered on top of one another. Each layer can control its transparency to the layers below it. As a result colors will mix with one through the layers. For example, this diagram shows how the three primary colors mix with an alpha setting of 50%:
37
+
In a canvas app, you can layer controls in front of one another and specify the transparency of a control to any controls that are behind it. As a result, colors will blend through the layers. For example, this diagram shows how the three primary colors mix with an alpha setting of 50%:
36
38
37
-

39
+
> [!div class="mx-imgBorder"]
40
+
> 
38
41
39
-
Alpha blending can also be done with images. Not all image file formats supports an alpha channel; PNG files do while Jpeg files do not. In this example, a PNG file with a red 50% alpha squiggle, the same red color that was used in the previous example, is layered over the top of the green and blue circles from the previous example:
42
+
You can also blend images in file formats that support alpha channels. For example, you can't blend .jpeg files, but you can blend .png files. The next graphic shows the same red, green, and blue colors from the previous example, but the red color appears as a squiggle (instead of a circle) in a .png file with a 50% alpha channel:
40
43
41
-

44
+
> [!div class="mx-imgBorder"]
45
+
> 
42
46
43
-
All the **Color** enumeration values and the **ColorValue**function when used with color names or a 6digit hexadecimal value use an alpha setting of 100% or fully opaque.
47
+
If you specify a **Color** enumeration value or you build a **ColorValue**formula with a color name or a 6-digit hexadecimal value, the alpha setting is 100%, which is fully opaque.
44
48
45
49
## Syntax
46
50
47
51
**Color**.*ColorName*
48
52
49
-
**ColorName* - Required. A Cascading Style Sheet (CSS) color name. See list below of possible enumeration values.
53
+
-*ColorName* - Required. A Cascading Style Sheet (CSS) color name. The list of possible enumeration values appears at the end of this topic.
50
54
51
55
**ColorValue**( *CSSColor* )
52
56
53
-
**CSSColor* - Required. A Cascading Style Sheet (CSS) color definition. Both names of CSS colors, such as "OliveDrab", and hex values, such as "#6b8e23" and "#7fffd420", may be used. Hex values can either be in the form "#rrggbb" or "#rrggbbaa".
57
+
-*CSSColor* - Required. A Cascading Style Sheet (CSS) color definition. You can specify either a name, such as **OliveDrab**, or a hex value, such as **#6b8e23** or **#7fffd420**. Hex values can take the form of either #*rrggbb* or #*rrggbbaa*.
54
58
55
59
**RGBA**( *Red*, *Green*, *Blue*, *Alpha* )
56
60
57
-
**Red*, *Green*, *Blue* - Required. Colorcomponent values, ranging from 0 (no saturation) to 255 (full saturation).
58
-
**Alpha* - Required. Alpha component, ranging from 0 (fully transparent) to 1 (fully opaque). You can also use a percentage, 0% to 100%.
61
+
-*Red*, *Green*, *Blue* - Required. Color-component values, which range from 0 (no saturation) to 255 (full saturation).
62
+
-*Alpha* - Required. Alpha component, which ranges from 0 (fully transparent) to 1 (fully opaque). You can also use a percentage, 0% to 100%.
59
63
60
64
**ColorFade**( *Color*, *FadeAmount* )
61
65
62
-
**Color* - Required. A color value such as **Color.Red** or the output from **ColorValue** or **RGBA**.
63
-
**FadeAmount* - Required. A number between -1 and 1. -1 fully darkens a color to black, 0 has no impact on the color, and 1 fully brightens a color to white. You can also use a percentage from -100% to 100%
66
+
-*Color* - Required. A color value such as **Color.Red** or the output from **ColorValue** or **RGBA**.
67
+
-*FadeAmount* - Required. A number between -1 and 1. -1 fully darkens a color to black, 0 doesn't affect the color, and 1 fully brightens a color to white. You can also use a percentage from -100% to 100%.
0 commit comments