C# - ListBox és DropDownList tetszőleges színű elemekkel

forráskód letöltése
E cikkben arra keressük a választ, hogy miként oldható meg az a feladat, hogy a ListBox, illetve a DropDownList kontrolokban megjelenő elemek háttere tetszőleges, általunk meghatározott színű legyen. És hogy mire is jó ez a színezés? Nagyon előnyös olyan esetekben, ahol a lista elemeit valamilyen szempont szerint csoportosítani szeretnénk. Ekkor az azonos csoportban lévő elemek azonos színt kaphatnak, így a felhasználó már ránézésre eldöntheti, hogy melyik elem milyen tulajdonságú, milyen csoporthoz tartozik.
Mellékelt példa megnyitása előtt szükséges egy ColorList nevű virtuális könyvtár létrehozása, mely a mellékelt példa könyvtárára mutat. Ehhez nyissa meg a mellékelt mappa Tulajdonság ablakát és itt a Webmegosztás lapon engedélyezze a mappa megosztását olvasási és parancsfájlok futtatási jogával.
A megvalósítást a SELECT HTML objektum OPTIONS objektumainál kell keresnünk. Minden egyes elemet, mely megjelenik a listában egy-egy OPTION objektum ír le. Itt nincs más tennivalónk mint egy stílust alkalmazni, melyben megadjuk a BACKGROUND-COLOR tulajdonságot, mely az adott objektum háttérszínét határozza meg.
Amennyiben ezen kontrolok HTML kódját programból generálnánk, akkor lehetőség lenne arra is, hogy az egyes színeket is programból rendeljük az elemekhez, melyek aktuális értékét akár egy adattáblában is tárolhatjuk.
      <SELECT style="Z-INDEX: 101; LEFT: 200px; WIDTH: 192px; POSITION: absolute; TOP: 32px; HEIGHT: 88px; BACKGROUND-COLOR: #ffffcc" size="5" class="f8">
        <OPTION style="BACKGROUND-COLOR: #ffcc00">Rendszergazda 1</OPTION>
        <OPTION style="BACKGROUND-COLOR: #99cc00">Felhasználó 1</OPTION>
        <OPTION style="BACKGROUND-COLOR: #99cc00">Felhasználó 2</OPTION>
        <OPTION style="BACKGROUND-COLOR: #ffcc00">Rendszergazda 2</OPTION>
        <OPTION style="BACKGROUND-COLOR: #99cc00">Felhasználó 3</OPTION>
        <OPTION style="BACKGROUND-COLOR: #99cc00">Felhasználó 4</OPTION>
        <OPTION style="BACKGROUND-COLOR: #99cc00">Felhasználó 5</OPTION>
        <OPTION style="BACKGROUND-COLOR: #33cccc">Adatbázis felelős 1</OPTION>
        <OPTION style="BACKGROUND-COLOR: #99cc00">Felhasználó 6</OPTION>
        <OPTION style="BACKGROUND-COLOR: #99cc00">Felhasználó 7</OPTION>
      </SELECT>