Tạo style View components React Native

Tạo style View components React Native

Bây giờ rằng bạn đã có cái nhìn khái quát đúng đắn về styling trong React Native, hãy nói về các styles riêng rẽ.
Học phần này bao quát nhiều đặc tính cơ bản bạn sẽ sử dụng mọi lần. Trong học phần tiếp theo, chúng ta sẽ đi
sâu hơn và giới thiệu các styles bạn sẽ không thấy mọi ngày và các styles cái tùy theo nền tảng. Nhưng cho bây
giờ, hãy tập trung vào các cơ bản: trong phần này, đó là View components. View component là khối xây đựng chính
của UI và là một trong những components quan trọng nhất để hiểu để có styling của bạn đúng. Nhớ là, một phần tử
view là tương tự một HTML div tag theo nghĩa rằng bạn có thể sử dụng nó để bao gói các phần tử khác và xây dựng
các khối UI code trong nó.
Khi bạn tiến qua học phần này, bạn sẽ sử dụng cái bạn đã học để xây dựng một component thực: một Profile Card.
Xây dựng Profile Card sẽ thể hiện làm cách nào đặt mọi thứ cùng với nhau. Ảnh dưới thể hiện component sẽ trông là
gì tại cuối phần này. Trong quá trình tạo component này, bạn sẽ học làm cách nào làm những cái sau:
+ Tạo một border quanh cái chứa profile sử dụng borderWith
+ Làm tròn các góc của border đó với borderRadius
+ Tạo một border cái trông như một circle bằng cách sử dụng một borderRadius nửa kích thước của component’s width
+ Định vị mọi thứ sử dụng các đặc tính margin và padding

Chia sẻ