javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-11-05 13:26:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor(dark-mode): application module

Browse Source
This commit is contained in:
Vasil Chimev
2019-09-30 18:35:11 +03:00
parent baba2c8789
commit b32aaa80c3
3 changed files with 47 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
tns-core-modules/application/application-common.ts
View File

@@ -126,18 +126,22 @@ export function loadAppCss(): void {
}
}
export function applyCssClass(rootView: View, cssClass: string) {
pushToRootViewCssClasses(cssClass);
rootView.cssClasses.add(cssClass);
rootView._onCssStateChange();
}
export function removeCssClass(rootView: View, cssClass: string) {
removeFromRootViewCssClasses(cssClass);
rootView.cssClasses.delete(cssClass);
}
export function orientationChanged(rootView: View, newOrientation: "portrait" | "landscape" | "unknown"): void {
const newOrientationCssClass = `${CLASS_PREFIX}${newOrientation}`;
if (!rootView.cssClasses.has(newOrientationCssClass)) {
const removeCssClass = (c: string) => {
removeFromRootViewCssClasses(c);
rootView.cssClasses.delete(c);
};
ORIENTATION_CSS_CLASSES.forEach(c => removeCssClass(c));
pushToRootViewCssClasses(newOrientationCssClass);
rootView.cssClasses.add(newOrientationCssClass);
rootView._onCssStateChange();
ORIENTATION_CSS_CLASSES.forEach(cssClass => removeCssClass(rootView, cssClass));
applyCssClass(rootView, newOrientationCssClass);
}
}

15
tns-core-modules/application/application.d.ts vendored
View File

@@ -286,10 +286,25 @@ export function on(event: "discardedError", callback: (args: DiscardedErrorEvent
export function on(event: "orientationChanged", callback: (args: OrientationChangedEventData) => void, thisArg?: any);
/**
<<<<<<< HEAD
* Gets the orientation of the application.
* Available values: "portrait", "landscape", "unknown".
*/
export function orientation(): "portrait" | "landscape" | "unknown";
=======
* Appends new CSS class to the system classes and applies it to the root view.
* @param rootView - The root view of the application.
* @param cssClass - The CSS class to apply.
*/
export function applyCssClass(rootView: View, cssClass: string);
/**
* Removes CSS class from the system classes and deletes it from the root view.
* @param rootView - The root view of the application.
* @param cssClass - The CSS class to delete.
*/
export function removeCssClass(rootView: View, cssClass: string);
>>>>>>> refactor(dark-mode): application module
/**
* This is the Android-specific application object instance.

44
tns-core-modules/application/application.ios.ts
View File

@@ -8,8 +8,8 @@ import {
} from ".";
import {
displayedEvent, exitEvent, getCssFileName, launchEvent, livesync, lowMemoryEvent, notify, on,
orientationChanged, orientationChangedEvent, resumeEvent, setApplication, suspendEvent
applyCssClass, displayedEvent, exitEvent, getCssFileName, launchEvent, livesync, lowMemoryEvent, notify, on,
orientationChanged, orientationChangedEvent, removeCssClass, resumeEvent, setApplication, suspendEvent
} from "./application-common";
// First reexport so that app module is initialized.
@@ -21,21 +21,20 @@ import {
CLASS_PREFIX,
getRootViewCssClasses,
pushToRootViewCssClasses,
removeFromRootViewCssClasses,
resetRootViewCssClasses
} from "../css/system-classes";
import { ios as iosView, View } from "../ui/core/view";
import { Frame, NavigationEntry } from "../ui/frame";
import { UserInterfaceStyle } from "../ui/enums/enums";
import { device } from "../platform/platform";
import { profile } from "../profiling";
import { ios } from "../utils/utils";
const IOS_PLATFORM = "ios";
// TODO:
const UI_STYLE_CSS_CLASSES = [
`${CLASS_PREFIX}light`,
`${CLASS_PREFIX}dark`
`${CLASS_PREFIX}${UserInterfaceStyle.light}`,
`${CLASS_PREFIX}${UserInterfaceStyle.dark}`
];
const getVisibleViewController = ios.getVisibleViewController;
@@ -295,25 +294,8 @@ class IOSApplication implements IOSApplicationDefinition {
}
setupRootViewCssClasses(controller, rootView);
rootView.on(iosView.traitCollectionColorAppearanceChangedEvent, () => {
const newUserInterfaceStyle = controller.traitCollection.userInterfaceStyle;
const newUserInterfaceStyleValue = getUserInterfaceStyleValue(newUserInterfaceStyle);
const newUserInterfaceStyleCssClass = `${CLASS_PREFIX}${newUserInterfaceStyleValue}`;
if (!rootView.cssClasses.has(newUserInterfaceStyleCssClass)) {
const removeCssClass = (c: string) => {
removeFromRootViewCssClasses(c);
rootView.cssClasses.delete(c);
};
// TODO:
UI_STYLE_CSS_CLASSES.forEach(c => removeCssClass(c));
pushToRootViewCssClasses(newUserInterfaceStyleCssClass);
rootView.cssClasses.add(newUserInterfaceStyleCssClass);
rootView._onCssStateChange();
}
traitCollectionColorAppearanceChanged(controller, rootView);
});
}
}
@@ -329,6 +311,18 @@ setApplication(iosApp);
};
let mainEntry: NavigationEntry;
function traitCollectionColorAppearanceChanged(controller: UIViewController, rootView: View) {
const newUserInterfaceStyle = controller.traitCollection.userInterfaceStyle;
const newUserInterfaceStyleValue = getUserInterfaceStyleValue(newUserInterfaceStyle);
const newUserInterfaceStyleCssClass = `${CLASS_PREFIX}${newUserInterfaceStyleValue}`;
if (!rootView.cssClasses.has(newUserInterfaceStyleCssClass)) {
UI_STYLE_CSS_CLASSES.forEach(cssClass => removeCssClass(rootView, cssClass));
applyCssClass(rootView, newUserInterfaceStyleCssClass);
}
}
function createRootView(v?: View) {
let rootView = v;
if (!rootView) {
@@ -386,7 +380,7 @@ export function _start(entry?: string | NavigationEntry) {
}
setupRootViewCssClasses(controller, rootView);
// TODO:
traitCollectionColorAppearanceChanged(controller, rootView);
iosApp.notifyAppStarted();
}
}