Icon
Der IconBuilder (Fmh.Icon(IconType)) rendert ein Material-Icon über
ein einheitliches Fluent-API. Aufruf immer über @Html.Fmh(Fmh.Icon(...)...).
Icon
Ein Material-Icon über Fmh.Icon(IconType).
@Html.Fmh(Fmh.Icon(IconType.Home))
Darstellung
Der IconBuilder wird über Fmh.Icon(IconType) erzeugt und mit @Html.Fmh(...) gerendert. Ausgegeben wird ein Material-Icons-Element (<i class="material-icons">…</i>); die Material-Icons-Schrift muss geladen sein.
@Html.Fmh(Fmh.Icon(IconType.Home))
Das gewünschte Symbol wird über den IconType gewählt (z. B. Home, Edit, Delete, Star, Info).
Optionen
| Methode | Erklärung |
|---|---|
.Icon(IconType icon) |
Das darzustellende Symbol (bereits über Fmh.Icon(IconType) gesetzt) |
.Color("#3C5587") |
Vordergrundfarbe des Icons als Hex-Wert (style="color:…") |
.Tooltip("…") |
Tooltip-Text; setzt title und data-toggle="tooltip" |
.IsInDisabledState(bool = true) |
Stellt das Icon im deaktivierten Zustand dar (fmh-icon-button-disabled) |
.Id("…") |
Setzt die HTML-id (ohne Angabe automatisch generiert) |
.Attributes(new { @class = "ms-2" }) |
Beliebige zusätzliche HTML-Attribute |
.AppendToElement("#ziel") |
Platziert das Icon per Script nachträglich in ein Ziel-Element (CSS-Selektor) statt an der Aufrufstelle |
.WithClientScript(template) |
Hängt ein clientseitiges Script an das Icon (für Interaktionen) |
Icon deaktiviert
Deaktivierter Zustand über .IsInDisabledState().
@Html.Fmh(Fmh.Icon(IconType.Delete)
.IsInDisabledState())
Darstellung
Der IconBuilder wird über Fmh.Icon(IconType) erzeugt und mit @Html.Fmh(...) gerendert. Ausgegeben wird ein Material-Icons-Element (<i class="material-icons">…</i>); die Material-Icons-Schrift muss geladen sein.
@Html.Fmh(Fmh.Icon(IconType.Home))
Das gewünschte Symbol wird über den IconType gewählt (z. B. Home, Edit, Delete, Star, Info).
Optionen
| Methode | Erklärung |
|---|---|
.Icon(IconType icon) |
Das darzustellende Symbol (bereits über Fmh.Icon(IconType) gesetzt) |
.Color("#3C5587") |
Vordergrundfarbe des Icons als Hex-Wert (style="color:…") |
.Tooltip("…") |
Tooltip-Text; setzt title und data-toggle="tooltip" |
.IsInDisabledState(bool = true) |
Stellt das Icon im deaktivierten Zustand dar (fmh-icon-button-disabled) |
.Id("…") |
Setzt die HTML-id (ohne Angabe automatisch generiert) |
.Attributes(new { @class = "ms-2" }) |
Beliebige zusätzliche HTML-Attribute |
.AppendToElement("#ziel") |
Platziert das Icon per Script nachträglich in ein Ziel-Element (CSS-Selektor) statt an der Aufrufstelle |
.WithClientScript(template) |
Hängt ein clientseitiges Script an das Icon (für Interaktionen) |
Icon mit Farbe
Vordergrundfarbe über .Color(hex).
@Html.Fmh(Fmh.Icon(IconType.Star)
.Color("#3C5587"))
Darstellung
Der IconBuilder wird über Fmh.Icon(IconType) erzeugt und mit @Html.Fmh(...) gerendert. Ausgegeben wird ein Material-Icons-Element (<i class="material-icons">…</i>); die Material-Icons-Schrift muss geladen sein.
@Html.Fmh(Fmh.Icon(IconType.Home))
Das gewünschte Symbol wird über den IconType gewählt (z. B. Home, Edit, Delete, Star, Info).
Optionen
| Methode | Erklärung |
|---|---|
.Icon(IconType icon) |
Das darzustellende Symbol (bereits über Fmh.Icon(IconType) gesetzt) |
.Color("#3C5587") |
Vordergrundfarbe des Icons als Hex-Wert (style="color:…") |
.Tooltip("…") |
Tooltip-Text; setzt title und data-toggle="tooltip" |
.IsInDisabledState(bool = true) |
Stellt das Icon im deaktivierten Zustand dar (fmh-icon-button-disabled) |
.Id("…") |
Setzt die HTML-id (ohne Angabe automatisch generiert) |
.Attributes(new { @class = "ms-2" }) |
Beliebige zusätzliche HTML-Attribute |
.AppendToElement("#ziel") |
Platziert das Icon per Script nachträglich in ein Ziel-Element (CSS-Selektor) statt an der Aufrufstelle |
.WithClientScript(template) |
Hängt ein clientseitiges Script an das Icon (für Interaktionen) |
Icon mit Tooltip
Tooltip-Text über .Tooltip(...).
@Html.Fmh(Fmh.Icon(IconType.Edit)
.Tooltip("Bearbeiten"))
Darstellung
Der IconBuilder wird über Fmh.Icon(IconType) erzeugt und mit @Html.Fmh(...) gerendert. Ausgegeben wird ein Material-Icons-Element (<i class="material-icons">…</i>); die Material-Icons-Schrift muss geladen sein.
@Html.Fmh(Fmh.Icon(IconType.Home))
Das gewünschte Symbol wird über den IconType gewählt (z. B. Home, Edit, Delete, Star, Info).
Optionen
| Methode | Erklärung |
|---|---|
.Icon(IconType icon) |
Das darzustellende Symbol (bereits über Fmh.Icon(IconType) gesetzt) |
.Color("#3C5587") |
Vordergrundfarbe des Icons als Hex-Wert (style="color:…") |
.Tooltip("…") |
Tooltip-Text; setzt title und data-toggle="tooltip" |
.IsInDisabledState(bool = true) |
Stellt das Icon im deaktivierten Zustand dar (fmh-icon-button-disabled) |
.Id("…") |
Setzt die HTML-id (ohne Angabe automatisch generiert) |
.Attributes(new { @class = "ms-2" }) |
Beliebige zusätzliche HTML-Attribute |
.AppendToElement("#ziel") |
Platziert das Icon per Script nachträglich in ein Ziel-Element (CSS-Selektor) statt an der Aufrufstelle |
.WithClientScript(template) |
Hängt ein clientseitiges Script an das Icon (für Interaktionen) |