react-native-unistyles 2.8.0-beta.4 → 2.8.0-rc.1

package/android/src/main/java/com/unistyles/UnistylesModule.kt

@@ -4,8 +4,6 @@ import android.content.BroadcastReceiver
 import android.content.Context
 import android.content.Intent
 import android.content.IntentFilter
-import android.content.res.Configuration
-import android.graphics.Color
 import android.os.Handler
 import android.os.Looper
 import android.util.Log
@@ -20,7 +18,7 @@ import com.facebook.react.turbomodule.core.interfaces.CallInvokerHolder
 
 class UnistylesModule(reactContext: ReactApplicationContext) : ReactContextBaseJavaModule(reactContext), LifecycleEventListener {
     private var isCxxReady: Boolean = false
-    private lateinit var platform: Platform
+    private var platform: Platform = Platform(reactContext)
 
     private val configurationChangeReceiver = object : BroadcastReceiver() {
         override fun onReceive(context: Context, intent: Intent) {
@@ -36,11 +34,9 @@ class UnistylesModule(reactContext: ReactApplicationContext) : ReactContextBaseJ
 
             val newConfig = context.resources.configuration
 
-            if (newConfig.orientation == Configuration.ORIENTATION_PORTRAIT) {
-                this@UnistylesModule.onLayoutConfigChange()
-            }
+            if (newConfig.orientation != platform.orientation) {
+                platform.orientation = newConfig.orientation
 
-            if (newConfig.orientation == Configuration.ORIENTATION_LANDSCAPE) {
                 this@UnistylesModule.onLayoutConfigChange()
             }
         }
@@ -51,7 +47,6 @@ class UnistylesModule(reactContext: ReactApplicationContext) : ReactContextBaseJ
         const val NAME = "Unistyles"
     }
 
-    //region Lifecycle
     init {
         reactApplicationContext.registerReceiver(configurationChangeReceiver, IntentFilter(Intent.ACTION_CONFIGURATION_CHANGED))
         reactApplicationContext.addLifecycleEventListener(this)
@@ -66,8 +61,6 @@ class UnistylesModule(reactContext: ReactApplicationContext) : ReactContextBaseJ
         }
     }
 
-    //endregion
-    //region Event handlers
     private fun onConfigChange() {
         val colorScheme = this.platform.getColorScheme()
         val contentSizeCategory = this.platform.getContentSizeCategory()
@@ -79,10 +72,10 @@ class UnistylesModule(reactContext: ReactApplicationContext) : ReactContextBaseJ
     }
 
     private fun onLayoutConfigChange() {
-        val screen = this.getScreenDimensions()
-        val insets = this.getInsets()
-        val statusBar = this.getStatusBarDimensions()
-        val navigationBar = this.getNavigationBarDimensions()
+        val screen = this.platform.getScreenDimensions()
+        val insets = this.platform.getInsets()
+        val statusBar = this.platform.getStatusBarDimensions()
+        val navigationBar = this.platform.getNavigationBarDimensions()
 
         reactApplicationContext.runOnJSQueueThread {
             this.nativeOnOrientationChange(
@@ -94,16 +87,11 @@ class UnistylesModule(reactContext: ReactApplicationContext) : ReactContextBaseJ
         }
     }
 
-    //endregion
-    //region Core
     @ReactMethod(isBlockingSynchronousMethod = true)
     fun install(): Boolean {
         return try {
             System.loadLibrary("unistyles")
 
-            this.platform = Platform(reactApplicationContext)
-            this.enableEdgeToEdge()
-
             this.reactApplicationContext.javaScriptContextHolder?.let { contextHolder ->
                 this.reactApplicationContext.catalystInstance.jsCallInvokerHolder?.let { callInvokerHolder: CallInvokerHolder ->
                     this.nativeInstall(contextHolder.get(), callInvokerHolder)
@@ -125,68 +113,10 @@ class UnistylesModule(reactContext: ReactApplicationContext) : ReactContextBaseJ
 
     private external fun nativeInstall(jsi: Long, callInvoker: CallInvokerHolder)
     private external fun nativeDestroy()
-    private external fun nativeOnOrientationChange(screen: Dimensions, insets: Insets, statusBar: Dimensions, navigationBar: Dimensions)
+    private external fun nativeOnOrientationChange(screen: Screen, insets: Insets, statusBar: Dimensions, navigationBar: Dimensions)
     private external fun nativeOnAppearanceChange(colorScheme: String)
     private external fun nativeOnContentSizeCategoryChange(contentSizeCategory: String)
 
-    //endregion
-
-    private fun getScreenDimensions(): Dimensions {
-        return platform.getScreenDimensions()
-    }
-
-    private fun getColorScheme(): String {
-        return platform.getColorScheme()
-    }
-
-    private fun getStatusBarDimensions(): Dimensions {
-        return platform.getStatusBarDimensions()
-    }
-
-    private fun getNavigationBarDimensions(): Dimensions {
-        return platform.getNavigationBarDimensions()
-    }
-
-    private fun getContentSizeCategory(): String {
-        return platform.getContentSizeCategory()
-    }
-
-    private fun getInsets(): Insets {
-        return platform.getInsets()
-    }
-
-    private fun onSetNavigationBarColor(color: String) {
-        val activity = currentActivity ?: return
-
-        if (platform.defaultNavigationBarColor == null) {
-            platform.defaultNavigationBarColor = activity.window.navigationBarColor
-        }
-
-        try {
-            activity.runOnUiThread {
-                activity.window.navigationBarColor = if (color == "") platform.defaultNavigationBarColor!! else Color.parseColor(color)
-            }
-        } catch (_: Exception) {
-            Log.d("Unistyles", "Failed to set navigation bar color: $color")
-        }
-    }
-
-    private fun onSetStatusBarColor(color: String) {
-        val activity = currentActivity ?: return
-
-        if (platform.defaultStatusBarColor == null) {
-            platform.defaultStatusBarColor = activity.window.statusBarColor
-        }
-
-        try {
-            activity.runOnUiThread {
-                activity.window.statusBarColor = if (color == "") platform.defaultStatusBarColor!! else Color.parseColor(color)
-            }
-        } catch (_: Exception) {
-            Log.d("Unistyles", "Failed to set status bar color: $color")
-        }
-    }
-
     private fun enableEdgeToEdge() {
         this.reactApplicationContext.currentActivity?.let { activity ->
             activity.runOnUiThread {
@@ -200,23 +130,24 @@ class UnistylesModule(reactContext: ReactApplicationContext) : ReactContextBaseJ
 
     @ReactMethod
     fun removeListeners(count: Double) = Unit
+
     override fun onHostResume() {
+        this.enableEdgeToEdge()
+
         if (isCxxReady) {
             this.onConfigChange()
         }
 
         this.reactApplicationContext.currentActivity?.let { activity ->
             activity.findViewById<View>(android.R.id.content)?.let { mainView ->
-                activity.window?.decorView?.let { decorView ->
-                    ViewCompat.setOnApplyWindowInsetsListener(mainView) { _, insets ->
-                        this.platform.setInsetsCompat(insets, decorView)
+                ViewCompat.setOnApplyWindowInsetsListener(mainView) { _, insets ->
+                    this.platform.setInsetsCompat(insets, activity.window)
 
-                        if (this.isCxxReady) {
-                            this.onLayoutConfigChange()
-                        }
-
-                        insets
+                    if (this.isCxxReady) {
+                        this.onLayoutConfigChange()
                     }
+
+                    insets
                 }
             }
         }
@@ -231,5 +162,4 @@ class UnistylesModule(reactContext: ReactApplicationContext) : ReactContextBaseJ
     }
 
     override fun onHostDestroy() {}
-    //endregion
 }

package/cxx/UnistylesImpl.cpp

@@ -177,9 +177,19 @@ jsi::Value UnistylesRuntime::getStatusBar(jsi::Runtime& rt, std::string fnName)
     auto statusBar = jsi::Object(rt);
     auto setStatusBarColorFunction = HOST_FN("setColor", 1, {
         std::string color = arguments[0].asString(rt).utf8(rt);
+        float alpha = arguments[1].asNumber();
 
         if (this->setStatusBarColor.has_value()) {
-            this->setStatusBarColor.value()(color);
+            this->setStatusBarColor.value()(color, alpha);
+        }
+
+        return jsi::Value::undefined();
+    });
+    auto setStatusBarHiddenFunction = HOST_FN("setHidden", 1, {
+        bool hidden = arguments[0].asBool();
+
+        if (this->setStatusBarHidden.has_value()) {
+            this->setStatusBarHidden.value()(hidden);
         }
 
         return jsi::Value::undefined();
@@ -188,6 +198,7 @@ jsi::Value UnistylesRuntime::getStatusBar(jsi::Runtime& rt, std::string fnName)
     statusBar.setProperty(rt, "width", this->statusBar.width);
     statusBar.setProperty(rt, "height", this->statusBar.height);
     statusBar.setProperty(rt, "setColor", setStatusBarColorFunction);
+    statusBar.setProperty(rt, "setHidden", setStatusBarHiddenFunction);
 
     return statusBar;
 }
@@ -196,9 +207,19 @@ jsi::Value UnistylesRuntime::getNavigationBar(jsi::Runtime& rt, std::string fnNa
     auto navigationBarValue = jsi::Object(rt);
     auto setNavigationBarColorFunction = HOST_FN("setColor", 1, {
         std::string color = arguments[0].asString(rt).utf8(rt);
+        float alpha = arguments[1].asNumber();
 
         if (this->setNavigationBarColor.has_value()) {
-            this->setNavigationBarColor.value()(color);
+            this->setNavigationBarColor.value()(color, alpha);
+        }
+
+        return jsi::Value::undefined();
+    });
+    auto setHiddenFunction = HOST_FN("setHidden", 1, {
+        bool hidden = arguments[0].asBool();
+
+        if (this->setNavigationBarHidden.has_value()) {
+            this->setNavigationBarHidden.value()(hidden);
         }
 
         return jsi::Value::undefined();
@@ -207,10 +228,19 @@ jsi::Value UnistylesRuntime::getNavigationBar(jsi::Runtime& rt, std::string fnNa
     navigationBarValue.setProperty(rt, "width", this->navigationBar.width);
     navigationBarValue.setProperty(rt, "height", this->navigationBar.height);
     navigationBarValue.setProperty(rt, "setColor", setNavigationBarColorFunction);
+    navigationBarValue.setProperty(rt, "setHidden", setHiddenFunction);
 
     return navigationBarValue;
 }
 
+jsi::Value UnistylesRuntime::getPixelRatio(jsi::Runtime& rt, std::string fnName) {
+    return jsi::Value(roundf(this->pixelRatio * 100)/ 100);
+}
+
+jsi::Value UnistylesRuntime::getFontScale(jsi::Runtime& rt, std::string fnName) {
+    return jsi::Value(roundf(this->fontScale * 100) / 100);
+}
+
 std::optional<jsi::Value> UnistylesRuntime::setThemes(jsi::Runtime& rt, const jsi::Value& value) {
     jsi::Array themes = value.asObject(rt).asArray(rt);
     std::vector<std::string> themesVector;
@@ -239,3 +269,28 @@ std::optional<jsi::Value> UnistylesRuntime::setThemes(jsi::Runtime& rt, const js
 
     return std::nullopt;
 }
+
+jsi::Value UnistylesRuntime::setImmersiveModeEnabled(jsi::Runtime& rt, std::string fnName) {
+    return HOST_FN(fnName, 1, {
+        bool enabled = arguments[0].asBool();
+
+        if (this->setImmersiveMode.has_value()) {
+            this->setImmersiveMode.value()(enabled);
+        }
+
+        return jsi::Value::undefined();
+    });
+}
+
+jsi::Value UnistylesRuntime::setRootBackgroundColor(jsi::Runtime& rt, std::string fnName) {
+    return HOST_FN(fnName, 1, {
+        std::string color = arguments[0].asString(rt).utf8(rt);
+        float alpha = arguments[1].asNumber();
+
+        if (this->setRootViewBackgroundColor.has_value()) {
+            this->setRootViewBackgroundColor.value()(color, alpha);
+        }
+
+        return jsi::Value::undefined();
+    });
+}

package/cxx/UnistylesModel.cpp

@@ -13,19 +13,23 @@ std::string UnistylesModel::getBreakpointFromScreenWidth(int width, const std::v
     return sortedBreakpointPairs.empty() ? "" : sortedBreakpointPairs.back().first;
 }
 
-void UnistylesModel::handleScreenSizeChange(Dimensions& screen, std::optional<Insets> insets, std::optional<Dimensions> statusBar, std::optional<Dimensions> navigationBar) {
+void UnistylesModel::handleScreenSizeChange(Screen& screen, std::optional<Insets> insets, std::optional<Dimensions> statusBar, std::optional<Dimensions> navigationBar) {
     std::string breakpoint = this->getBreakpointFromScreenWidth(screen.width, this->sortedBreakpointPairs);
     bool hasDifferentBreakpoint = this->breakpoint != breakpoint;
     bool hasDifferentScreenDimensions = this->screen.width != screen.width || this->screen.height != screen.height;
+    bool hasDifferentPixelRatio = this->pixelRatio != screen.pixelRatio;
+    bool hasDifferentFontScale = this->fontScale != screen.fontScale;
     bool hasDifferentInsets = insets.has_value()
         ? this->insets.top != insets->top || this->insets.bottom != insets->bottom || this->insets.left != insets->left || this->insets.right != insets->right
         : false;
 
     // we don't need to check statusBar/navigationBar as they will only change on orientation change witch is equal to hasDifferentScreenDimensions
-    bool shouldNotify = hasDifferentBreakpoint || hasDifferentScreenDimensions || hasDifferentInsets;
+    bool shouldNotify = hasDifferentBreakpoint || hasDifferentScreenDimensions || hasDifferentInsets || hasDifferentPixelRatio || hasDifferentFontScale;
 
     this->breakpoint = breakpoint;
     this->screen = {screen.width, screen.height};
+    this->pixelRatio = screen.pixelRatio;
+    this->fontScale = screen.fontScale;
 
     if (insets.has_value()) {
         this->insets = {insets->top, insets->bottom, insets->left, insets->right};

package/cxx/UnistylesModel.h

@@ -6,6 +6,7 @@
 #include <map>
 #include <optional>
 #include <variant>
+#include <math.h>
 
 using namespace facebook;
 
@@ -26,6 +27,13 @@ struct Dimensions {
     int height;
 };
 
+struct Screen {
+    int width;
+    int height;
+    float pixelRatio;
+    float fontScale;
+};
+
 struct Insets {
     int top;
     int bottom;
@@ -46,16 +54,20 @@ struct UnistylesModel {
     jsi::Object parseEventPayload(EventPayload payload);
     jsi::Object parseEventNestedPayload(EventNestedValue payload);
 
-    std::function<Dimensions()> getScreenDimensions;
+    std::function<Screen()> getScreenDimensions;
     std::function<std::string()> getContentSizeCategory;
     std::function<std::string()> getColorScheme;
     std::function<Dimensions()> getStatusBarDimensions;
     std::function<Dimensions()> getNavigationBarDimensions;
     std::function<Insets()> getInsets;
-    std::optional<std::function<void(std::string)>> setStatusBarColor;
-    std::optional<std::function<void(std::string)>> setNavigationBarColor;
-
-    void setScreenDimensionsCallback(std::function<Dimensions()> callback) {
+    std::optional<std::function<void(std::string, float alpha)>> setStatusBarColor;
+    std::optional<std::function<void(std::string, float alpha)>> setNavigationBarColor;
+    std::optional<std::function<void(bool)>> setNavigationBarHidden;
+    std::optional<std::function<void(bool)>> setStatusBarHidden;
+    std::optional<std::function<void(bool)>> setImmersiveMode;
+    std::optional<std::function<void(std::string, float alpha)>> setRootViewBackgroundColor;
+
+    void setScreenDimensionsCallback(std::function<Screen()> callback) {
         this->getScreenDimensions = callback;
     }
     void setContentSizeCategoryCallback(std::function<std::string()> callback) {
@@ -73,17 +85,31 @@ struct UnistylesModel {
     void setInsetsCallback(std::function<Insets()> callback) {
         this->getInsets = callback;
     }
-    void setStatusBarColorCallback(std::function<void(std::string color)> callback) {
+    void setStatusBarColorCallback(std::function<void(std::string color, float alpha)> callback) {
         this->setStatusBarColor = callback;
     }
-    void setNavigationBarColorCallback(std::function<void(std::string color)> callback) {
+    void setNavigationBarColorCallback(std::function<void(std::string color, float alpha)> callback) {
         this->setNavigationBarColor = callback;
     }
+    void setNavigationBarHiddenCallback(std::function<void(bool hidden)> callback) {
+        this->setNavigationBarHidden = callback;
+    }
+    void setStatusBarHiddenCallback(std::function<void(bool hidden)> callback) {
+        this->setStatusBarHidden = callback;
+    }
+    void setImmersiveModeCallback(std::function<void(bool enabled)> callback) {
+        this->setImmersiveMode = callback;
+    }
+    void setRootViewBackgroundColorCallback(std::function<void(std::string color, float alpha)> callback) {
+        this->setRootViewBackgroundColor = callback;
+    }
 
     Dimensions screen = {0, 0};
     Dimensions statusBar = {0, 0};
     Dimensions navigationBar = {0, 0};
     Insets insets = {0, 0, 0, 0};
+    float pixelRatio = 1.0;
+    float fontScale = 1.0;
     std::string colorScheme = UnistylesUnspecifiedScheme;
     std::string contentSizeCategory = UnistylesUnspecifiedScheme;
 
@@ -98,7 +124,7 @@ struct UnistylesModel {
     std::vector<std::string> themes;
     std::vector<std::pair<std::string, double>> sortedBreakpointPairs;
 
-    void handleScreenSizeChange(Dimensions& screen, std::optional<Insets> insets, std::optional<Dimensions> statusBar, std::optional<Dimensions> navigationBar);
+    void handleScreenSizeChange(Screen& screen, std::optional<Insets> insets, std::optional<Dimensions> statusBar, std::optional<Dimensions> navigationBar);
     void handleAppearanceChange(std::string colorScheme);
     void handleContentSizeCategoryChange(std::string contentSizeCategory);
 

package/cxx/UnistylesRuntime.h

@@ -30,7 +30,11 @@ struct JSI_EXPORT UnistylesRuntime : public jsi::HostObject, UnistylesModel {
             {"enabledPlugins", BIND_FN(getEnabledPlugins)},
             {"insets", BIND_FN(getInsets)},
             {"statusBar", BIND_FN(getStatusBar)},
-            {"navigationBar", BIND_FN(getNavigationBar)}
+            {"navigationBar", BIND_FN(getNavigationBar)},
+            {"pixelRatio", BIND_FN(getPixelRatio)},
+            {"fontScale", BIND_FN(getFontScale)},
+            {"setRootViewBackgroundColor", BIND_FN(setRootBackgroundColor)},
+            {"setImmersiveMode", BIND_FN(setImmersiveModeEnabled)}
         };
 
         this->setters = {
@@ -56,6 +60,10 @@ struct JSI_EXPORT UnistylesRuntime : public jsi::HostObject, UnistylesModel {
     jsi::Value getInsets(jsi::Runtime&, std::string);
     jsi::Value getStatusBar(jsi::Runtime&, std::string);
     jsi::Value getNavigationBar(jsi::Runtime&, std::string);
+    jsi::Value getPixelRatio(jsi::Runtime&, std::string);
+    jsi::Value getFontScale(jsi::Runtime&, std::string);
+    jsi::Value setRootBackgroundColor(jsi::Runtime&, std::string);
+    jsi::Value setImmersiveModeEnabled(jsi::Runtime&, std::string);
 
     std::optional<jsi::Value> setThemes(jsi::Runtime&, const jsi::Value&);
 

package/ios/platform/Platform_Shared.h

@@ -2,4 +2,6 @@
 #include <string>
 
 std::string getContentSizeCategory();
+float getFontScale();
 std::string getColorScheme();
+UIColor* colorFromHexString(NSString* hexString, float alpha);

package/ios/platform/Platform_Shared.mm

@@ -2,7 +2,7 @@
 
 std::string getContentSizeCategory() {
     UIContentSizeCategory contentSizeCategory = [[UIApplication sharedApplication] preferredContentSizeCategory];
-    
+
     if ([contentSizeCategory isEqualToString:UIContentSizeCategoryExtraExtraExtraLarge]) {
         return std::string([@"xxxLarge" UTF8String]);
     }
@@ -54,6 +54,63 @@ std::string getContentSizeCategory() {
     return std::string([@"unspecified" UTF8String]);
 }
 
+// based on Apple Human Interface Guidelines
+// https://developer.apple.com/design/human-interface-guidelines/typography#Specifications
+float getFontScale() {
+    UIContentSizeCategory contentSizeCategory = [[UIApplication sharedApplication] preferredContentSizeCategory];
+    float defaultMultiplier = 17.0;
+
+    if ([contentSizeCategory isEqualToString:UIContentSizeCategoryExtraExtraExtraLarge]) {
+        return 23.0 / defaultMultiplier;
+    }
+
+    if ([contentSizeCategory isEqualToString:UIContentSizeCategoryExtraExtraLarge]) {
+        return 21.0 / defaultMultiplier;
+    }
+
+    if ([contentSizeCategory isEqualToString:UIContentSizeCategoryExtraLarge]) {
+        return 19.0 / defaultMultiplier;
+    }
+
+    if ([contentSizeCategory isEqualToString:UIContentSizeCategoryLarge]) {
+        return 17.0 / defaultMultiplier;
+    }
+
+    if ([contentSizeCategory isEqualToString:UIContentSizeCategoryMedium]) {
+        return 16.0 / defaultMultiplier;
+    }
+
+    if ([contentSizeCategory isEqualToString:UIContentSizeCategorySmall]) {
+        return 15.0 / defaultMultiplier;
+    }
+
+    if ([contentSizeCategory isEqualToString:UIContentSizeCategoryExtraSmall]) {
+        return 14.0 / defaultMultiplier;
+    }
+
+    if ([contentSizeCategory isEqualToString:UIContentSizeCategoryAccessibilityMedium]) {
+        return 29.0 / defaultMultiplier;
+    }
+
+    if ([contentSizeCategory isEqualToString:UIContentSizeCategoryAccessibilityLarge]) {
+        return 33.0 / defaultMultiplier;
+    }
+
+    if ([contentSizeCategory isEqualToString:UIContentSizeCategoryAccessibilityExtraLarge]) {
+        return 40.0 / defaultMultiplier;
+    }
+
+    if ([contentSizeCategory isEqualToString:UIContentSizeCategoryAccessibilityExtraExtraLarge]) {
+        return 47.0 / defaultMultiplier;
+    }
+
+    if ([contentSizeCategory isEqualToString:UIContentSizeCategoryAccessibilityExtraExtraExtraLarge]) {
+        return 53.0 / defaultMultiplier;
+    }
+
+    return 1.0;
+}
+
 std::string getColorScheme() {
     UIUserInterfaceStyle colorScheme = [UIScreen mainScreen].traitCollection.userInterfaceStyle;
 
@@ -67,3 +124,29 @@ std::string getColorScheme() {
             return UnistylesUnspecifiedScheme;
     }
 }
+
+UIColor* colorFromHexString(NSString* hexString, float alpha) {
+    unsigned rgbValue = 0;
+    unsigned alphaValue = 0xFF;
+
+    NSScanner *scanner = [NSScanner scannerWithString:hexString];
+
+    if (![hexString hasPrefix:@"#"]) {
+        return nil;
+    }
+
+    [scanner setScanLocation:1];
+
+    if ((hexString.length == 9 && ![scanner scanHexInt:&alphaValue]) || ![scanner scanHexInt:&rgbValue]) {
+        return nil;
+    }
+
+    if (hexString.length == 9) {
+        alpha = alphaValue / 255.0;
+    }
+
+    return [UIColor colorWithRed:((rgbValue & 0xFF0000) >> 16) / 255.0
+                    green:((rgbValue & 0x00FF00) >> 8) / 255.0
+                    blue:(rgbValue & 0x0000FF) / 255.0
+                    alpha:alpha];
+}

package/ios/platform/Platform_iOS.h

@@ -14,5 +14,7 @@
 - (void)onWindowChange:(NSNotification *)notification;
 - (void)onAppearanceChange:(NSNotification *)notification;
 - (void)onContentSizeCategoryChange:(NSNotification *)notification;
+- (void)setStatusBarHidden:(bool)isHidden;
+- (void)setRootViewBackgroundColor:(std::string)color alpha:(float)alpha;
 
 @end

package/ios/platform/Platform_iOS.mm

@@ -46,35 +46,51 @@
 
 - (void)makeShared:(void*)runtime {
     self.unistylesRuntime = runtime;
-    
+
     auto unistylesRuntime = ((UnistylesRuntime*)self.unistylesRuntime);
-    
+
     unistylesRuntime->setScreenDimensionsCallback([self](){
         return [self getScreenDimensions];
     });
-    
+
     unistylesRuntime->setContentSizeCategoryCallback([](){
         return getContentSizeCategory();
     });
-    
+
     unistylesRuntime->setColorSchemeCallback([self](){
         return getColorScheme();
     });
-    
+
     unistylesRuntime->setStatusBarDimensionsCallback([self](){
         return [self getStatusBarDimensions];
     });
-    
+
     unistylesRuntime->setInsetsCallback([self](){
         return [self getInsets];
     });
-    
+
+    unistylesRuntime->setStatusBarHiddenCallback([self](bool hidden){
+        return [self setStatusBarHidden:hidden];
+    });
+
+    unistylesRuntime->setImmersiveModeCallback([self](bool hidden){
+        return [self setStatusBarHidden:hidden];
+    });
+
+    unistylesRuntime->setRootViewBackgroundColorCallback([self](const std::string &color, float alpha){
+        return [self setRootViewBackgroundColor:color alpha:alpha];
+    });
+
     dispatch_async(dispatch_get_main_queue(), ^{
-        unistylesRuntime->screen = [self getScreenDimensions];
+        Screen screen = [self getScreenDimensions];
+
+        unistylesRuntime->screen = Dimensions({ screen.width, screen.height });
         unistylesRuntime->contentSizeCategory = getContentSizeCategory();
         unistylesRuntime->colorScheme = getColorScheme();
         unistylesRuntime->statusBar = [self getStatusBarDimensions];
         unistylesRuntime->insets = [self getInsets];
+        unistylesRuntime->pixelRatio = screen.pixelRatio;
+        unistylesRuntime->fontScale = screen.fontScale;
     });
 }
 
@@ -92,7 +108,7 @@
 
 - (void)onWindowChange:(NSNotification *)notification {
     dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0.1 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
-        Dimensions screen = [self getScreenDimensions];
+        Screen screen = [self getScreenDimensions];
         Insets insets = [self getInsets];
         Dimensions statusBar = [self getStatusBarDimensions];
 
@@ -112,16 +128,43 @@
 - (Dimensions)getStatusBarDimensions {
     UIWindow *window = UIApplication.sharedApplication.windows.firstObject;
     CGRect statusBarFrame = window.windowScene.statusBarManager.statusBarFrame;
- 
+
     return {(int)statusBarFrame.size.width, (int)statusBarFrame.size.height};
 }
 
-- (Dimensions)getScreenDimensions {
+- (Screen)getScreenDimensions {
     UIViewController *presentedViewController = RCTPresentedViewController();
     CGRect windowFrame = presentedViewController.view.window.frame;
-    Dimensions screenDimension = {(int)windowFrame.size.width, (int)windowFrame.size.height};
-    
-    return screenDimension;
+    int width = (int)windowFrame.size.width;
+    int height = (int)windowFrame.size.height;
+    float pixelRatio = presentedViewController.view.window.screen.scale;
+    float fontScale = getFontScale();
+
+    return Screen({width, height, pixelRatio, fontScale});
+}
+
+- (void)setStatusBarHidden:(bool)isHidden {
+    // forward it to React Native ViewController
+    dispatch_async(dispatch_get_main_queue(), ^{
+        #pragma clang diagnostic ignored "-Wdeprecated-declarations"
+        [RCTSharedApplication() setStatusBarHidden:isHidden animated:true];
+    });
+}
+
+- (void)setRootViewBackgroundColor:(std::string)color alpha:(float)alpha {
+    UIViewController *presentedViewController = RCTPresentedViewController();
+    NSString *colorString = [NSString stringWithUTF8String:color.c_str()];
+    UIColor *backgroundColor = colorFromHexString(colorString, alpha);
+
+    if (backgroundColor == nil) {
+        NSLog(@"🦄 Unistyles: Couldn't set rootView to %@ color", colorString);
+
+        return;
+    }
+
+    dispatch_async(dispatch_get_main_queue(), ^{
+        presentedViewController.view.backgroundColor = backgroundColor;
+    });
 }
 
 @end