質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

Q&A

0回答

130閲覧

visual studio codeにフォームを追加したい

syen2501

総合スコア38

TypeScript

TypeScriptは、マイクロソフトによって開発された フリーでオープンソースのプログラミング言語です。 TypeScriptは、JavaScriptの構文の拡張であるので、既存の JavaScriptのコードにわずかな修正を加えれば動作します。

0グッド

1クリップ

投稿2019/05/13 07:35

typescriptで特定の単語をハイライトさせるプログラムを書いています。
エディタではvisual studio codeを使用しているのですがユーザがハイライトさせる単語を
指定できるようにclearHighlightという関数の部分を変更し実装しようと考えています。

色々調べたのですが、typescriptを用いてエディタにフォームやテキストボックスなどを
追加するような例があまりないため、困っています。
何か良い方法を教えて頂ければ幸いです。宜しくお願い致します。
下記に現状のプログラムをあげておきます。

Typescript

1'use strict'; 2import * as vscode from 'vscode'; 3import * as fs from 'fs'; 4 5export function activate(context: vscode.ExtensionContext) { 6 console.log('Congratulations, your extension "semieditor" is now active!'); 7 const readsemiJson = JSON.parse(fs.readFileSync('C:\User\specification\src\sample.json','utf8')); 8 9 // 特定の単語に色付け 10 const strengthTimeWordList = readsemiJson.強時間; 11 12 const strengthTimeWords: vscode.DecorationOptions[] = []; 13 const dependencyRelationWords: vscode.DecorationOptions[] = []; 14 15 //child -> parent(値域) semiについて 16 function fromObjecttoRange(WordList: any,foundWordList: vscode.DecorationOptions[],dependencyRelationList: vscode.DecorationOptions[],Count: number){ 17 const activeEditor = vscode.window.activeTextEditor; 18 const text = activeEditor.document.getText(); //ドキュメント取得 19 20 // 取得したテキストを改行ごと(文章)に分割する 21 var textArray = text.split(/\r\n|\r|\n/); 22 23 if(WordList.length > 0){ 24 for(var i = 0; i < WordList.length; i++){ 25 const word = WordList[i].split('=>'); 26 const parentword = word[0]; 27 const rangeword = word[1]; 28 var offSet = 0; 29 for(var j = 0; j < textArray.length; j++){ 30 if(textArray[j] !== ''){ 31 if(textArray[j].search(rangeword) !== -1 && textArray[j].search(parentword) !== -1){ 32 const startPos = activeEditor.document.positionAt(offSet + textArray[j].search(rangeword)); 33 const endPos = activeEditor.document.positionAt(offSet + textArray[j].search(rangeword) + rangeword.length); 34 const decoration = { range: new vscode.Range(startPos, endPos) }; 35 foundWordList.push(decoration); 36 37 const related_startPos = activeEditor.document.positionAt(offSet + textArray[j].search(parentword)); 38 const related_endPos = activeEditor.document.positionAt(offSet + textArray[j].search(parentword) + parentword.length); 39 const related_decoration = { range: new vscode.Range(related_startPos, related_endPos) }; 40 dependencyRelationList.push(related_decoration); 41 } 42 if(textArray[j].search(rangeword) !== -1 && parentword === 'なし'){ 43 const startPos = activeEditor.document.positionAt(offSet + textArray[j].search(rangeword)); 44 const endPos = activeEditor.document.positionAt(offSet + textArray[j].search(rangeword) + rangeword.length); 45 const decoration = { range: new vscode.Range(startPos, endPos) }; 46 foundWordList.push(decoration); 47 } 48 } 49 //改行の長さも加算している 50 offSet += textArray[j].length + 2; 51 Count++; 52 } 53 } 54 return {foundWordList,dependencyRelationList,Count}; 55 } 56 } 57 58 //値域と修飾語をハイライト 59 function decorateWord() { 60 const activeEditor = vscode.window.activeTextEditor; 61 62 //強時間 63 fromObjecttoRange(strengthTimeWordList,strengthTimeWords,dependencyRelationWords,strengthtimeCount); 64 65 activeEditor.setDecorations(strengthTimeMarkerDecoration,strengthTimeWords); 66 activeEditor.setDecorations(dependencyRelation,dependencyRelationWords); 67 } 68 69 //ハイライトの削除 70 function clearHighlight(){ 71 //強時間 72 fromObjecttoRange(strengthTimeWordList,strengthTimeWords,dependencyRelationWords,strengthtimeCount); 73 74 strengthTimeMarkerDecoration.dispose(); 75 dependencyRelation.dispose(); 76 77 } 78 context.subscriptions.push(vscode.commands.registerCommand('extension.color', () => { 79 vscode.window.showInformationMessage("Color Range Word"); 80 decorateWord(); 81 })); 82 83 context.subscriptions.push(vscode.commands.registerCommand('extension.highlightOFF', () => { 84 vscode.window.showInformationMessage("HighLight OFF"); 85 clearHighlight(); 86 })); 87 88 //強時間に色付け 89 const strengthTimeMarkerDecoration = vscode.window.createTextEditorDecorationType({ 90 'borderWidth': '1px', 91 'borderRadius': '2px', 92 'borderStyle': 'solid', 93 'backgroundColor': 'rgba(128, 128, 0, 0.3)', 94 'color':'orange' 95 }); 96 97 //係り受けの対象を色付け 98 const dependencyRelation = vscode.window.createTextEditorDecorationType({ 99 'borderWidth': '1px', 100 'borderRadius': '2px', 101 'borderStyle': 'solid', 102 'backgroundColor': 'rgba(0, 255, 0, 0.3)', 103 'color':'lightgreen' 104 }); 105}

JSON

1{ 2 "回数": [], 3 "強数量修飾": [], 4 "時数ノ": [], 5 "未来句": [], 6 "数量": [], 7 "強時間": [ 8 "ドア入力右=>常時", 9 "なし=>常時", 10 "ドア入力I=>常時", 11 "なし=>長時間", 12 "扉閉め忘れ=>一定時間以上" 13 ], 14 "時間": [] 15}

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問