Proyek
Uji masukan kosong, baris tak seragam dan nama terputus, lalu kembalikan batas eksklusif hanya jika setiap area memenuhi persegi panjangnya.
Ruang kerja kode dengan AI
Area persegi panjang CSS Grid
Validasi area persegi panjang dengan nama ASCII dan titik tunggal untuk sel kosong.
● ● ●Arevia●
Alur kerja · Area persegi panjang CSS Grid ×
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✳Area persegi panjang CSS Grid
✓ PerubahanTinjau sebelum menerapkan ↗
Ilustrasi ruang kerja
Tinjau sebelum menerapkan
Bandingkan perilaku sebenarnya dengan hasil yang diharapkan. Jika pemeriksaan gagal, cari penyebabnya sebelum membuat perubahan lain.
Model
Atur endpoint kompatibel OpenAI atau Anthropic dengan URL dasar dan kunci API jika diperlukan. Uji koneksi. Server model lokal harus berjalan; alat jarak jauh dapat mengirim data secara terpisah.
Alur kerja
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 resultTerapkan aturan tata letak hingga menghasilkan respons antarmuka yang berguna
Arevia adalah ruang kerja pemrograman AI untuk Windows guna mengembangkan kode yang menghubungkan masukan tata letak dengan perilaku yang terlihat. Buka berkas proyek terkait dan jelaskan apa yang boleh ditentukan oleh orang yang menyunting tata letak. Minta model memeriksa validator dan pemanggilnya sebelum mengubah salah satu sisi interaksi tersebut.
Anda memilih model pendamping melalui endpoint kompatibel OpenAI atau Anthropic yang didukung dan menyediakan kredensial bila diperlukan. Model AI tanpa sensor dapat dipilih jika endpoint Anda menyediakannya. Pembatasan, dukungan alat, dan kapasitas konteksnya tetap merupakan karakteristik konfigurasi tersebut, bukan jaminan yang melekat pada tugas tata letak.
Pemeriksaan area grid CSS berbentuk persegi panjang merupakan salah satu contoh permintaan. Sertakan grid valid, area bernama yang terpisah, dan baris dengan lebar tidak seragam dalam percakapan. Tanyakan bagaimana implementasi saat ini menerima atau menolak masing-masing, lalu tinjau usulan perubahan yang mempertahankan tata letak valid sekaligus menjelaskan tata letak tidak valid kepada pengguna.
Tinjau hasil validator dan respons antarmuka secara bersamaan. Penolakan yang benar tetap memerlukan pesan yang berguna, dan tata letak yang diterima harus mencapai jalur perenderan yang dimaksud. Jalankan pengujian proyek, periksa kode sumber yang berubah, dan coba tata letak yang mewakili berbagai kasus di antarmuka Anda sendiri sebelum menyimpulkan bahwa fitur berperilaku sesuai spesifikasi.
Dari masukan tata letak hingga umpan balik
- Apa yang membedakan kesalahan aturan grid dari masalah perenderan?
Periksa terlebih dahulu apakah struktur yang dikirim lolos validasi yang dimaksud. Jika ya, telusuri keluaran yang diterima hingga perenderan. Minta model memeriksa kedua jalur dengan data uji yang sama, alih-alih mengubah CSS sebelum mengidentifikasi tahap yang gagal.
- Haruskah area tidak valid diperbaiki secara otomatis?
Hanya jika itu merupakan persyaratan produk yang eksplisit. Perbaikan dapat mengubah tata letak yang dimaksud seseorang. Tentukan apakah antarmuka harus menolak, menjelaskan, atau mengubah masukan, lalu tinjau kode yang dihasilkan berdasarkan perilaku yang dipilih.
- Contoh grid apa yang perlu disertakan dalam permintaan perubahan?
Sertakan persegi panjang valid, area bernama yang memiliki celah, dan baris dengan lebar berbeda. Nyatakan hasil yang diharapkan untuk masing-masing. Tambahkan data uji terkecil yang mereproduksi masalah Anda agar peninjauan tetap terkait dengan perilaku yang dilaporkan.
- Bagaimana menjaga cakupan tugas pratinjau tata letak tetap tepat?
Sebutkan berkas dan kasus penerimaan sebelum meminta pengerjaan. Tinjau setiap tindakan alat yang diusulkan, karena inferensi model lokal memerlukan server terpisah dan tidak menjadikan semua alat lokal. Verifikasi antarmuka hasilnya di lingkungan yang benar-benar Anda gunakan.
Arevia · Diperbarui 2026-10-25