Skip to content

Commit 4e65ff5

Browse files
a7ula7ul
committed
Rewrite all widgets to make it more configurable for implementing scrollarea
1 parent b9683f8 commit 4e65ff5

File tree

29 files changed

+634
-564
lines changed

29 files changed

+634
-564
lines changed

‎src/components/Button/RNButton.ts‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { QIcon, QPushButton } from "@nodegui/nodegui";
2+
import { ViewProps, setProps as setViewProps } from "../View/RNView";
3+
4+
export class RNButton extends QPushButton {
5+
static tagName = "button";
6+
}
7+
8+
export interface ButtonProps extends ViewProps {
9+
text?: string;
10+
flat?: boolean;
11+
icon?: QIcon;
12+
}
13+
14+
export const setProps = (
15+
widget: RNButton,
16+
newProps: ButtonProps,
17+
oldProps: ButtonProps
18+
) => {
19+
const setter: ButtonProps = {
20+
set text(buttonText: string) {
21+
widget.setText(buttonText);
22+
},
23+
set flat(isFlat: boolean) {
24+
widget.setFlat(isFlat);
25+
},
26+
set icon(icon: QIcon) {
27+
widget.setIcon(icon);
28+
}
29+
};
30+
Object.assign(setter, newProps);
31+
setViewProps(widget, newProps, oldProps);
32+
};

‎src/components/Button/index.ts‎

Lines changed: 5 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -1,35 +1,10 @@
1-
import { QPushButton, QIcon, NodeWidget } from "@nodegui/nodegui";
1+
import { NodeWidget } from "@nodegui/nodegui";
22
import { Fiber } from "react-reconciler";
3-
import { ViewProps, setProps as setViewProps } from "../View";
43
import { registerComponent, ComponentConfig } from "../config";
5-
interface ButtonProps extends ViewProps {
6-
text?: string;
7-
flat?: boolean;
8-
icon?: QIcon;
9-
}
10-
11-
const setProps = (
12-
widget: QPushButton,
13-
newProps: ButtonProps,
14-
oldProps: ButtonProps
15-
) => {
16-
const setter: ButtonProps = {
17-
set text(buttonText: string) {
18-
widget.setText(buttonText);
19-
},
20-
set flat(isFlat: boolean) {
21-
widget.setFlat(isFlat);
22-
},
23-
set icon(icon: QIcon) {
24-
widget.setIcon(icon);
25-
}
26-
};
27-
Object.assign(setter, newProps);
28-
setViewProps(widget, newProps, oldProps);
29-
};
4+
import { setProps, ButtonProps, RNButton } from "./RNButton";
305

316
class ButtonConfig extends ComponentConfig {
32-
id = "button";
7+
tagName = RNButton.tagName;
338
shouldSetTextContent(nextProps: object): boolean {
349
return true;
3510
}
@@ -39,7 +14,7 @@ class ButtonConfig extends ComponentConfig {
3914
context: any,
4015
workInProgress: Fiber
4116
): NodeWidget {
42-
const widget = new QPushButton();
17+
const widget = new RNButton();
4318
setProps(widget, newProps, {});
4419
return widget;
4520
}
@@ -50,7 +25,7 @@ class ButtonConfig extends ComponentConfig {
5025
newProps: object,
5126
finishedWork: Fiber
5227
): void {
53-
setProps(instance as QPushButton, newProps, oldProps);
28+
setProps(instance as RNButton, newProps, oldProps);
5429
}
5530
}
5631

‎src/components/CheckBox/RNCheckBox.ts‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
import { ViewProps, setProps as setViewProps } from "../View/RNView";
2+
import { QCheckBox } from "@nodegui/nodegui";
3+
4+
export class RNCheckBox extends QCheckBox {
5+
static tagName = "checkbox";
6+
}
7+
8+
export interface CheckBoxProps extends ViewProps {
9+
children?: string;
10+
text?: string;
11+
checked?: boolean;
12+
}
13+
14+
export const setProps = (
15+
widget: RNCheckBox,
16+
newProps: CheckBoxProps,
17+
oldProps: CheckBoxProps
18+
) => {
19+
const setter: CheckBoxProps = {
20+
set text(checkboxText: string) {
21+
widget.setText(checkboxText);
22+
},
23+
set checked(isChecked: boolean) {
24+
widget.setChecked(isChecked);
25+
}
26+
};
27+
Object.assign(setter, newProps);
28+
setViewProps(widget, newProps, oldProps);
29+
};

‎src/components/CheckBox/index.ts‎

Lines changed: 5 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -1,33 +1,10 @@
1-
import { QCheckBox, NodeWidget } from "@nodegui/nodegui";
1+
import { NodeWidget } from "@nodegui/nodegui";
22
import { Fiber } from "react-reconciler";
3-
import { ViewProps, setProps as setViewProps } from "../View";
43
import { registerComponent, ComponentConfig } from "../config";
5-
6-
interface CheckBoxProps extends ViewProps {
7-
children?: string;
8-
text?: string;
9-
checked?: boolean;
10-
}
11-
12-
const setProps = (
13-
widget: QCheckBox,
14-
newProps: CheckBoxProps,
15-
oldProps: CheckBoxProps
16-
) => {
17-
const setter: CheckBoxProps = {
18-
set text(checkboxText: string) {
19-
widget.setText(checkboxText);
20-
},
21-
set checked(isChecked: boolean) {
22-
widget.setChecked(isChecked);
23-
}
24-
};
25-
Object.assign(setter, newProps);
26-
setViewProps(widget, newProps, oldProps);
27-
};
4+
import { RNCheckBox, setProps, CheckBoxProps } from "./RNCheckbox";
285

296
class CheckBoxConfig extends ComponentConfig {
30-
id = "checkbox";
7+
tagName = RNCheckBox.tagName;
318
shouldSetTextContent(nextProps: object): boolean {
329
return true;
3310
}
@@ -37,7 +14,7 @@ class CheckBoxConfig extends ComponentConfig {
3714
context: any,
3815
workInProgress: Fiber
3916
): NodeWidget {
40-
const widget = new QCheckBox();
17+
const widget = new RNCheckBox();
4118
setProps(widget, newProps, {});
4219
return widget;
4320
}
@@ -48,7 +25,7 @@ class CheckBoxConfig extends ComponentConfig {
4825
newProps: object,
4926
finishedWork: Fiber
5027
): void {
51-
setProps(instance as QCheckBox, newProps, oldProps);
28+
setProps(instance as RNCheckBox, newProps, oldProps);
5229
}
5330
}
5431

‎src/components/Dial/RNDial.ts‎

Lines changed: 32 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
import { QDial } from "@nodegui/nodegui";
2+
import { ViewProps, setProps as setViewProps } from "../View/RNView";
3+
4+
export class RNDial extends QDial {
5+
static tagName = "dial";
6+
}
7+
8+
export interface DialProps extends ViewProps {
9+
notchesVisible?: boolean;
10+
wrapping?: boolean;
11+
notchTarget?: number;
12+
}
13+
14+
export const setProps = (
15+
widget: RNDial,
16+
newProps: DialProps,
17+
oldProps: DialProps
18+
) => {
19+
const setter: DialProps = {
20+
set notchesVisible(notchesVisible: boolean) {
21+
widget.setNotchesVisible(notchesVisible);
22+
},
23+
set wrapping(wrapping: boolean) {
24+
widget.setWrapping(wrapping);
25+
},
26+
set notchTarget(notchTarget: number) {
27+
widget.setNotchTarget(notchTarget);
28+
}
29+
};
30+
Object.assign(setter, newProps);
31+
setViewProps(widget, newProps, oldProps);
32+
};

‎src/components/Dial/index.ts‎

Lines changed: 5 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,9 @@
11
import { Fiber } from "react-reconciler";
2-
import { QDial, NodeWidget } from "@nodegui/nodegui";
3-
import { ViewProps, setProps as setViewProps } from "../View";
2+
import { NodeWidget } from "@nodegui/nodegui";
43
import { registerComponent, ComponentConfig } from "../config";
5-
6-
export interface DialProps extends ViewProps {
7-
notchesVisible?: boolean;
8-
wrapping?: boolean;
9-
notchTarget?: number;
10-
}
11-
12-
export const setProps = (
13-
widget: QDial,
14-
newProps: DialProps,
15-
oldProps: DialProps
16-
) => {
17-
const setter: DialProps = {
18-
set notchesVisible(notchesVisible: boolean) {
19-
widget.setNotchesVisible(notchesVisible);
20-
},
21-
set wrapping(wrapping: boolean) {
22-
widget.setWrapping(wrapping);
23-
},
24-
set notchTarget(notchTarget: number) {
25-
widget.setNotchTarget(notchTarget);
26-
}
27-
};
28-
Object.assign(setter, newProps);
29-
setViewProps(widget, newProps, oldProps);
30-
};
31-
4+
import { RNDial, setProps, DialProps } from "./RNDial";
325
class DialConfig extends ComponentConfig {
33-
id = "dial";
6+
tagName = RNDial.tagName;
347
shouldSetTextContent(nextProps: object): boolean {
358
return true;
369
}
@@ -40,7 +13,7 @@ class DialConfig extends ComponentConfig {
4013
context: any,
4114
workInProgress: Fiber
4215
): NodeWidget {
43-
const widget = new QDial();
16+
const widget = new RNDial();
4417
setProps(widget, newProps, {});
4518
return widget;
4619
}
@@ -51,7 +24,7 @@ class DialConfig extends ComponentConfig {
5124
newProps: object,
5225
finishedWork: Fiber
5326
): void {
54-
setProps(instance as QDial, newProps, oldProps);
27+
setProps(instance as RNDial, newProps, oldProps);
5528
}
5629
}
5730

‎src/components/Image/ImageLabel.ts‎

Lines changed: 0 additions & 22 deletions
This file was deleted.

‎src/components/Image/RNImage.ts‎

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import { QLabel, QPixmap, AspectRatioMode } from "@nodegui/nodegui";
2+
import { TextProps, setProps as setTextProps } from "../Text/RNText";
3+
4+
export class RNImage extends QLabel {
5+
static tagName = "image";
6+
originalPixmap?: QPixmap;
7+
aspectRatioMode?: AspectRatioMode;
8+
setPixmap = (pixmap: QPixmap) => {
9+
// react:✓
10+
super.setPixmap(pixmap);
11+
this.originalPixmap = pixmap;
12+
};
13+
setAspectRatioMode = (mode: AspectRatioMode) => {
14+
// react:✓ TODO://getter
15+
this.aspectRatioMode = mode;
16+
};
17+
scalePixmap = (width: number, height: number) => {
18+
if (this.originalPixmap) {
19+
return super.setPixmap(
20+
this.originalPixmap.scaled(width, height, this.aspectRatioMode)
21+
);
22+
}
23+
};
24+
}
25+
26+
export interface ImageProps extends TextProps {
27+
src?: string;
28+
aspectRatioMode?: AspectRatioMode;
29+
}
30+
31+
export const setProps = (
32+
widget: RNImage,
33+
newProps: ImageProps,
34+
oldProps: ImageProps
35+
) => {
36+
const setter: ImageProps = {
37+
set src(imageUrl: string) {
38+
if (!imageUrl) {
39+
return;
40+
}
41+
const pixMap = new QPixmap(imageUrl);
42+
widget.setPixmap(pixMap);
43+
const size = widget.size();
44+
widget.scalePixmap(size.width, size.height);
45+
},
46+
set aspectRatioMode(mode: AspectRatioMode) {
47+
widget.setAspectRatioMode(mode);
48+
}
49+
};
50+
Object.assign(setter, newProps);
51+
setTextProps(widget, newProps, oldProps);
52+
};

0 commit comments

Comments
 (0)