React Native - Thanh trạng thái

Trong chương này, chúng tôi sẽ hướng dẫn bạn cách kiểm soát sự xuất hiện của thanh trạng thái trong React Native.

Thanh Trạng thái rất dễ sử dụng và tất cả những gì bạn cần làm là thiết lập các thuộc tính để thay đổi nó.

Các hiddenthuộc tính có thể được sử dụng để ẩn thanh trạng thái. Trong ví dụ của chúng tôi, nó được đặt thànhfalse. Đây là giá trị mặc định.

Các barStyle có thể có ba giá trị - dark-content, light-contentdefault.

Thành phần này có một số thuộc tính khác có thể được sử dụng. Một số trong số đó là dành riêng cho Android hoặc IOS. Bạn có thể kiểm tra nó trong tài liệu chính thức.

App.js

import React, { Component } from 'react';
import { StatusBar } from 'react-native'

const App = () => {
   return (
      <StatusBar barStyle = "dark-content" hidden = {false} backgroundColor = "#00BCD4" translucent = {true}/>
   )
}
export default App

Nếu chúng tôi chạy ứng dụng, thanh trạng thái sẽ hiển thị và nội dung sẽ có màu tối.

Đầu ra