Markdown Horizontal Scrollbar Fix (#17083)

* dynamically change horizontal scrollbar

* working horizontal scrollbar

* created new event to handle both scrollbar and mouse wheel

* only show scrollbar when needed
This commit is contained in:
Vasu Bhog
2021-09-27 16:54:43 -07:00
committed by GitHub
parent 6b2e950f68
commit db1d3cc517
4 changed files with 67 additions and 4 deletions

View File

@@ -37,6 +37,7 @@ export class QueryTextEditor extends BaseTextEditor {
private _hideLineNumbers: boolean;
private _scrollbarHeight: number;
private _lineHeight: number;
private _shouldAddHorizontalScrollbarHeight: boolean = false;
constructor(
@ITelemetryService telemetryService: ITelemetryService,
@@ -123,6 +124,10 @@ export class QueryTextEditor extends BaseTextEditor {
return editorWidget.getScrollHeight();
}
public get shouldAddHorizontalScrollbar(): boolean {
return this._shouldAddHorizontalScrollbarHeight;
}
public setHeightToScrollHeight(configChanged?: boolean, isEditorCollapsed?: boolean,) {
let editorWidget = this.getControl() as ICodeEditor;
let layoutInfo = editorWidget.getLayoutInfo();
@@ -146,7 +151,7 @@ export class QueryTextEditor extends BaseTextEditor {
// number of lines that wrap). Finally, viewportColumn is calculated on editor resizing automatically; we can use it to ensure
// that the viewportColumn will always be greater than any character's column in an editor.
let numberWrappedLines = 0;
let shouldAddHorizontalScrollbarHeight = false;
this._shouldAddHorizontalScrollbarHeight = false;
if (!this._lineHeight || configChanged) {
this._lineHeight = editorWidget.getOption(EditorOption.lineHeight) || 18;
}
@@ -162,14 +167,14 @@ export class QueryTextEditor extends BaseTextEditor {
for (let line = 1; line <= lineCount; line++) {
// The horizontal scrollbar always appears 1 column past the viewport column when word wrap is disabled
if (editorWidgetModel.getLineMaxColumn(line) >= layoutInfo.viewportColumn + 1) {
shouldAddHorizontalScrollbarHeight = true;
this._shouldAddHorizontalScrollbarHeight = true;
break;
}
}
}
let editorHeightUsingLines = this._lineHeight * (lineCount + numberWrappedLines);
let editorHeightUsingMinHeight = Math.max(Math.min(editorHeightUsingLines, this._maxHeight), this._minHeight);
editorHeightUsingMinHeight = shouldAddHorizontalScrollbarHeight ? editorHeightUsingMinHeight + this._scrollbarHeight : editorHeightUsingMinHeight;
editorHeightUsingMinHeight = this._shouldAddHorizontalScrollbarHeight ? editorHeightUsingMinHeight + this._scrollbarHeight : editorHeightUsingMinHeight;
this.setHeight(editorHeightUsingMinHeight);
}