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

fix-next(css): className to preserve root views classes (#7725)

Browse Source
This commit is contained in:
Vasil Chimev
2019-08-30 09:09:35 +03:00
committed by GitHub
parent 92c3338dd5
commit d23ffb8dbf
13 changed files with 263 additions and 66 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -40,6 +40,8 @@ import {
LoadAppCSSEventData,
UnhandledErrorEventData
} from "./application";
import { CLASS_PREFIX, pushToRootViewCssClasses, removeFromRootViewCssClasses } from "../css/system-classes";
import { DeviceOrientation } from "../ui/enums/enums";
export { UnhandledErrorEventData, DiscardedErrorEventData, CssChangedEventData, LoadAppCSSEventData };
@@ -54,11 +56,10 @@ export const uncaughtErrorEvent = "uncaughtError";
export const discardedErrorEvent = "discardedError";
export const orientationChangedEvent = "orientationChanged";
export const CSS_CLASS_PREFIX = "ns-";
const ORIENTATION_CSS_CLASSES = [
`${CSS_CLASS_PREFIX}${DeviceOrientation.portrait}`,
`${CSS_CLASS_PREFIX}${DeviceOrientation.landscape}`,
`${CSS_CLASS_PREFIX}${DeviceOrientation.unknown}`
`${CLASS_PREFIX}${DeviceOrientation.portrait}`,
`${CLASS_PREFIX}${DeviceOrientation.landscape}`,
`${CLASS_PREFIX}${DeviceOrientation.unknown}`
];
let cssFile: string = "./app.css";
@@ -126,9 +127,15 @@ export function loadAppCss(): void {
}
export function orientationChanged(rootView: View, newOrientation: "portrait" | "landscape" | "unknown"): void {
const newOrientationCssClass = `${CSS_CLASS_PREFIX}${newOrientation}`;
const newOrientationCssClass = `${CLASS_PREFIX}${newOrientation}`;
if (!rootView.cssClasses.has(newOrientationCssClass)) {
ORIENTATION_CSS_CLASSES.forEach(c => rootView.cssClasses.delete(c));
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();
}

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

@@ -53,11 +53,6 @@ export const lowMemoryEvent: string;
*/
export const orientationChangedEvent: string;
/**
* String value "ns-" used for CSS class prefix.
*/
export const CSS_CLASS_PREFIX: string;
/**
* Event data containing information for the application events.
*/

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

@@ -1,4 +1,3 @@
import {
ApplicationEventData,
CssChangedEventData,
@@ -9,9 +8,8 @@ import {
} from ".";
import {
CSS_CLASS_PREFIX, displayedEvent, exitEvent, getCssFileName, launchEvent, livesync,
lowMemoryEvent, notify, on, orientationChanged, orientationChangedEvent, resumeEvent,
setApplication, suspendEvent
displayedEvent, exitEvent, getCssFileName, launchEvent, livesync, lowMemoryEvent, notify, on,
orientationChanged, orientationChangedEvent, resumeEvent, setApplication, suspendEvent
} from "./application-common";
// First reexport so that app module is initialized.
@@ -19,18 +17,15 @@ export * from "./application-common";
// TODO: Remove this and get it from global to decouple builder for angular
import { createViewFromEntry } from "../ui/builder";
import { CLASS_PREFIX, getRootViewCssClasses, pushToRootViewCssClasses } from "../css/system-classes";
import { ios as iosView, View } from "../ui/core/view";
import { Frame, NavigationEntry } from "../ui/frame";
import { device } from "../platform/platform";
import { profile } from "../profiling";
import { ios } from "../utils/utils";
const ROOT = "root";
const IOS_PLATFORM = "ios";
const ROOT_VIEW_CSS_CLASSES = [
`${CSS_CLASS_PREFIX}${ROOT}`,
`${CSS_CLASS_PREFIX}${IOS_PLATFORM}`
];
const getVisibleViewController = ios.getVisibleViewController;
// NOTE: UIResponder with implementation of window - related to https://github.com/NativeScript/ios-runtime/issues/430
@@ -317,9 +312,12 @@ function createRootView(v?: View) {
}
const deviceType = device.deviceType.toLowerCase();
ROOT_VIEW_CSS_CLASSES.push(`${CSS_CLASS_PREFIX}${deviceType}`);
ROOT_VIEW_CSS_CLASSES.push(`${CSS_CLASS_PREFIX}${iosApp.orientation}`);
ROOT_VIEW_CSS_CLASSES.forEach(c => rootView.cssClasses.add(c));
pushToRootViewCssClasses(`${CLASS_PREFIX}${IOS_PLATFORM}`);
pushToRootViewCssClasses(`${CLASS_PREFIX}${deviceType}`);
pushToRootViewCssClasses(`${CLASS_PREFIX}${iosApp.orientation}`);
const rootViewCssClasses = getRootViewCssClasses();
rootViewCssClasses.forEach(c => rootView.cssClasses.add(c));
return rootView;
}