Câu hỏi: MMA301 - Chương 4: Bố cục Flexbox và Style

Để đặt màu nền cho một thành phần trong ứng dụng React Native, bạn cần sử dụng thuộc tính 'backgroundColor'. Đây là thuộc tính được sử dụng rộng rãi trong thiết kế giao diện người dùng và được hỗ trợ bởi hầu hết các thành phần trong React Native. Ví dụ, bạn có thể sử dụng thuộc tính này để đặt màu nền cho một View, Text hoặc thậm chí là một Image. Để sử dụng thuộc tính 'backgroundColor', bạn cần thêm nó vào đối tượng style của thành phần và gán giá trị màu mong muốn. Ví dụ: const styles =

StyleSheet.create({
  container: {
    backgroundColor: '#f2f2f2',
  }
}

);

Trong React Native, thuộc tính được sử dụng để chỉ định chiều rộng của một thành phần có kích thước cố định là 'width'. Điều này có nghĩa là bạn có thể sử dụng thuộc tính này để đặt kích thước cố định cho một thành phần, chẳng hạn như một hình ảnh hoặc một văn bản. Ví dụ, nếu bạn muốn đặt chiều rộng của một hình ảnh là 300 đơn vị, bạn có thể sử dụng thuộc tính 'width' như sau:

<Image style={
  {
    width: 300
  }
}
source={
  ...
}
/>

. Điều này giúp bạn có thể kiểm soát kích thước của thành phần một cách chính xác và linh hoạt.

Trong React Native, để áp dụng các kiểu dáng cho một thành phần, bạn cần sử dụng thuộc tính 'style'. Thuộc tính này cho phép bạn định nghĩa các thuộc tính CSS như màu sắc, kích thước, font,... cho thành phần của mình. Ví dụ, bạn có thể sử dụng thuộc tính 'style' để đặt màu sắc cho một button như sau:

<Button style={
  {
    backgroundColor: 'red'
  }
}
>Click me!</Button>

. Ngoài ra, bạn cũng có thể sử dụng thuộc tính 'style' để đặt kích thước cho một thành phần, ví dụ:

<View style={
  {
    width: 100, height: 100
  }
}
/>

. Thuộc tính 'style' là một đối tượng, vì vậy bạn có thể thêm nhiều thuộc tính vào nó để tạo ra các kiểu dáng phức tạp hơn.