Sign in Join
Wiki copytemporary

Colors/es: what changed

Revision 3 to 4. Removed lines have a minus sign; added lines have a plus sign.

OldNewLine
11# Descripción
22
33En el LCL TColor es el tipo estandar para color. Es compatible con TColor de Delphi. TColor puede representar cualquiera de los dos *either', tanto' un valor RGB (3x8bit), o*or'' un color de sistema **system** tal como **clDefault**. El LCL puede trabajar además con el fpImage system que utiliza el tipo TFPColor (el cual es RGBA (4x16bit), no RGB (3x8bit) como TColor).
44
55En referencia a este tema de los colores nos puede resultar de utilidad este pequeño programa [Lazarus Color Picker (lcolorpicker)](http://lcolorpicker.sourceforge.net/)
66
77RGB = Red (rojo) Green (verde) Blue (azul).
88
99## Conversiones entre valores TColor y RGB
1010
1111La unit **Graphics** aporta las siguientes funciones:
1212
1313``` pascal
1414function Blue(rgb: TColor): BYTE; // does not work on system color
1515function Green(rgb: TColor): BYTE; // does not work on system color
1616function Red(rgb: TColor): BYTE; // does not work on system color
1717function RGBToColor(R, G, B: Byte): TColor;
1818procedure RedGreenBlue(rgb: TColor; out Red, Green, Blue: Byte); // does not work on system color
1919function FPColorToTColor(const FPColor: TFPColor): TColor;
2020function TColorToFPColor(const c: TColor): TFPColor; // does not work on system color
2121function IsSysColor(AColor: TColorRef): Boolean;
2222```
2323
2424## Convertir TColor hacia/desde una cadena
2525
2626Funciones para convertir cadenas tales como "25500" o "\$AA0088" o "clNavy" a TColor:
2727
2828- StringToColor
2929- StringToColorDef
3030
3131Para convertir TColor a una cadena agradable:
3232
3333- ColorToString
3434
3535# Tabla de colores estandar
3636
3737Se proveen 20 constantes de colores predefinidos, los cuales son compatibles con Delphi:
3838
3939| Constante de Color | Significado | Valor hexadecimal para usar con TColor | Ejemplo |
4040|----|----|----|----|
4141| clBlack | Black | TColor(\$000000); | |
4242| clMaroon | Maroon | TColor(\$000080); | |
4343| clGreen | Green | TColor(\$008000); | |
4444| clOlive | Olive Green | TColor(\$008080); | |
4545| clNavy | Navy Blue | TColor(\$800000); | |
4646| clPurple | Purple | TColor(\$800080); | |
4747| clTeal | Teal | TColor(\$808000); | |
4848| clGray | Grey | TColor(\$808080); | |
4949| clSilver | Silver | TColor(\$C0C0C0); | |
5050| clRed | Red | TColor(\$0000FF); | |
5151| clLime | Lime Green | TColor(\$00FF00); | |
5252| clYellow | Yellow | TColor(\$00FFFF); | |
5353| clBlue | Blue | TColor(\$FF0000); | |
5454| clFuchsia | Fuchsia | TColor(\$FF00FF); | |
5555| clAqua | Aqua | TColor(\$FFFF00); | |
5656| clLtGray | Light Grey | TColor(\$C0C0C0); | clSilver alias |
5757| clDkGray | Dark Grey | TColor(\$808080); | clGray alias |
5858| clWhite | White | TColor(\$FFFFFF); | |
5959| clCream | Cream | TColor(\$F0FBFF); | Lazarus 1.2 and newer |
6060| clMedGray | Medium Grey | TColor(\$A4A0A0); | Lazarus 1.2 and newer |
6161| clMoneyGreen | Mint Green | TColor(\$C0DCC0); | Lazarus 1.2 and newer |
6262| clSkyBlue | Sky Blue | TColor(\$F0CAA6); | Lazarus 1.2 and newer |
6363
6464# System colors
6565
6666## Ejemplo: clInfoBk, clInfoText
6767
6868Los colores de sistema son colores constantes con un significado especial. Su valor real depende del contexto y tema. No son colores simples.
6969
7070Por ejemplo **clInfoBk**:
7171
7272``` pascal
7373Form1.Canvas.Brush.Color:=clInfoBk; // Utiliza la brocha por defecto del fondo de una ventana de sugerencia.
7474Form1.Canvas.FillRect(10,10,50,50);
7575```
7676
7777Una ventana de sugerencia en MS Windows debería tener un fondo blanco por lo que lo siguiente se dibujará en blanco. En Linux/GTK2 puede que tenga una textura metálica, por lo que lo siguiente dibujará la textura. Si necesitas poner algo de texto dentro entonces necesitas un color adecuado como **clInfoText**, de otra forma el texto puede resultar ilegible por parte del ususario. Por ejemplo:
7878
7979``` pascal
8080Form1.Canvas.Brush.Color:=clInfoBk; // Utiliza el color de brocha para fondo de una ventana de sugerencia.
8181Form1.Canvas.FillRect(10,10,50,50);
8282Form1.Canvas.Font.Color:=clInfoText; // Utiliza el color de texto por defecto de una ventana de sugerencia.
8383Form1.Canvas.TextOut(10,10,'Hint');
8484```
8585
8686El color de sistema **clInfoBk** no se puede utilizar para **Pen.Color** ni para Font.Color. Si lo utilizas el resultado no está definido y depende tanto del widgetset como del tema del usuario. Lo mismo para **clInfoText**: Solamente puede utilizarse como Font.Color. Utilizarlo para **Brush.Color** puede que no funcione. Hasta el momento, todos los widgetsets permiten utilizarlo con **Pen.Color** también.
8787
8888Por ejemplo un listado de colores y su aspecto visible utilizado en fuentes:
8989
90-<img src="ListadoColoresFuentes.png" title="ListadoColoresFuentes.png" width="200" />
90+![](/wiki-images/d/d1/ListadoColoresFuentes.png)
9191
9292## Cambios de Tema
9393
9494Cuando el usuario cambia el tema, los colores de sistema también cambian. Un **clInfoBk** puede cambiar de blanco a azul de un color a una textura. Este cambio tendrá lugar cuando habilites un nuevo manejador de brocha (brush). Ten en cuenta que una simple asignación como Brush.Color:=clInfoBk no habilita un manejador de brocha. El manejador de brocha se habilita en uso. Por ejemplo:
9595
9696``` pascal
9797Form1.Canvas.Brush.Color:=clInfoBk; // Esto no creará un nuevo manejador de brocha.
9898Form1.Canvas.FillRect(10,10,50,50); // Esto creará el manejador de brocha con la actual brocha del tema activo para ventanas de sugerencia.
9999...
100100// Si el tema cambia en este momento el Brush.Handle está todavía establecido con los valores antiguos.
101101...
102102Form1.Canvas.FillRect(10,10,50,50); // Esto pintará con la brocha del tema anterior.
103103Form1.Canvas.Brush.Color:=clInfoBk; // Asignando el valor antiguo no creará un nuevo manejador de brocha.
104104Form1.Canvas.FillRect(10,10,50,50); // Esto pintará con la brocha del tema anterior.
105105Form1.Canvas.Brush.Color:=clRed; // Asignando un color nuevo, invalida manejador (handle) anterior.
106106Form1.Canvas.Brush.Color:=clInfoBk; // Asignando un color nuevo, invalida manejador (handle) anterior.
107107Form1.Canvas.FillRect(10,10,50,50); // Esto creará un nuevo manejador y pintará con el nuevo tema.
108108```
109109
110110## Tabla de colores del sistema
111111
112112La siguente tabla lista los colores del sistema y su significado. Utilizarlos fuera de lo especificado en la definición no estaría definido y el resultado obtenido depende del widgetset y del tema. Por ejemplo **clDefault** es el color de fondo para la brocha (brush) en el contexto de dispositivo utilizado. Si lo que necesitas es pintar elementos tipo button en tus propios controles personalizados entonces utiliza las funciones de la unidad **Themes**.
113113
114114**Constant**
115115
116116**Definición LCL**
117117
118118**Notas Delphi**
119119
120120**Widgetsets Soportados**
121121
122122clNone
123123
124124Indicates "do not paint". Utilizarlos como color de Control no esta definido. El control no será transparente.
125125
126126\-
127127
128128todos
129129
130130clDefault
131131
132132Using it for Brush will use the normal background brush of the target DC (device context).
133133
134134- On a Form's canvas a *FillRect* will paint a rectangular area filled with the normal background of a standard window. This is whatever the widgetset and theme defines. This might be the color gray or a gradient or a picture.
135135- Using clDefault on the Canvas of a TListBox will paint with the normal background, which is normally white on Windows. So in a TListBox clDefault is the same as clWindow.
136136- Using it as Pen color will use the default line color for the device context.
137137- Using it as Font color will use the normal text color of the device context.
138138
139139\| -
140140
141141all
142142
143143clScrollBar
144144
145145Scrollbar body
146146
147147\-
148148
149149all
150150
151151clBackground
152152
153153?
154154
155155\-
156156
157157all
158158
159159clActiveCaption
160160
161161Active window titlebar
162162
163163\-
164164
165165none
166166
167167clInactiveCaption
168168
169169Inactive window titlebar
170170
171171\-
172172
173173none
174174
175175clMenu
176176
177177Regular menu item background color
178178
179179\-
180180
181181none
182182
183183clWindow
184184
185185The normal background brush of unselected text. Defined for controls like TEdit, TComboBox, TMemo, TListBox, TTreeView.
186186
187187\-
188188
189189none
190190
191191clWindowFrame
192192
193193Color of frame around the window
194194
195195\-
196196
197197none
198198
199199clMenuText
200200
201201The font color to use together with clMenu
202202
203203\-
204204
205205none
206206
207207clWindowText
208208
209209Font color to use together with clWindow
210210
211211\-
212212
213213none
214214
215215clCaptionText
216216
217217Active window titlebar text color
218218
219219\-
220220
221221none
222222
223223clActiveBorder
224224
225225?
226226
227227\-
228228
229229none
230230
231231clInactiveBorder
232232
233233?
234234
235235\-
236236
237237none
238238
239239clAppWorkspace
240240
241241MDIMain form background
242242
243243\-
244244
245245none
246246
247247clHighlight
248248
249249The brush color of selected element
250250
251251\-
252252
253253none
254254
255255clHighlightText
256256
257257Font color of selected text (to use together with clHighligh).
258258
259259\-
260260
261261none
262262
263263clBtnFace
264264
265265Button background
266266
267267\-
268268
269269none
270270
271271clBtnShadow
272272
273273Button shadow color (bottom right) used to achieve 3D effect
274274
275275\-
276276
277277none
278278
279279clGrayText
280280
281281The font color of disabled element
282282
283283\-
284284
285285none
286286
287287clBtnText
288288
289289Button font color to use together with clBtnFace
290290
291291\-
292292
293293none
294294
295295clInactiveCaptionText
296296
297297Inactive window titlebar text color
298298
299299\-
300300
301301none
302302
303303clBtnHighlight
304304
305305Button highlight color (top left) used to achieve 3D effect
306306
307307\-
308308
309309none
310310
311311cl3DDkShadow
312312
313313?
314314
315315\-
316316
317317none
318318
319319cl3DLight
320320
321321?
322322
323323\-
324324
325325none
326326
327327clInfoText
328328
329329Font color for hints. Use together with clInfoBk
330330
331331\-
332332
333333all
334334
335335clInfoBk
336336
337337Brush color for hints. Use together with clInfoText
338338
339339\-
340340
341341all
342342
343343clHotLight
344344
345345?
346346
347347\-
348348
349349none
350350
351351clGradientActiveCaption
352352
353353The second color used to make gradient of active window titlebar
354354
355355\-
356356
357357none
358358
359359clGradientInactiveCaption
360360
361361The second color used to make gradient for inactive window titlebar
362362
363363\-
364364
365365none
366366
367367clMenuHighlight
368368
369369The background color of selected menu item
370370
371371\-
372372
373373none
374374
375375clMenuBar
376376
377377The Backround color of menu bar
378378
379379\-
380380
381381none
382382
383383clForm
384384
385385?
386386
387387\-
388388
389389none
390390
391391clColorDesktop
392392
393393?
394394
395395\-
396396
397397none
398398
399399cl3DFace
400400
401401?
402402
403403\-
404404
405405none
406406
407407cl3DShadow
408408
409409?
410410
411411\-
412412
413413none
414414
415415cl3DHiLight
416416
417417?
418418
419419\-
420420
421421none
422422
423423clBtnHiLight
424424
425425Same as clBtnHighlight
426426
427427\-
428428
429429none
430430
431431# Dibujando theme elements en tus controles personalizados
432432
433433La unidad **Themes** aporta funciones para dibujar elementos individuales de controles estandar. Por ejemplo, para dibujar un signo de expansión como un TTreeView utiliza el siguiente código:
434434
435435``` pascal
436436uses Themes;
437437
438438...
439439
440440procedure TYourCustomControl.Paint;
441441const
442442 PlusMinusDetail: array[Boolean {Hot}, Boolean {Expanded}] of TThemedTreeview =
443443 (
444444 (ttGlyphClosed, ttGlyphOpened),
445445 (ttHotGlyphClosed, ttHotGlyphOpened)
446446 );
447447var
448448 Details: TThemedElementDetails;
449449 R: TRect;
450450 Collapse: boolean;
451451begin
452452 ...
453453 //draw a themed expand sign.
454454 Details := ThemeServices.GetElementDetails(PlusMinusDetail[False, Collapse]);
455455 R := Rect(ALeft, ATop, ARight + 1, ABottom + 1);
456456 ThemeServices.DrawElement(Canvas.Handle, Details, R, nil);
457457 ...
458458end;
459459```
460460
461461# Conversiones de color hacia/desde html
462462
463463- [Convertir color desde/hacia HTML](http://wiki.lazarus.freepascal.org/Convert_color_to/from_HTML/es)
464464
465465- [Discusión sobre convertir color *desde/hacia HTML](http://wiki.lazarus.freepascal.org/Talk:Convert_color_to/from_HTML)
466466
467467---
468468*From the Free Pascal wiki, page "Colors/es", as it stood on 2020-02-11 after a change by Trev, out of the wiki's dump of 2024-05-26. Copyright stays with the author who wrote it, according to the old wiki's [[Licensing]] page. If you have concerns about this material, [message the admin](/wiki-contact).*

Back to history