Skip to content

Commit 79fa540

Browse files
committed
Add elideMode to Text component
1 parent 45626c4 commit 79fa540

File tree

1 file changed

+19
-3
lines changed

1 file changed

+19
-3
lines changed

src/components/Text/RNText.ts

+19-3
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
1-
import { QLabel, NodeWidget, QLabelSignals, TextInteractionFlag } from '@nodegui/nodegui';
1+
import { QLabel, NodeWidget, QLabelSignals, TextInteractionFlag, QFontMetrics, TextElideMode, WidgetEventTypes } from '@nodegui/nodegui';
22
import { ViewProps, setViewProps } from '../View/RNView';
33
import { RNWidget } from '../config';
44
import { throwUnsupported } from '../../utils/helpers';
55

66
export interface TextProps extends ViewProps<QLabelSignals> {
77
children?: string | number | Array<string | number>;
88
wordWrap?: boolean;
9+
elideMode?: TextElideMode;
910
scaledContents?: boolean;
1011
openExternalLinks?: boolean;
1112
textInteractionFlags?: TextInteractionFlag;
@@ -23,7 +24,22 @@ export const setTextProps = (
2324
set children(text: string | number | Array<string | number>) {
2425
text = Array.isArray(text) ? text.join('') : text;
2526

26-
widget.setText(text);
27+
if (this.elideMode !== undefined) {
28+
const elideMode = this.elideMode;
29+
const elidedText = () => {
30+
const metrics = new QFontMetrics(widget.font());
31+
const lines = widget.wordWrap() ? Math.floor(widget.size().height() / metrics.lineSpacing()) : 1;
32+
return metrics.elidedText(`${text}`, elideMode, (widget.size().width() - metrics.maxWidth()) * lines);
33+
}
34+
35+
widget.addEventListener(WidgetEventTypes.Resize, () => {
36+
widget.setText(elidedText());
37+
});
38+
39+
widget.setText(elidedText());
40+
} else {
41+
widget.setText(text);
42+
}
2743
},
2844
set wordWrap(shouldWrap: boolean) {
2945
widget.setWordWrap(shouldWrap);
@@ -34,7 +50,7 @@ export const setTextProps = (
3450
set openExternalLinks(shouldOpenExternalLinks: boolean) {
3551
widget.setProperty('openExternalLinks', shouldOpenExternalLinks);
3652
},
37-
set textInteractionFlags(interactionFlag: TextInteractionFlag){
53+
set textInteractionFlags(interactionFlag: TextInteractionFlag) {
3854
widget.setProperty('textInteractionFlags', interactionFlag);
3955
}
4056
};

0 commit comments

Comments
 (0)