04. REACT NATIVE - STYLING

Terdapat dua cara penulisan style di React Native :
a. Cara yang pertama property style dituliskan langsung pada
komponen (ini bukan yang terbaik karena sulit untuk
membaca kode jika melakukan perubahan desain).
b. Cara yang kedua dituliskan dengan menggunakan Stylesheet.

Nama dan nilai value pada styling di React Native hampir sama
seperti bagaimana CSS bekerja di web. Perbedaannya adalah cara
penulisan namanya, pada React Native dituliskan dengan
menggunakan camel case.
Berikut adalah contoh sintaks untuk styling komponen dengan cara
Property Style atau Stylesheet:

1. Property Styling

Pada sintaks styling property ini dicontohkan membuat sebuah
lingkaran dengan komponen View, kemudian didalam komponen
tersebut langsung dituliskan style-nya. Berikut hasilnya :

2. Stylesheet Styling

Berikut hasilnya :

Contoh lainnya :

Pada sintaks stylesheet ini dicontohkan mengubah ukuran font Text,
dimana stylingnya berada dalam sebuah function styles, kemudian
styles ini digunakan pada komponen. Berikut hasilnya :

Hands-on debugging session: instrument, monitor, and fix

Join Lazar for a hands-on session where you’ll build it, break it, debug it, and fix it. You’ll set up Sentry, track errors, use Session Replay and Tracing, and leverage some good ol’ AI to find and fix issues fast.

RSVP here →