# Gradient fill problem

**URL:** <https://forum.kirupa.com/t/gradient-fill-problem/10742>\
**Category:** Uncategorized\
**Created:** [January 6, 2003, 7:06pm UTC](https://forum.kirupa.com/t/gradient-fill-problem/10742 "2003-01-06T19:06:00Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![billwatson](https://avatars.discourse-cdn.com/v4/letter/b/c4cdca/32.png) [@billwatson](https://forum.kirupa.com/u/billwatson)\
**Post date:** [January 6, 2003, 7:06pm UTC](https://forum.kirupa.com/t/gradient-fill-problem/10742/1 "2003-01-06T19:06:00Z")

</div>

Hi  
Can I use a gradient fill as a color.

I want to have a dynamic text box with a gradient fill as the background color. Anybody have any ideas as to how I can do this? If its possible I would imagine I have to use backgroundcolor property.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [January 6, 2003, 7:44pm UTC](https://forum.kirupa.com/t/gradient-fill-problem/10742/2 "2003-01-06T19:44:53Z")

</div>

You will have to create a rectangle in the layer below it. That rectangle will have to have the gradient fill.

I don’t know of a way to make the background of the textbox itself a gradient.

Although be care, a lot of times, text is hard to read on a gradient, so choose your colors wisely.

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [January 6, 2003, 8:09pm UTC](https://forum.kirupa.com/t/gradient-fill-problem/10742/3 "2003-01-06T20:09:03Z")

</div>

use Flash’s drawing API  
assuming “dt” is the instance name of your dynamic text field (or input for that matter)

```auto

matrix = {matrixType:"box", x:dt._x, y:dt._y, w:dt._width, h:dt._height, r:Math.PI/2}; 
beginGradientFill("linear", [0x444444,0xeeeeee], [100,100], [0,255], matrix);
moveto(dt._x,dt._y);
lineto(dt._x+dt._width, dt._y);
lineto(dt._x+dt._width, dt._y+dt._height);
lineto(dt._x, dt._y+dt._height);
lineto(dt._x, dt._y);
endFill();

```

will make a grey to grey gradient down the height of the text field. The colors are specified in [0x888888,0xeeeeee], which you can easily change, and if you want the gradient direction, change r: in the matrix which is the angle in radians. Now its at Pi/2 which is 90 degrees or down, if you want it across, you can make it 0.

So basically what this does is draws a box to match the dimensions of the textfield and gives the box a gradient fill. Its not the ‘actual’ background of the textfield which you could set to any given solid color with TextField.backgroundColor, but rather its a dynamically drawn box behind the text field to match it and act as a backdrop

---

<div class="post-metadata">

**Author:** ![system](https://canada1.discourse-cdn.com/flex011/uploads/kirupa/original/3X/6/2/621e5c11736f46532526e61be85940af4230f3e5.png) [@system](https://forum.kirupa.com/u/system)\
**Post date:** [January 6, 2003, 9:02pm UTC](https://forum.kirupa.com/t/gradient-fill-problem/10742/4 "2003-01-06T21:02:23Z")

</div>

Many thanks…just what i was looking for.