Skip to content

Commit 8f7f135

Browse files
authored
Adds QCombobox (#93)
1 parent d43c9e8 commit 8f7f135

File tree

4 files changed

+190
-2
lines changed

4 files changed

+190
-2
lines changed

src/components/ComboBox/RNComboBox.ts

Lines changed: 117 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,117 @@
1+
import {
2+
QComboBox,
3+
NodeWidget,
4+
QSize,
5+
QVariant,
6+
SizeAdjustPolicy,
7+
InsertPolicy,
8+
QIcon
9+
} from "@nodegui/nodegui";
10+
import { ViewProps, setViewProps } from "../View/RNView";
11+
import { RNWidget } from "../config";
12+
import { throwUnsupported } from "../../utils/helpers";
13+
14+
export interface ComboBoxProps extends ViewProps {
15+
items?: ComboBoxItem[];
16+
count?: number;
17+
iconSize?: QSize;
18+
frame?: boolean;
19+
currentIndex?: number;
20+
currentData?: QVariant;
21+
currentText?: string;
22+
duplicatesEnabled?: boolean;
23+
editable?: boolean;
24+
insertPolicy?: InsertPolicy;
25+
maxCount?: number;
26+
maxVisibleItems?: number;
27+
minimumContentsLength?: number;
28+
modelColumn?: number;
29+
sizeAdjustPolicy?: SizeAdjustPolicy;
30+
}
31+
32+
type ComboBoxItem = {
33+
text: string;
34+
icon?: QIcon;
35+
userData?: QVariant;
36+
};
37+
38+
const setComboBoxProps = (
39+
widget: RNComboBox,
40+
newProps: ComboBoxProps,
41+
oldProps: ComboBoxProps
42+
) => {
43+
const setter: ComboBoxProps = {
44+
set items(items: ComboBoxItem[]) {
45+
widget.clear();
46+
items.forEach(item => {
47+
widget.addItem(item.icon, item.text, item.userData);
48+
});
49+
},
50+
set count(count: number) {
51+
widget.setProperty("count", count);
52+
},
53+
set iconSize(iconSize: QSize) {
54+
widget.setProperty("iconSize", iconSize);
55+
},
56+
set frame(frame: boolean) {
57+
widget.setProperty("frame", frame);
58+
},
59+
set currentIndex(currentIndex: number) {
60+
widget.setProperty("currentIndex", currentIndex);
61+
},
62+
set currentData(value: QVariant) {
63+
widget.setProperty("currentData", value);
64+
},
65+
set currentText(text: string) {
66+
widget.setProperty("currentText", text);
67+
},
68+
set duplicatesEnabled(enabled: boolean) {
69+
widget.setProperty("duplicatesEnabled", enabled);
70+
},
71+
set editable(enabled: boolean) {
72+
widget.setProperty("editable", enabled);
73+
},
74+
set insertPolicy(policy: InsertPolicy) {
75+
widget.setProperty("insertPolicy", policy);
76+
},
77+
set maxCount(count: number) {
78+
widget.setProperty("maxCount", count);
79+
},
80+
set maxVisibleItems(count: number) {
81+
widget.setProperty("maxVisibleItems", count);
82+
},
83+
set minimumContentsLength(count: number) {
84+
widget.setProperty("minimumContentsLength", count);
85+
},
86+
set modelColumn(column: number) {
87+
widget.setProperty("modelColumn", column);
88+
},
89+
set sizeAdjustPolicy(policy: SizeAdjustPolicy) {
90+
widget.setProperty("sizeAdjustPolicy", policy);
91+
}
92+
};
93+
Object.assign(setter, newProps);
94+
setViewProps(widget, newProps, oldProps);
95+
};
96+
97+
/**
98+
* @ignore
99+
*/
100+
export class RNComboBox extends QComboBox implements RNWidget {
101+
setProps(newProps: ComboBoxProps, oldProps: ComboBoxProps): void {
102+
setComboBoxProps(this, newProps, oldProps);
103+
}
104+
appendInitialChild(child: NodeWidget): void {
105+
throwUnsupported(this);
106+
}
107+
appendChild(child: NodeWidget): void {
108+
throwUnsupported(this);
109+
}
110+
insertBefore(child: NodeWidget, beforeChild: NodeWidget): void {
111+
throwUnsupported(this);
112+
}
113+
removeChild(child: NodeWidget): void {
114+
throwUnsupported(this);
115+
}
116+
static tagName = "combobox";
117+
}

src/components/ComboBox/index.ts

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
import { registerComponent, ComponentConfig } from "../config";
2+
import { Fiber } from "react-reconciler";
3+
import { RNComboBox, ComboBoxProps } from "./RNComboBox";
4+
import { AppContainer } from "../../reconciler";
5+
6+
class ComboBoxConfig extends ComponentConfig {
7+
tagName = RNComboBox.tagName;
8+
shouldSetTextContent(nextProps: ComboBoxProps): boolean {
9+
return true;
10+
}
11+
createInstance(
12+
newProps: ComboBoxProps,
13+
rootInstance: AppContainer,
14+
context: any,
15+
workInProgress: Fiber
16+
): RNComboBox {
17+
const widget = new RNComboBox();
18+
widget.setProps(newProps, {});
19+
return widget;
20+
}
21+
finalizeInitialChildren(
22+
instance: RNComboBox,
23+
newProps: ComboBoxProps,
24+
rootContainerInstance: AppContainer,
25+
context: any
26+
): boolean {
27+
return true;
28+
}
29+
commitMount(
30+
instance: RNComboBox,
31+
newProps: ComboBoxProps,
32+
internalInstanceHandle: any
33+
): void {
34+
if (newProps.visible !== false) {
35+
instance.show();
36+
}
37+
return;
38+
}
39+
commitUpdate(
40+
instance: RNComboBox,
41+
updatePayload: any,
42+
oldProps: ComboBoxProps,
43+
newProps: ComboBoxProps,
44+
finishedWork: Fiber
45+
): void {
46+
instance.setProps(newProps, oldProps);
47+
}
48+
}
49+
50+
export const ComboBox = registerComponent<ComboBoxProps>(new ComboBoxConfig());

src/demo.tsx

Lines changed: 22 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,24 @@
1-
import React from "react";
2-
import { Renderer, Button, Window, View, AnimatedImage } from "./index";
1+
import React, { useRef } from "react";
2+
import {
3+
Renderer,
4+
Button,
5+
Window,
6+
View,
7+
AnimatedImage,
8+
ComboBox
9+
} from "./index";
10+
import { QIcon, QVariant, QComboBoxEvents, QComboBox } from "@nodegui/nodegui";
11+
12+
const items = [
13+
{
14+
text: "hello",
15+
icon: new QIcon(
16+
"/Users/atulr/Project/nodegui/nodegui/src/lib/QtGui/__tests__/assets/nodegui.png"
17+
),
18+
userData: new QVariant(12346)
19+
},
20+
{ text: "world" }
21+
];
322

423
const App = () => {
524
return (
@@ -9,6 +28,7 @@ const App = () => {
928
<Button style={buttonStyle} text={"Hello"} />
1029
<Button style={buttonStyle} text={"World"} />
1130
</View>
31+
<ComboBox items={items} />
1232
<AnimatedImage
1333
style="border: 1px solid blue; flex:1;"
1434
src="/Users/atulr/Project/nodegui/nodegui/src/lib/QtGui/__tests__/assets/fine.gif"

src/index.ts

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,5 +13,6 @@ export { RadioButton } from "./components/RadioButton";
1313
export { Dial } from "./components/Dial";
1414
export { SpinBox } from "./components/SpinBox";
1515
export { ScrollArea } from "./components/ScrollArea";
16+
export { ComboBox } from "./components/ComboBox";
1617
export { useEventHandler } from "./hooks";
1718
export { hot, appProxy } from "./development/hot-reload";

0 commit comments

Comments
 (0)