Projekt
Teste leere Eingaben, ungleich lange Zeilen und getrennte Namensbereiche und liefere exklusive Grenzen nur für vollständig gefüllte Rechtecke.
KI-Arbeitsumgebung für Code
Rechteckige CSS-Rasterbereiche
Prüfe rechteckige Rasterbereiche mit ASCII-Bezeichnern und einzelnen Punkten als leeren Zellen.
● ● ●Arevia●
Arbeitsabläufe · Rechteckige CSS-Rasterbereiche ×
import re
def grid_areas(rows):
if type(rows) is not list or any(type(r) is not str for r in rows):
raise ValueError("grid.rows")
if not rows:
return {}
cells = [r.split() for r in rows]
width = len(cells[0])
if not width or any(len(r) != width for r in cells):
raise ValueError("grid.width")
groups = {}
for y, row in enumerate(cells):
for x, name in enumerate(row):
if name == ".":
continue
if not re.fullmatch(r"[A-Za-z_][A-Za-z0-9_-]*", name):
raise ValueError("grid.name")
groups.setdefault(name, []).append((y, x))
result = {}
for name, points in groups.items():
top, bottom = min(y for y,x in points), max(y for y,x in points)+1
left, right = min(x for y,x in points), max(x for y,x in points)+1
if len(points) != (bottom-top)*(right-left):
raise ValueError("grid.rectangle")
result[name] = (top, bottom, left, right)
return result✳Rechteckige CSS-Rasterbereiche
✓ ÄnderungenVor dem Anwenden prüfen ↗
Illustration der Arbeitsumgebung
Vor dem Anwenden prüfen
Vergleichen Sie das tatsächliche Verhalten mit dem erwarteten Ergebnis. Klären Sie fehlgeschlagene Prüfungen vor weiteren Änderungen.
Modelle
Richten Sie einen OpenAI-kompatiblen oder Anthropic-Endpunkt mit Basis-URL und gegebenenfalls API-Schlüssel ein. Testen Sie die Verbindung. Ein lokaler Modellserver muss laufen; entfernte Werkzeuge können Daten separat übertragen.
Arbeitsabläufe
import re
def grid_areas(rows):
if type(rows) is not list or any(type(r) is not str for r in rows):
raise ValueError("grid.rows")
if not rows:
return {}
cells = [r.split() for r in rows]
width = len(cells[0])
if not width or any(len(r) != width for r in cells):
raise ValueError("grid.width")
groups = {}
for y, row in enumerate(cells):
for x, name in enumerate(row):
if name == ".":
continue
if not re.fullmatch(r"[A-Za-z_][A-Za-z0-9_-]*", name):
raise ValueError("grid.name")
groups.setdefault(name, []).append((y, x))
result = {}
for name, points in groups.items():
top, bottom = min(y for y,x in points), max(y for y,x in points)+1
left, right = min(x for y,x in points), max(x for y,x in points)+1
if len(points) != (bottom-top)*(right-left):
raise ValueError("grid.rectangle")
result[name] = (top, bottom, left, right)
return resultVon der Layoutregel zu einer hilfreichen Rückmeldung in der Oberfläche
Arevia ist eine KI-Programmierumgebung für Windows zur Entwicklung von Code, der Layouteingaben mit sichtbarem Verhalten verbindet. Öffnen Sie die relevanten Projektdateien und beschreiben Sie, was die Person beim Bearbeiten des Layouts ausdrücken können soll. Bitten Sie das Modell, den Validator und dessen aufrufenden Code zu untersuchen, bevor es eine Seite dieses Zusammenspiels ändert.
Sie wählen das unterstützende Modell über einen unterstützten OpenAI-kompatiblen oder Anthropic-Endpunkt und geben bei Bedarf Zugangsdaten an. Ein unzensiertes KI-Modell lässt sich auswählen, wenn Ihr Endpunkt eines anbietet. Seine Einschränkungen, Werkzeugunterstützung und Kontextkapazität bleiben Eigenschaften dieser Konfiguration und sind keine mit der Layoutaufgabe verbundenen Garantien.
Die Prüfung rechteckiger CSS-Grid-Bereiche ist ein mögliches Beispiel. Bringen Sie ein gültiges Raster, einen nicht zusammenhängenden benannten Bereich und eine ungleichmäßige Zeile in das Gespräch ein. Fragen Sie, wie die aktuelle Implementierung die einzelnen Fälle annimmt oder ablehnt. Prüfen Sie anschließend eine vorgeschlagene Änderung, die gültige Layouts erhält und Nutzern erklärt, warum ein Layout ungültig ist.
Prüfen Sie das Validatorergebnis und die Rückmeldung der Oberfläche gemeinsam. Auch eine korrekte Ablehnung benötigt eine hilfreiche Meldung; ein angenommenes Layout sollte den vorgesehenen Renderingpfad erreichen. Führen Sie Projekttests aus, untersuchen Sie den geänderten Quellcode und probieren Sie repräsentative Layouts in Ihrer eigenen Oberfläche aus, bevor Sie entscheiden, dass die Funktion der Spezifikation entspricht.
Von der Layouteingabe zur Rückmeldung
- Was unterscheidet einen Fehler in einer Rasterregel von einem Renderingproblem?
Prüfen Sie zuerst, ob die übermittelte Struktur die vorgesehene Validierung besteht. Falls ja, verfolgen Sie die angenommene Ausgabe bis zum Rendering. Bitten Sie das Modell, beide Pfade mit denselben Testdaten zu untersuchen, statt CSS zu ändern, bevor die fehlerhafte Stufe feststeht.
- Sollte ein ungültiger Bereich automatisch repariert werden?
Nur wenn dies eine ausdrückliche Produktanforderung ist. Eine Reparatur kann das beabsichtigte Layout verändern. Legen Sie fest, ob die Oberfläche die Eingabe ablehnen, erklären oder umformen soll, und prüfen Sie den entstehenden Code anhand dieses gewählten Verhaltens.
- Welche Rasterbeispiele sollten einer Änderungsanfrage beiliegen?
Nehmen Sie ein gültiges Rechteck, einen benannten Bereich mit einer Lücke und unterschiedlich breite Zeilen auf. Geben Sie jeweils das erwartete Ergebnis an. Ergänzen Sie die kleinsten Testdaten, die Ihr eigenes Problem reproduzieren, damit die Prüfung am gemeldeten Verhalten bleibt.
- Wie begrenze ich den Umfang einer Aufgabe zur Layoutvorschau sinnvoll?
Benennen Sie Dateien und Abnahmefälle vor dem Arbeitsauftrag. Prüfen Sie vorgeschlagene Werkzeugaktionen: Lokale Modellinferenz erfordert einen separaten Server und macht nicht alle Werkzeuge lokal. Überprüfen Sie die resultierende Oberfläche in Ihrer tatsächlichen Nutzungsumgebung.
Arevia · Aktualisiert 2026-10-25