fix-next(iOS): set root viewe css classes before setup UI (#8005)

At application launch, `ns-root` class is not set when loading the theme.
This commit is contained in:
Vasil Chimev
2019-10-24 10:15:03 +03:00
committed by Manol Donev
parent c9bfec1cbe
commit beca1c8828
3 changed files with 14 additions and 21 deletions

View File

@ -22,8 +22,7 @@ import { Builder } from "../ui/builder";
import {
CLASS_PREFIX,
getRootViewCssClasses,
pushToRootViewCssClasses,
resetRootViewCssClasses
pushToRootViewCssClasses
} from "../css/system-classes";
import { ios as iosView, View } from "../ui/core/view";
@ -308,7 +307,7 @@ class IOSApplication implements IOSApplicationDefinition {
this._window.makeKeyAndVisible();
}
setupRootViewCssClasses(rootView);
setRootViewSystemAppearanceCssClass(rootView);
rootView.on(iosView.traitCollectionColorAppearanceChangedEvent, () => {
const userInterfaceStyle = controller.traitCollection.userInterfaceStyle;
const newSystemAppearance = getSystemAppearanceValue(userInterfaceStyle);
@ -356,6 +355,8 @@ function createRootView(v?: View) {
}
}
setRootViewCssClasses(rootView);
return rootView;
}
@ -398,7 +399,7 @@ export function _start(entry?: string | NavigationEntry) {
// Mind root view CSS classes in future work
// on embedding NativeScript applications
setupRootViewCssClasses(rootView);
setRootViewSystemAppearanceCssClass(rootView);
rootView.on(iosView.traitCollectionColorAppearanceChangedEvent, () => {
const userInterfaceStyle = controller.traitCollection.userInterfaceStyle;
const newSystemAppearance = getSystemAppearanceValue(userInterfaceStyle);
@ -482,22 +483,24 @@ function setViewControllerView(view: View): void {
}
}
function setupRootViewCssClasses(rootView: View): void {
resetRootViewCssClasses();
function setRootViewCssClasses(rootView: View): void {
const deviceType = device.deviceType.toLowerCase();
pushToRootViewCssClasses(`${CLASS_PREFIX}${IOS_PLATFORM}`);
pushToRootViewCssClasses(`${CLASS_PREFIX}${deviceType}`);
pushToRootViewCssClasses(`${CLASS_PREFIX}${iosApp.orientation}`);
if (majorVersion >= 13) {
pushToRootViewCssClasses(`${CLASS_PREFIX}${iosApp.systemAppearance}`);
}
const rootViewCssClasses = getRootViewCssClasses();
rootViewCssClasses.forEach(c => rootView.cssClasses.add(c));
}
function setRootViewSystemAppearanceCssClass(rootView: View): void {
if (majorVersion >= 13) {
const systemAppearanceCssClass = `${CLASS_PREFIX}${iosApp.systemAppearance}`;
pushToRootViewCssClasses(systemAppearanceCssClass);
rootView.cssClasses.add(systemAppearanceCssClass);
}
}
export function orientation(): "portrait" | "landscape" | "unknown" {
return iosApp.orientation;
}

View File

@ -28,8 +28,3 @@ export function pushToRootViewCssClasses(value: string): number;
* @param value
*/
export function removeFromRootViewCssClasses(value: string): string;
/**
* Resets CSS classes for root view.
*/
export function resetRootViewCssClasses(): string[];

View File

@ -30,8 +30,3 @@ export function removeFromRootViewCssClasses(value: string): string {
return removedElement;
}
export function resetRootViewCssClasses(): string[] {
// Preserve the default `ns-root` CSS class
return rootViewCssClasses.splice(1);
}