Zum Hauptinhalt springen

Browser Console

In ChatGPT öffnen
24.10
Java API

Die Verwendung der Konsole des Browsers, um wertvolle Programminformationen auszugeben, ist ein integraler Bestandteil des Entwicklungsprozesses. Die BrowserConsole-Utility-Klasse bietet zahlreiche Funktionen zur Verbesserung der Protokollierungsfähigkeiten.

Instanz

Holen Sie sich eine Instanz von BrowserConsole mit der Methode App.console(). Drucken Sie beliebige Objekte als einen der fünf Protokolltypen: log, info, warn, error oder debug.

import static com.webforj.App.console;
// Typen
console().log("Protokollnachricht");
console().info("Infomeldung");
console().warn("Warnmeldung");
console().error("Fehlermeldung");
console().debug("Debug-Nachricht");

Stil

Verwenden Sie die Builder-Methoden, um das Erscheinungsbild der Protokollnachricht festzulegen. Jeder Builder hat Optionen, um eine bestimmte Eigenschaft zu ändern. Es ist auch möglich, mehrere Stile zu mischen. Sobald eine Konsolennachricht ausgegeben wird, werden alle angewandten Stile bei nachfolgenden Nachrichten nicht übernommen, es sei denn, sie werden ausdrücklich neu definiert.

Tipp

Verwenden Sie die Methode setStyle, um die Eigenschaften des BrowserConsole-Protokolls zu ändern, die von den Buildern nicht angegeben sind.

Hintergrundfarbe

Setzen Sie die Hintergrundfarbe mit der Methode background(), die das BackgroundColorBuilder zurückgibt. Verwenden Sie Methoden, die nach Farbe benannt sind, wie blue(), oder wählen Sie einen spezifischen Wert mit colored(String color).

// Hintergrundbeispiele
console().background().blue().log("Blauer Hintergrund");
console().background().colored("#031f8f").log("Benutzerdefinierter blauer Hintergrund");

Textfarbe

Setzen Sie die Textfarbe mit der Methode color(), die das ColorBuilder zurückgibt. Verwenden Sie Methoden, die nach Farbe benannt sind, wie red(), oder wählen Sie einen spezifischen Wert mit colored(String color).

// Farbbeispiele
console().background().red().log("Roter Text");
console().color().colored("#becad2").log("Benutzerdefinierter hellbläulich-grauer Text");

Schriftgröße

Setzen Sie die Schriftgröße mit der Methode size(), die das FontSizeBuilder zurückgibt. Verwenden Sie Methoden, die nach einer Größe benannt sind, wie small(), oder wählen Sie einen spezifischen Wert mit from(String value).

// Größenbeispiele
console().size().small().log("Kleine Schrift");
console().size().from("30px").log("30px Schrift");
Tipp

Die Methode from(String value) kann auch andere Schriftgrößenwerte wie rem und vw annehmen.

Schriftstil

Setzen Sie den Schriftstil mit der Methode style(), die das FontStyleBuilder zurückgibt. Verwenden Sie beispielsweise die Methode italic(), um das Konsolenprotokoll kursiv darzustellen.

// Stilbeispiele
console().style().italic().log("Kursive Schrift");
console().style().normal().log("Normale Schrift");

Texttransformation

Steuern Sie die Großschreibung der Zeichen in einer Nachricht mit der Methode transform(), die das TextTransformBuilder zurückgibt. Verwenden Sie beispielsweise die Methode capitalize(), um den ersten Buchstaben jedes Wortes in Großbuchstaben zu transformieren.

// Transformationsbeispiele
// Großschreibung Texttransformation
console().transform().capitalize().log("Großschreibung Texttransformation");
// GROSSBUCHSTABEN TEXTTRANSFORMATION
console().transform().uppercase().log("GROSSBUCHSTABEN Texttransformation");

Schriftgewicht

Bestimmen Sie, wie dick der Text ist, mit der Methode weight(), die das FontWeightBuilder zurückgibt. Verwenden Sie beispielsweise die Methode lighter(), um die Schrift leichter als normal zu machen.

// Gewichtbeispiele
console().weight().bold().log("Fette Schrift");
console().weight().lighter().log("Leichtere Schrift");

Stile mischen

Es ist möglich, Methoden zu mischen und anzupassen, um eine benutzerdefinierte Protokollanzeige zu erstellen.

// Eine Vielzahl von Optionen für benutzerdefinierte Protokollanzeige
console()
.weight().bolder()
.size().larger()
.color().gray()
.style().italic()
.transform().uppercase()
.background().blue()
.warn("Stile mischen");