UI gaya dengan USS

Setiap VisualElement termasuk sifat gaya yang mengatur dimensi elemen dan bagaimana elemen ditarik pada layar, seperti backgroundColor atau borderColor.

Sifat gaya baik diatur dalam C# atau dari lembar gaya. Sifat gaya memiliki struktur data mereka sendiri ( antarmukaIStyle).

UI Toolkit mendukung style sheet yang ditulis dalam USS (Unity style sheet). File ASS adalah file teks yang terinspirasi oleh Cascading Style Sheets (CSS) dari HTML. Format USS mirip dengan CSS, tetapi AS termasuk overrides dan kustomisasi untuk bekerja lebih baik dengan Unity.

Bagian ini mencakup rincian di USS, sintaksnya, dan perbedaannya bila dibandingkan dengan CSS.

Untuk referensi cepat dari properti ASS yang didukung, lihat Referensi properti ASS.

Definisi lembar gaya Unity

Blok bangunan mendasar dari lembar gaya Unity (USS) adalah sebagai berikut:

• USS adalah file teks yang diakui sebagai aset. File teks harus memiliki ekstensi .uss.
• USS hanya mendukung aturan gaya.
• Aturan gaya terdiri dari pemilih dan blok deklarasi.
• selector mengidentifikasi elemen visual yang mempengaruhi aturan gaya.
• Blok deklarasi, ditutupi oleh kawat gigi keriting, mengandung satu atau lebih deklarasi gaya. Setiap deklarasi gaya terdiri dari properti dan nilai. Setiap deklarasi gaya berakhir dengan semi-kolon.
• Nilai untuk setiap properti gaya adalah literal yang, ketika parsed, harus mencocokkan nama properti target.

Sintaks umum dari aturan gaya adalah:

selector {
  property1:value;
  property2:value;
}

Pasang USS ke elemen visual

Anda dapat melampirkan lembar gaya Unity (USS) ke elemen visual. Aturan gaya berlaku untuk elemen visual dan semua keturunannya. Lembar gaya juga digunakan kembali secara otomatis bila diperlukan.

Beban objek StyleSheet dengan API Unity standar seperti AssetDatabase.Load() atau Resources.Load(). Gunakan metode VisualElement.styleSheets.Add() untuk melampirkan lembaran gaya ke elemen visual.

Jika Anda memodifikasi file AS sementara EditorWindow berjalan, perubahan gaya diterapkan segera.

Proses aplikasi gaya transparan ke pengembang menggunakan UI Toolkit. Lembar gaya diarahkan kembali secara otomatis bila diperlukan (perubahan bunga, reload stylesheet).

Gaya cocok dengan aturan

Ketika Anda mendefinisikan lembar gaya, Anda dapat menerapkannya ke Pohon Visual. Selectors cocok dengan elemen untuk menyelesaikan properti mana yang berlaku dari file ASS. Jika seorang pemilih cocok dengan elemen, deklarasi gaya berlaku untuk elemen.

Misalnya, aturan berikut cocok dengan objek Button:

Button {
  width: 200px;
}

Login Elemen pencocokan

UI Toolkit menggunakan kriteria berikut untuk mencocokkan elemen visual dengan aturan gayanya:

• Nama kelas C# (selalu kelas yang paling berasal).
• Properti name yang string.
• Daftar kelas diwakili sebagai set string.
• Kementrian dan posisi VisualElement di pohon visual.

Sifat-sifat ini dapat digunakan dalam seleksel dalam lembaran gaya.

Jika Anda akrab dengan CSS Anda dapat melihat kesamaan dengan nama tag HTML, atribut id dan atribut class.