Creating a extension for showing comment outlines

  Kiến thức lập trình

I’m trying to create a extension which creates a outline around comments. I’m having trouble with multiline comments. I want to enclose the multiline comment in a single box. Currently it’s creating a border at every line. I’m building on top of the better comments extension.
enter image description here

This is how I need it to look like

enter image description here

I am a noob at this.

    activeEditor: vscode.TextEditor
  ): Promise<void> {
    let multilineComments: vscode.Range[] = [];
    let isInMultiLineComment = false;
    let startLine: number | undefined = undefined;

    for (
      let lineIndex = 0;
      lineIndex < activeEditor.document.lineCount;
    ) {
      let line = activeEditor.document.lineAt(lineIndex);
      let lineText = line.text.trim();

      // Check for the start of a multiline comment
      if (lineText.startsWith("/*") && !isInMultiLineComment) {
        isInMultiLineComment = true;
        startLine = lineIndex;

      // Check for the end of a multiline comment
      if (isInMultiLineComment && lineText.endsWith("*/")) {
        isInMultiLineComment = false;
        let outlineStart = activeEditor.document.lineAt(startLine!).range.start;
        let outlineEnd = line.range.end;
        let outlineRange = new vscode.Range(outlineStart, outlineEnd);
        startLine = undefined; // Reset startLine for the next comment
    console.log("Multiline Comments", multilineComments);

    // Apply outline decorations
    this.ApplyOutlineDecorations(activeEditor, multilineComments);

  public ApplyOutlineDecorations(
    activeEditor: vscode.TextEditor,
    outlineRanges: vscode.Range[]
  ): void {
    // Apply outline decoration to the entire multiline comment block
    activeEditor.setDecorations(this.outlineDecorationType, outlineRanges);

my code. I don’t really understand this stuff. If someone knows anything please help

New contributor

AnasGrzor is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.