APEX: Interactive Grid - Spaltengrupppen und einfärben

Zum individuellen Einfärben eines Interactive Grids (IG) bieten sich die Möglichkeiten von CSS an.

Zum Färben eines konkreten IG bekommt dieses zur Identifikation eine Static_ID:
Advanced / Static ID: Px_IG

Sollen alle IGs identisch gefärbt werden, kann dieser Step entfallen.

Im CSS sind mehreren Ebenen des IG zu behandeln:

• Header-Gruppe
• Header
• Spalten - allgemein
• Spalten - readonly

Seiten-Ebene

Die wesentlichen Definitionen werden auf Seiten-Ebene als Inline-CSS festgelegt:
PageX (oberster Knoten) / CSS / Inline

/* Spaltengruppen */
#P4_IG .a-GV-headerGroup[data-idx="1"] {
  background-color: khaki;
}
/* Edit-Modus: nichtänderbarer Text trotzdem in schwarz (= besser lesber) 
eigentlich: ALLE Zellen mit Textfarbe schwarz */
#P4_IG .a-GV-cell {
  color: black; 
}
/* Farbschema-Gruppe 1 - zum Einfärben bestimmter Spalten */
#P4_IG .fs_grp1 {
    background-color: khaki;
}
/* Edit-Modus: Hintergrundfarbe für den änderbaren Text */
#P4_IG .fs_grp_edit {
    background-color: lightyellow;
}

Die Spaltengruppen werden hier direkt über [data-idx="x"] adressiert, da es nur wenige geben sollte.
#P4_IG .a-GV-cell legt die Farbe für ALLE Zellen fest. Damit wird verhindert, dass nicht-änderbare Zellen ausgegraut dargestellt werden.
#P4_IG .fs_grp1 definiert die Eigenschaften, die unten den Zellen und Spaltenköpfen zugewiesen werden.
#P4_IG .fs_grp_edit passt die Hintergrundfarbe für die änderbaren Felder an, damit diese besser zum gesmten Farbschema passen.

Spalten-Ebene

Auf Spaltenebene sind für Spalte und Kopf getrennte definitionen vorzugeben.

Festlegung für Spalten-Kopf:
- Spalte / Spaltengruppe markieren
- Advanced / JavaScript Initialization Code

function(config) {
    config.defaultGridColumnOptions = {
        headingCssClasses: "fs_grp1"
    }
    return config;
}

Für die Kopfzeile muss leider eine JavaScript-Funktion genutzt werden. Im Gegensatz zu den Zellen ist hier keine deklarative Zuweisung möglich.

Festlegung für Spalten-Zellen:
- Spalte / Spaltengruppe markieren
- Appearance / CSS Classes: fs_grp1
Die Zuweisung zu den Spalten erfolgt deklarativ.

Quelle u.a.: https://community.oracle.com/tech/developers/discussion/comment/14920914/#Comment_14920914