Vereinfachen von DevTools mithilfe des Fokusmodus
Der Fokusmodus ist eine neue Benutzeroberfläche für DevTools. Der Fokusmodus wurde entwickelt, um die DevTools-Benutzeroberfläche zu vereinfachen und zu rationalisieren, ohne die Featuregruppe zu beeinträchtigen.
Der Fokusmodus ersetzt die Hauptzeile von Registerkarten durch eine Aktivitätsleiste, bei der es sich um eine kompakte Symbolleiste mit unverwechselbaren Symbolen handelt. Mithilfe der Aktivitätsleiste können Sie Ihre bevorzugten Tools anheften, neu anordnen und öffnen, um schnell darauf zugreifen zu können. Die Aktivitätsleiste bietet auch Zugriff auf Benutzereinstellungen, Hilfe und andere Features.
Der Fokusmodus bietet auch eine Schnellansichtsliste , um neben dem bereits in der Aktivitätsleiste ausgewählten Tool ein zweites Tool zu öffnen.
Aktivieren des Fokusmodus
Das Microsoft Edge-Team aktiviert den Fokusmodus für eine Teilmenge der Benutzer, um frühes Feedback zu sammeln. Bei einigen Benutzern ist der Fokusmodus standardmäßig aktiviert, während andere ihn zuerst aktivieren müssen.
So überprüfen Sie, ob der Fokusmodus bereits aktiviert ist, oder um ihn zu aktivieren oder zu deaktivieren:
Drücken Sie
F1, um Einstellungen zu öffnen.Klicken Sie auf "Experimente ", und scrollen Sie nach unten zum Kontrollkästchen "Fokusmodus" .
Wenn das Kontrollkästchen "Fokusmodus " aktiviert ist, ist der Fokusmodus bereits aktiviert. Aktivieren oder deaktivieren Sie das Kontrollkästchen, um den Fokusmodus zu aktivieren oder zu deaktivieren:
Schließen Sie die Einstellungen Seite. Wenn Sie den Fokusmodus-Experimentstatus geändert haben, klicken Sie auf die Schaltfläche " DevTools neu laden ", damit die Änderung wirksam wird.
Hauptunterschiede zur Standard-Benutzeroberfläche
Hier sind die wichtigsten Unterschiede zwischen der DevTools-Standardbenutzeroberfläche und dem Fokusmodus.
Aktivitätsleiste
Die Aktivitätsleiste ist der sichtbarste Unterschied zur Standard-Benutzeroberfläche. Verwenden Sie es, um Tools, Hilfefeatures und Einstellungen zu öffnen.
Standardmäßig passt sich die Position der Aktivitätsleiste an die Position des DevTools-Fensters an. Wenn DevTools abgedockt oder am unteren Rand des Browsers angedockt ist, wird die Aktivitätsleiste horizontal angezeigt. Wenn DevTools an der Seite des Browsers angedockt ist, ist die Aktivitätsleiste vertikal, und Toolnamen sind nicht sichtbar. Dies ermöglicht einen schnelleren Toolzugriff, wenn die Bildschirmbreite eingeschränkt ist.
Die Aktivitätsleiste oben im Fokusmodus ausgerichtet, wobei DevTools angedockt ist:
Die Aktivitätsleiste oben im Fokusmodus ausgerichtet, wobei DevTools in einem separaten Fenster angezeigt wird:
Warnungs- und Fehlerindikatoren
Auf der Standardmäßigen DevTools-Benutzeroberfläche wird auf der Hauptsymbolleiste ein Zähler angezeigt, der die Anzahl der Meldungen anzeigt, z. B. Empfehlungen für Probleme und Konsolenwarnungen . Der Zähler könnte groß werden, wenn viele Nachrichten ae generiert wurden und wertvollen Platz in DevTools einnehmen.
Im Fokusmodus wurde dieser Zähler entfernt. Stattdessen überlagern kleine Indikatoren Probleme und die Konsole , um anzuzeigen, ob nachrichten von den jeweiligen Tools gemeldet wurden:
Schnellansicht
Die Schnellansichtsliste enthält alle Tools, die zusammen mit dem in der Aktivitätsleiste bereits ausgewählten angezeigt werden können.
Die Schnellansicht ersetzt die Symbolleiste der Schublade über die Standard-Benutzeroberfläche:
DevTools-Anpassungen und -Einstellungen
Mehrere Anpassungsfeatures und die DevTools-Einstellungen sind jetzt unter einem einzigen Menü gruppiert, das über die Schaltfläche "DevTools anpassen" (...) in der Aktivitätsleiste verfügbar ist. Diese Features und Einstellungen werden an mehreren Stellen auf der Standard-Benutzeroberfläche angezeigt.
- Mit der Dockposition können Sie die Platzierung von DevTools im Browserfenster ändern.
- Mit dem Speicherort der Aktivitätsleiste können Sie die Platzierung der Aktivitätsleiste in DevTools ändern.
- Mit Designs können Sie das Farbdesign ändern.
- Einstellungen bietet Zugriff auf die DevTools-Einstellungen.
- Mit Tastenkombinationen können Sie Tastenkombinationen überprüfen und ändern.
Hilfelinks
Das Menü "Hilfe " enthält Links zur DevTools-Dokumentation und Versionshinweisen sowie eine Schaltfläche zum Senden von Feedback an das Team:
Diese Links und Schaltflächen wurden zuvor in der Standardbenutzeroberfläche unter "Anpassen" geschachtelt und steuern DevToolsHelp > .****
Öffnen von Tools über die Aktivitätsleiste
Standardmäßig enthält die Aktivitätsleiste die folgenden Modi und Tools:
Umschaltfläche "Überprüfungsmodus (
".Schaltfläche "Geräteemulationsmodus" (
Geräteemulation").Willkommenstool (
).Elements tool (
).Konsolentool (
Konsolentool).Quellentool (
).Netzwerktool (
Netzwerktool).Problemtool (
).Leistungstool (
).Speichertool (
das Speichertool).Anwendungstool (
).
Anheften und Neuanordnen von Tools in der Aktivitätsleiste
Sie können auswählen, welche Tools in der Aktivitätsleiste angezeigt werden , indem Sie Tools anheften oder lösen. Auf diese Weise können Sie DevTools an Ihren bevorzugten Workflow anpassen.
Klicken Sie auf Weitere Tools (+), um alle verfügbaren Tools auflisten zu können. Wenn Sie ein Tool auswählen, wird es an die Aktivitätsleiste angehefteten. Es wird standardmäßig jedes Mal angezeigt, wenn DevTools geöffnet wird.
Wenn in der Aktivitätsleiste nicht genügend Platz vorhanden ist, um alle angehefteten Tools anzuzeigen, können einige Tools in das Menü "Weitere Tools " überlaufen:
Um ein Tool von der Aktivitätsleiste zu lösen, klicken Sie mit der rechten Maustaste auf das Tool, und wählen Sie "Aus Aktivitätsleiste entfernen" aus:
Derzeit können die folgenden Tools nicht von der Aktivitätsleiste gelöst werden:
- Elementtool
- Konsolentool
- Quellentool
Öffnen von Tools in der Schnellansicht
Verwenden Sie die Schnellansichtsliste , um ein zweites Tool neben dem tool zu öffnen, das bereits in der Aktivitätsleiste ausgewählt wurde.
Wählen Sie in der Aktivitätsleiste ein Tool aus.
Klicken Sie auf die Schnellansichtsliste , und wählen Sie ein anderes Tool aus der Liste aus.
Der folgende Screenshot zeigt das Netzwerktool und das Konsolentool nebeneinander:
Sie können die Schnellansicht ausblenden oder erweitern, indem Sie auf "Schnellansicht / reduzierenExpand"-Schnellansicht klicken oder die ESCAPE-TASTE drücken. (
für Schnellansicht).
Anpassen des Fokusmodus
Die Aktivitätsleiste kann vertikal oder horizontal ausgerichtet werden, um den verwendbaren Bildschirmbereich an einer Vielzahl von DevTools-Fensterpositionen zu maximieren.
Um den Speicherort der Aktivitätsleiste zu ändern, klicken Sie auf "Anpassen" und steuern DevTools, dann auf den Speicherort der Aktivitätsleiste, und wählen Sie dann einen der Speicherorte aus:
An Dockposition anpassen (Standard): Die Aktivitätsleiste befindet sich in horizontaler oder vertikaler Ausrichtung, je nachdem, wo DevTools angedockt ist.
Wenn DevTools links oder rechts im Browserfenster angedockt ist, ist die Aktivitätsleiste vertikal.
Wenn DevTools an der unteren Seite des Browserfensters angedockt oder in einem eigenen Fenster abgedockt ist, wird die Aktivitätsleiste horizontal angezeigt.
Oben: Der Aktivitätsbalken ist immer horizontal.
Linke Seite: Der Aktivitätsbalken ist immer vertikal.
Wenn die Aktivitätsleiste horizontal ist, werden Nebensymbolen Toolnamen angezeigt, wenn genügend Platz zum Anzeigen vorhanden ist.
Wenn DevTools in einem eigenen Fenster abgedockt ist, werden in der horizontalen Aktivitätsleiste einige Registerkarten mit Toolsymbolen und Namen und einige Registerkarten nur mit Symbolen angezeigt:
Weitere Informationen
- DevTools: Die Benutzeroberfläche für den Fokusmodus ist die erste Erläuterung für dieses experimentelle Feature im Microsoft Edge DevTools-Repository.