Skip to content

Commit 2ed3d87

Browse files
farfromrefugfarfromrefug
committed
fix: dark mode support
1 parent 9d0e15a commit 2ed3d87

File tree

3 files changed

+35
-52
lines changed

3 files changed

+35
-52
lines changed

‎src/bottomsheet/bottomsheet-common.ts

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ import { createViewFromEntry } from '@nativescript/core/ui/builder';
33
import { Frame } from '@nativescript/core/ui/frame';
44
import { EventData } from '@nativescript/core/data/observable';
55
import { eachDescendant, ViewBase } from '@nativescript/core/ui/core/view-base';
6+
import { getSystemCssClasses, MODAL_ROOT_VIEW_CSS_CLASS } from '@nativescript/core/css/system-classes';
67

78
declare module '@nativescript/core/ui/core/view/view' {
89
interface View {
@@ -38,9 +39,9 @@ export interface BottomSheetOptions {
3839
dismissOnBackgroundTap?: boolean; // An optional parameter specifying whether to dismiss the sheet when clicking on background.
3940
closeCallback?: Function; // A function that will be called when the view is closed. Any arguments provided when calling shownInBottomSheet.closeCallback will be available here.
4041
trackingScrollView?: string; // optional id of the scroll view to track
41-
transparent?: boolean // optional parameter to make the bottomsheet transparent
42-
ignoreTopSafeArea?: boolean // optional ios parameter to top safe area. Default is true
43-
ignoreBottomSafeArea?: boolean// optional ios parameter to bottom safe area. Default is false
42+
transparent?: boolean; // optional parameter to make the bottomsheet transparent
43+
ignoreTopSafeArea?: boolean; // optional ios parameter to top safe area. Default is true
44+
ignoreBottomSafeArea?: boolean; // optional ios parameter to bottom safe area. Default is false
4445
}
4546

4647
export abstract class ViewWithBottomSheetBase extends View {
@@ -91,7 +92,7 @@ export abstract class ViewWithBottomSheetBase extends View {
9192
this._closeBottomSheetCallback = null;
9293
this._bottomSheetContext.closeCallback = null;
9394
const whenClosedCallback = () => {
94-
if (typeof options.closeCallback === "function") {
95+
if (typeof options.closeCallback === 'function') {
9596
options.closeCallback.apply(undefined, originalArgs);
9697
}
9798
};
@@ -128,7 +129,10 @@ export abstract class ViewWithBottomSheetBase extends View {
128129
const view = options.view instanceof View ? (options.view as ViewWithBottomSheetBase) : <ViewWithBottomSheetBase>createViewFromEntry({
129130
moduleName: options.view as string
130131
});
131-
132+
view.cssClasses.add(MODAL_ROOT_VIEW_CSS_CLASS);
133+
const modalRootViewCssClasses = getSystemCssClasses();
134+
modalRootViewCssClasses.forEach(c => view.cssClasses.add(c));
135+
132136
view._showNativeBottomSheet(this, options);
133137
return view;
134138
}

‎src/dialogs/dialogs.android.ts

Lines changed: 9 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,28 +1,13 @@
11
import { android as androidApp } from '@nativescript/core/application';
2+
import { getSystemCssClasses, MODAL_ROOT_VIEW_CSS_CLASS } from '@nativescript/core/css/system-classes';
23
import { fromObject } from '@nativescript/core/data/observable';
34
import { createViewFromEntry } from '@nativescript/core/ui/builder';
45
import { View } from '@nativescript/core/ui/core/view';
5-
import {
6-
ActionOptions,
7-
ALERT,
8-
CANCEL,
9-
capitalizationType,
10-
CONFIRM,
11-
ConfirmOptions,
12-
DialogOptions,
13-
getButtonColors,
14-
getLabelColor,
15-
inputType,
16-
LOGIN,
17-
LoginResult,
18-
OK,
19-
PROMPT,
20-
PromptResult
21-
} from '@nativescript/core/ui/dialogs';
22-
import { LoginOptions, MDCAlertControlerOptions, PromptOptions } from './dialogs';
6+
import { ActionOptions, ALERT, CANCEL, capitalizationType, CONFIRM, ConfirmOptions, DialogOptions, getButtonColors, getLabelColor, inputType, LOGIN, LoginResult, OK, PROMPT, PromptResult } from '@nativescript/core/ui/dialogs';
237
import { StackLayout } from '@nativescript/core/ui/layouts/stack-layout';
248
import { ad } from '@nativescript/core/utils/utils';
259
import { TextField } from 'nativescript-material-textfield';
10+
import { LoginOptions, MDCAlertControlerOptions, PromptOptions } from './dialogs';
2611
import { isDialogOptions } from './dialogs-common';
2712

2813
export { capitalizationType, inputType };
@@ -62,6 +47,12 @@ function createAlertDialog(options?: DialogOptions & MDCAlertControlerOptions):
6247
: createViewFromEntry({
6348
moduleName: options.view as string
6449
});
50+
51+
52+
view.cssClasses.add(MODAL_ROOT_VIEW_CSS_CLASS);
53+
const modalRootViewCssClasses = getSystemCssClasses();
54+
modalRootViewCssClasses.forEach(c => view.cssClasses.add(c));
55+
6556
(activity as any)._currentModalCustomView = view;
6657
view._setupAsRootView(activity);
6758
view._isAddedToNativeVisualTree = true;

‎src/dialogs/dialogs.ios.ts

Lines changed: 17 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,14 @@
1-
import { themer } from 'nativescript-material-core/core';
2-
import { TextField } from 'nativescript-material-textfield';
31
import { getRootView, ios } from '@nativescript/core/application';
2+
import { getSystemCssClasses, MODAL_ROOT_VIEW_CSS_CLASS } from '@nativescript/core/css/system-classes';
43
import { fromObject } from '@nativescript/core/data/observable';
54
import { createViewFromEntry } from '@nativescript/core/ui/builder/builder';
6-
import { ios as iosView, View } from '@nativescript/core/ui/core/view';
7-
import { layout } from '@nativescript/core/utils/utils';
8-
import {
9-
ActionOptions,
10-
CANCEL,
11-
capitalizationType,
12-
ConfirmOptions,
13-
DialogOptions,
14-
getButtonColors,
15-
getCurrentPage,
16-
getLabelColor,
17-
inputType,
18-
LOGIN,
19-
LoginResult,
20-
OK,
21-
PromptResult
22-
} from '@nativescript/core/ui/dialogs';
5+
import { View } from '@nativescript/core/ui/core/view';
6+
import { ActionOptions, CANCEL, capitalizationType, ConfirmOptions, DialogOptions, getButtonColors, getCurrentPage, getLabelColor, inputType, LoginResult, OK, PromptResult } from '@nativescript/core/ui/dialogs';
237
import { StackLayout } from '@nativescript/core/ui/layouts/stack-layout';
248
import { isDefined, isFunction, isString } from '@nativescript/core/utils/types';
9+
import { layout } from '@nativescript/core/utils/utils';
10+
import { themer } from 'nativescript-material-core/core';
11+
import { TextField } from 'nativescript-material-textfield';
2512
import { LoginOptions, MDCAlertControlerOptions, PromptOptions } from './dialogs';
2613
import { isDialogOptions } from './dialogs-common';
2714

@@ -95,7 +82,6 @@ const MDCAlertControllerImpl: MDCAlertControllerImpl = (MDCAlertController as an
9582
const nativeViewProtected = this._customContentView.nativeViewProtected;
9683
if (contentScrollView && nativeViewProtected) {
9784
contentScrollView.addSubview(nativeViewProtected);
98-
9985
}
10086
},
10187
get customContentView() {
@@ -134,23 +120,21 @@ const MDCAlertControllerImpl: MDCAlertControllerImpl = (MDCAlertController as an
134120
if (hasTitleOrMessage) {
135121
const index = contentScrollView.subviews.indexOfObject(view.nativeViewProtected);
136122
if (index === -1) {
137-
originY =layout.toDevicePixels(contentSize.height)
123+
originY = layout.toDevicePixels(contentSize.height);
138124
} else {
139-
const viewOnTopFrame = contentScrollView.subviews.objectAtIndex(index-1).frame;
125+
const viewOnTopFrame = contentScrollView.subviews.objectAtIndex(index - 1).frame;
140126
// the +24 is MDCDialogContentInsets
141-
originY =layout.toDevicePixels(viewOnTopFrame.origin.y + viewOnTopFrame.size.height + 24)
142-
127+
originY = layout.toDevicePixels(viewOnTopFrame.origin.y + viewOnTopFrame.size.height + 24);
143128
}
144129
}
145130

146131
const measuredWidth = view.getMeasuredWidth(); // pixels
147132
const measuredHeight = view.getMeasuredHeight(); // pixels
148133
View.layoutChild(null, view, 0, originY, measuredWidth, originY + measuredHeight);
149134

150-
151135
// TODO: for a reload of the preferredContentSize. Find a better solution!
152-
const pW = this.super.preferredContentSize.width
153-
const pH = this.super.preferredContentSize.height
136+
const pW = this.super.preferredContentSize.width;
137+
const pH = this.super.preferredContentSize.height;
154138
this.preferredContentSize = CGSizeMake(pW, pH + 0.00000000001);
155139
this.preferredContentSize = CGSizeMake(pW, pH);
156140
return true;
@@ -182,7 +166,6 @@ const MDCAlertControllerImpl: MDCAlertControllerImpl = (MDCAlertController as an
182166
},
183167
viewDidLayoutSubviews() {
184168
this.updateContentViewSize();
185-
186169
},
187170
viewDidAppear() {
188171
if (this.autoFocusTextField) {
@@ -329,6 +312,11 @@ function createAlertController(options: DialogOptions & MDCAlertControlerOptions
329312
: createViewFromEntry({
330313
moduleName: options.view as string
331314
});
315+
316+
view.cssClasses.add(MODAL_ROOT_VIEW_CSS_CLASS);
317+
const modalRootViewCssClasses = getSystemCssClasses();
318+
modalRootViewCssClasses.forEach(c => view.cssClasses.add(c));
319+
332320
alertController.customContentView = view;
333321
alertController._resolveFunction = resolve;
334322
const context = options.context || {};
@@ -658,7 +646,7 @@ function showUIAlertController(alertController: MDCAlertController) {
658646

659647
// for now we need to use the rootController because of a bug in {N}
660648
let viewController = ios.rootController;
661-
649+
662650
// let viewController: UIViewController = currentView.ios;
663651

664652
// if (!(currentView.ios instanceof UIViewController)) {

0 commit comments

Comments
 (0)