Vscode: 強化されたスクロールバー（ミニマップを追加）

@jschraub VS 2013/2015の拡張スクロールバーから、気に入った機能や効率的に移動するのに役立つ特定の機能を指摘していただけますか？

絶対に、@ alexandrudima。 一目で、ドキュメント/コードの視覚的表現を取得する機能。 「10,000フィートのビュー」があると、ドキュメントを簡単に確認して、探しているコードの一部をクリックするのが簡単になります。 VS 2013/2015の拡張スクロールバーはそれよりも多くの機能を提供しますが、私はそれらの多くを使用していません。

SublimeやAtomなど、他の多くのコードエディターにも同様の機能があり、それらはすべて異なるサブ機能を備えていますが、ドキュメントの「10,000フィートのビュー」を一目で提供できることは、テキストエディターよりも大きな利点があると思います。対応する機能がありません。

それがあなたが探していたものなのか、それとももっと良い/異なる詳細が必要なのかを教えてください。

素晴らしい説明！ ありがとうございました！

こんにちは@ alexandrudima 、

エディターモデルを読んで、そのミニマップ表現をキャンバスに描くようなものになると思います。 wdyt？

@nojvek来週の終わりに9月の計画を起草してリリースします。 この問題がこのクエリの先頭に達していることを考えると、コミュニティのリクエストを追跡するために使用します（https://github.com/Microsoft/vscode/issues?q=is%3Aissue+is%3Aopen+sort%3Areactions-%2B1-desc ）、9月の計画に合わせるために大きな変化があります。

しばらくお待ちください:)

ベータビットplz！ これは私のお気に入りの機能であり、SublimeTextに縛られている唯一の機能です。

Soon™

👍ミニマップ機能は大いに見逃されています

私もそれがとても恋しいです。

+インフィニティ

@ + 1ミニマップは私にとってなくてはならない機能の1つであり、多くのアドオンを備えたアトムでうまく機能します。

この問題の良い例として私が見ているkateのミニマップを参照してください：

ミニマップの場合は+1。 スクロールするための「中マウスボタンを押したままにする」（スクロールバーボタン）も素晴らしいでしょう

gitステータス、エラー、現在の単語の他の出現、結果の検索、プレビューウィンドウの表示のピークがある場合、基本的にすべてのSublimeのミニマップに+すべてのVSCodeの現在のスクロールバーにあります。

VSができるのにVSCodeができない理由がわかりません。

これは大きな勝利であり、崇高なホールドオーバーのための最後の欠けている機能の1つです

私は最近その使用法を発見しました、それが実装されるまで待つことができません

+1はこれがVSCodeに実装されるのを待つことができません...

+1すぐに追加してください。

+1ミニマップを追加してください

これが最初のリリースからの機能ではなかったとは信じられませんか？！

VSCode用のミニマップを追加してください

+1ミニマップを追加してください

それに+1

これが1.6.0でうまくいかなかったのはとても悲しいです:(これをできるだけ早く追加してください

10月の計画も立てていないようです。 11月に指が交差したと思います。 リクエストリストの一番上に表示されているように見えるので、とてもエキサイティングです。

+1

+10

+1

+1

これ以上+1コメントしないでください。 代わりに、元の問題に賛成してください。
このスレッドを購読している人は、あなたが+1したときではなく、進捗があったときに通知を受け取りたいと思っています。

会話を共同編集者にロックできます。

ありがとうございます。それでは、お元気で、
ディープ

木、21:13で2016年10月13日、パインに[email protected]書きました：

これ以上+1コメントしないでください。 代わりに、元の問題に賛成してください。
このスレッドを購読している人は、進捗状況がわかったときに通知を受け取りたいと考えています
+1したときではなく、作られました。

—
あなたがコメントしたのであなたはこれを受け取っています。
このメールに直接返信し、GitHubで表示してください
https://github.com/Microsoft/vscode/issues/4865#issuecomment -253552567、
またはスレッドをミュートします
https://github.com/notifications/unsubscribe-auth/ABDlF49KaIi-Lgu1cKv8Zhn1Tjoa-Hruks5qzlGkgaJpZM4H93xs
。

+1

@codeのミニマップを本当に見逃していない場合でも、選択する必要がある場合は、Atomのミニマップアプローチが本当に好きだと言えます（さらに、コードはOSです）。 コードのズームアウトバージョンではなく、概略図です。 これは賢い方法です。コード自体ではなく、コードのセクションをすばやく識別し、それを可能にする重要な要素（色、線の長さ、空白など）を視覚的に改善できるからです。

私が切り替える前に、これを待っているだけです。

また、git diffを表示して、現在の位置を強調表示することもできますか？

これに関するクイックアップデート：

現在、ソースコードの行のレンダリングは次のように機能します。

1.たくさんのスパンをレンダリングし、それぞれがクラス名として生成されたTMスコープを取得します。

<span class="token block ts meta arrow expr var leading whitespace" style="width:38.53125px">→&nbsp;&nbsp;&nbsp;</span>
<span class="token block ts meta other constant arrow expr var">TO_USER_SETTINGS_MAP</span>
<span class="token block ts meta arrow brace square expr array literal var">[</span>
<span class="token block ts meta variable other arrow object expr array literal var">KeyCode</span>
<span class="token block ts punctuation meta arrow accessor expr array literal var">.</span>
<span class="token block ts meta variable other arrow property expr array literal var">DownArrow</span>
<span class="token block ts meta arrow brace square expr array literal var">]</span>
<span class="token block ts meta arrow expr var">&nbsp;</span>
<span class="token block ts meta keyword operator arrow assignment expr var">=</span>
<span class="token block ts meta arrow expr var">&nbsp;</span>
<span class="token block ts punctuation definition string quoted single begin meta arrow expr var">'</span>
<span class="token block ts string quoted single meta arrow expr var">Down</span>
<span class="token block ts punctuation definition string quoted single end meta arrow expr var">'</span>
<span class="token block ts punctuation terminator statement meta arrow expr var">;</span>

2.TMテーマから多くのcssルールを生成します

.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.comment { color: rgba(117, 113, 94, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.string { color: rgba(230, 219, 116, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.constant.numeric { color: rgba(174, 129, 255, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.constant.language { color: rgba(174, 129, 255, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.constant.character { color: rgba(174, 129, 255, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.constant.other { color: rgba(174, 129, 255, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.variable {  }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.keyword { color: rgba(249, 38, 114, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.storage { color: rgba(249, 38, 114, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.storage.type { font-style: italic; color: rgba(102, 217, 239, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.entity.name.type.class { text-decoration: underline; color: rgba(166, 226, 46, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.entity.other.inherited-class { font-style: italic; text-decoration: underline; color: rgba(166, 226, 46, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.entity.name.function { color: rgba(166, 226, 46, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.variable.parameter { font-style: italic; color: rgba(253, 151, 31, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.entity.name.tag { color: rgba(249, 38, 114, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.entity.other.attribute-name { color: rgba(166, 226, 46, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.support.function { color: rgba(102, 217, 239, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.support.constant { color: rgba(102, 217, 239, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.support.type { font-style: italic; color: rgba(102, 217, 239, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.support.class { font-style: italic; color: rgba(102, 217, 239, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.support.other.variable {  }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.invalid { color: rgba(248, 248, 240, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.invalid.deprecated { color: rgba(248, 248, 240, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.meta.structure.dictionary.json.string.quoted.double.json { color: rgba(207, 207, 194, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.meta.diff { color: rgba(117, 113, 94, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.meta.diff.header { color: rgba(117, 113, 94, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.markup.deleted { color: rgba(249, 38, 114, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.markup.inserted { color: rgba(166, 226, 46, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.markup.changed { color: rgba(230, 219, 116, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.constant.numeric.line-number.find-in-files.-.match { color: rgba(174, 129, 255, 0.63); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.entity.name.filename.find-in-files { color: rgba(230, 219, 116, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.markup.quote { color: rgba(249, 38, 114, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.markup.list { color: rgba(230, 219, 116, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.markup.bold { color: rgba(102, 217, 239, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.markup.italic { color: rgba(102, 217, 239, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.markup.inline.raw { color: rgba(253, 151, 31, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.markup.heading { color: rgba(166, 226, 46, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.markup.heading.setext { color: rgba(166, 226, 46, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .monaco-editor-background { background-color: rgba(39, 40, 34, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .glyph-margin { background-color: rgba(39, 40, 34, 1); }
.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .monaco-workbench .monaco-editor-background { background-color: rgba(39, 40, 34, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token { color: rgba(248, 248, 242, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .cursor { background-color: rgba(248, 248, 240, 1); border-color: rgba(248, 248, 240, 1); color: rgba(7, 7, 15, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .token.whitespace { color: rgba(59, 58, 50, 1) !important; }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .lines-content .cigr { background: rgba(72, 71, 62, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .current-line { background-color: rgba(62, 61, 50, 1); border: none; }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .focused .selected-text { background-color: rgba(73, 72, 62, 1); }
.monaco-editor.vs-dark.vscode-theme-monokai-themes-Monokai-tmTheme .selected-text { background-color: rgba(73, 72, 62, 0.5); }

3.ブラウザに魔法をかけてもらいましょう:)

議論

これは非常に非効率的です。

• トークンごとにこれらすべてのスコープを格納する必要があります（メモリ使用量が多い-上下にスクロールすると、TMでトークン化するための呼び出しではなく、メモリルックアップ操作になります）
• これらすべてのスコープをペイントする必要があります（1行をレンダリングするにはHTMLの巨大なサイズを見るだけです）
• このすべてのCSSに一致するようにブラウザに圧力をかけます

これは、TMを使用していなかったときに実装されました。これは、一部のトークナイザーがまだ手動で作成され、他のトークン化機能がTMで行われる世界を作るための最良の方法でした。 json、css、less、scss、html、razor、handlebarsを拡張機能に移動し終えたので、再び最適化を開始できます:)。

次のようなモデルに変更したいと思います。

• トークンごとのスタイルをすぐに（トークン化が発生する場所の近くで）解決します
• それらのスタイルのみを保存します（これは、テーマを変更すると、キャッシュされたすべてのトークンが削除されることを意味します）
• それらのスタイルのみを使用してレンダリングします（たとえば、テーマ内のルールで選択されない場合はblockクラス名をレンダリングする必要はありません）、インライン化（​​つまり、 style="..." ）するか、カスタマイズされたものを生成できますクラス名（ブラウザが魔法をより速く実行するのに役立つと思われる短い一意の名前を使用）。

最後に、これにより、特定のトークンの色/太さ/強調をすばやく知ることができます。 次に、この情報を使用して、テキストの形状に近い長方形を（ <canvas>を使用して）ペイントできます。 長方形は、左から右であることが保証されているテキストに対してのみペイントできます（これは、数日後に追跡しているものです）。 Bi-Di / RTLテキストは、テキストレイアウトがブラウザによって行われ、完全にオフになるため、ミニマップを取得しません。 また、プロポーショナルフォントで何をすべきかについても疑問があります。

長い投稿で申し訳ありませんが、これは私たちのレーダーにあり、パフォーマンスの勝利の可能性があるため、さらに優先される可能性があることをお知らせしたいと思います。

+1

+1

+1

Githubには、親指を立てる方法があります。 それを使ってください。 +1は
本当にスレッドを乱雑にします。

2016年11月3日木曜日午前10時46分、Filiphe Vilar Figueiredo <
[email protected]>は次のように書いています：

+1

—
あなたが言及されたのであなたはこれを受け取っています。
このメールに直接返信し、GitHubで表示してください
https://github.com/Microsoft/vscode/issues/4865#issuecomment -258219634、
またはスレッドをミュートします
https://github.com/notifications/unsubscribe-auth/AA-JVK1A3zeRm0CUCePdrkPdqtRdbtMfks5q6h3ZgaJpZM4H93xs
。

これについて何か進展はありますか？ コミュニティは支援できますか？

+ 1、FFSでスレッドをスパムするのを止めてください。 この問題を追跡するときは、+ 1によってスパムされるのではなく、この機能の進捗状況に関する適切な情報を取得したいと考えています。 代わりに、元のコメントに賛成票を投じるか、UserVoiceに賛成票を投じてください。

MicrosoftEdgeやVisualStudioなどのブラウザーのように、マウスの中ボタンをクリックしてエディター内を移動できれば素晴らしいと思いました。 上下にスクロールするのは素晴らしいですが、左右にスクロールする方が大きいでしょう！ マウスの中ボタンをクリックして、上下左右のスクロールホイールを表示し、マウスを動かして画面内を移動できるようにしたいと思います。 Edgeで試して、私が話していることを正確に確認してください。

これを何か新しいものの下に投稿する必要がありますか？

+1はしません。票を下げるには、11月のビルド後にこの問題を解決してみてください。そうすれば、1月にこれを確認できます。これは、とても寂しいです。
更新：そして私も多くの反対票を獲得しますLOL

すべての@jschraubは、ます

私は、千行のコードを覗く方法がないという理由だけで、VSCodeと組み合わせてSublimeを使用しています。

よくわかりません。 チームは、関心を判断し、機能のリクエストに優先順位を付けるためにリアクションを使用していたようです...彼らは、前回のブログで「ホットエグジット」についても同様に言及しました。 それでも、現在600を超える「拡張スクロールバー」（私は信じています）はまだマイルストーンに移行していませんか？ では、どうしたのか、開発チームがこれについての私たちの見解を共有しないのはなぜですか？

それが価値があるために...これは私がAtomにとどまる主な理由の1つです... Atomのミニマップとそれのためのサードパーティのプラグインはただ素晴らしいです...それは間違いなく最高の実装を持っています（それのための完全なAPI）

これに関する更新

この機能を実装できるように取り組んでいます。

• 作業の一部はnextブランチのvscode-textmateで終了します-https：//github.com/Microsoft/vscode-textmate/tree/next
• これで、トークン化とテーマのマッチングの結果を（バイナリエンコード形式で）取得できるようになりました。 つまり、テーマ情報を取得できるトークナイザーからストレートカラーやフォントスタイルなどを取得しています（つまり、テーマの適用はCSSではなくコードで実行できます）
• この新しいフォーマットをvscodeで採用する必要があります。
  
  
  
  • つまり、他のトークン化プロバイダーにもこの新しい形式を採用する必要があります（textmate、monarch、manualの合計3つがあります）。 最後の2つは、 monaco-editorます。
  
  
  • スタンドアロンのエディタートークン.cssをクリーンアップして、JSデータ構造に変換できるようにします（https://github.com/Microsoft/vscode/commits/master/src/vs/editor/browser/を参照）。スタンドアロン/メディア/スタンドアロン-tokens.css）
  
  
  • monaco-languagesトークンの調整は、すべてクラシックスタイルのトークンを発行するようにすでに完了しています。
  
  

やるべきこと：

• [x]モナーク/手動トークナイザーを変換してJS（CSSではない）でテーママッチングを使用し、 vscode-textmateと同じバイナリ形式を生成します。
• [x]エディターモデルに新しいトークン化バイナリ形式を採用
• [x]エディタービューで新しいトークン化形式を採用
• [x]この機能の実装を開始します

TL; DR現在取り組んでいますが、派手なものにたどり着くまでに、内部で多くの作業が必要になることがあります。

ミニマップで強調表示されている選択肢と検索結果を機能として表示することを検討してください。

+1

今の状況はどうですか、誰かがplzを要約します。

これは本当にVisualStudioCodeに欠けているものです。

@charlesmilette ： "+1でスレッドをスパムするのをやめてください、FFS。この問題をフォローするときは、+ 1でスパムされるのではなく、この機能の進捗状況に関する適切な情報を取得したいと思います。元のコメントに対して賛成の反応を使用するか、代わりにUserVoiceに賛成票を投じてください。」

👍リアクションを使用してください。 +1はコメントしないでください。

+1

完全にトピックから外れていますが、+ 1の返信でスパムになった後、複数の理由でユーザーを非難することはできません。

• Githubモバイルバージョンにはリアクション用のUIがありません。それらを表示するには、デスクトップUIに切り替える必要がありました。
• コメントUIはページの下部にあり、リアクションUIは上部の最初の投稿に添付されています。 反応ショートカットをコメントUIに添付し、最初の投稿に自動的にリンクする必要があります。
• 「+1」の投稿は、単純な解析で自動的に検出され、リアクションに変換されるか、少なくともユーザーにそうするように提案する必要があります。
• Githubは、n文字以上の投稿の通知を受け取ることを提案する必要があります。

ミニマップ機能が開発中であると聞いて良かったです。これにより、崇高なテキストから転送した人は、vscodeにとどまる自信が増しました。

これが拡張機能として実装されない理由はありますか？ それが利用可能であれば、それは拡張機能にとって完璧なもののように思えます。

拡張は一時的な解決策であり、良い解決策ではありません。 本当に拡張機能を介して基本機能を個別にインストールしますか？ 最初にVScodeをダウンロードしてから、まったく連携しない可能性があるが、最も基本的な機能を提供するために必要となる30の拡張機能のリストを次に示します。 （1.コピー/貼り付けv3.0、2。タブ、3。自動インデント、4。タブストスペース、5。自動保存、6。カラー蛍光ペン、...... 28. birdeyeview_by_dx3ee_v1.0.1 ...）

このミニマップ関数の実装がAtomから切り替わるのを待っています。

@techsinこれは実際には基本的な機能ではありません。個人的な好みです。
しかし、私が見た限りでは、現時点では、APIはカスタム要素をそのような範囲でレンダリングすることを許可していないため、そのような拡張機能を作成しようとすることすら現実的ではありません。

@sapiraz同意します。テキストエディタには必須ではありませんが、Sublime Text（またはAtom）が非常に人気がある理由の1つでもあると思います。 それは人々を夢中にさせる「重要な」機能です！ 例として、すべてのエディターに黒いテキストと白い背景があり、新しいテキストエディターがそれをあなたの意志に変更する選択肢を提供するとします。 もちろん、これはテキストエディタの目的にとってそれほど重要ではありませんが、エクスペリエンスを大幅に向上させるため、人々は優れたエディタをこのエディタに任せる準備ができています。 そして、私はそれがここで起こっていることだと思います。 UXも不可欠です;）

UXは本質的であり、「これは正しくない」または「私は本当にそれが恋しい」と感じたときに感じる、良い経験と非常に迷惑な感覚を区別します。

これは、優れたショートカットと検索を使用することと同じです。 これらはコードに不可欠ですか？ 実際にはそうではありませんが、テキストエディタでコーディングできます...

ここで@sapirazに同意する必要があります。これは、多くの人にとって素晴らしい機能または重要な機能である可能性がありますが、基本的な機能とは言えません。 これまでのところ、Sublimeはこれをデフォルトとして持つ唯一のエディターであり（Atomではabe33による拡張です）、SublimeにはCodeが提供するスクロールバーの拡張機能がありません。

私にとって、速度と安定性ははるかに優れた機能であり、真に「基本的な」機能です。チームがこれを可能な限り最善の方法で実装することに取り組んでいる場合は、必要なときに常に提供します。

@ jfcartier 、 @ JonnyBGodもちろん、UXは重要です。
私も他のエディターのミニマップ機能が好きで、すぐにVSCodeで表示されることを望んでいます。しかし、それがそうでないものとは呼ばないでください-基本的な機能。

これらの機能は非常に重要であり、作業環境にそのような明らかな価値を追加するため、ショートカット、検索、コピー/貼り付け、さらには配色のサポートと実際に比較することはできません（はい、配色でさえ重要です-私は目の疲れに苦しんでいます明るい白い画面の前に1日9時間座っても、私の目には何の役にも立ちません）。一方、ミニマップは、なくてはならないほど重要なユーザビリティを提供しません。

ミニマップがどのような価値をもたらすのかと誰かに尋ねられたら、「見栄えが良い」以外の良い議論を思い付くことができますか？ できませんでした。
繰り返しになりますが、私はこの機能が大好きです。Sublimetext＆Atomを使用した後、自分がどこにいるかを少しだけ把握するために、この機能を横に置くのが本当に好きでした。 しかし、それは必要ですか？ いいえ。
あなたはスクロールするができます、あなたは現在のスクロールバーにいくつかのヒントを見ることができます、なぜあなたのコードを小さな読めないバージョンで見ることがあなたにとって役立つのですか？

私は現在、複数のプロジェクトでVSCodeを使用していますが、他の最新のエディターが持つ実際の基本機能が不足しているため、VSCodeを選択しました。その中には、パフォーマンスと安定性（ehem、Brackets）、多言語サポート（Sublime）、 Web言語とIntellisense（申し訳ありませんがAtom）、またはネイティブで使いやすい拡張インストーラー（ここでもSublime）

ミニマップがどのような価値をもたらすのかと誰かに尋ねられますが、「見栄えが良い」以外の良い議論を思い付くことができますか？

はい。 これは、大きなファイルをナビゲートするのに実質的に役立ちます。 少なくともそれが私がそれをとても心から恋しく思う理由です。

@fredrikaverpil私の意見では「実質的に」は少し誇張ですが、確かに。
それでも、検索やコピー/貼り付けと実際に比較することはできません。

@fredrikaverpil大きなファイルをナビゲートする他の便利な方法があります。 @sapirazは、これが基本的な機能ではなく、真に基本的な機能（貼り付けの自動インデントなど）と比較するのが

そうは言っても、私たちはこれを何らかの方法で利用できるようにしたいということに_すべて_同意できると思います。

このスレッドはひどい方向に進んでいます。現時点でVSCodeで見逃している機能のようです。 もしそうでなければ素晴らしい次のバージョンで実装できれば、それは残念ですが、私は対処しようとします。

@sapiraz私はあなたの議論に完全に同意し、ただ反論するためだけに彼らを反駁するつもりはありません。 しかし、しかしあります（そしてこれはここでの私の最後の投稿です、十分なスパム笑）

「見栄えがいい」以外の良い議論を思い付くことができますか？ できませんでした。
..。
なぜあなたのコードを小さな読めないバージョンで見ることがあなたにとって有用なのですか？

あなたはそれをそのように見ないので、それが役に立たないとは言わないでください。 通常、何かが役立つかどうかを判断するために、統計は大いに役立ちますが、私には統計がないので、これだけのためにVSを使用しないすべての人々（私を含む）にのみ頼ることができます！ それは何でもありません。 もちろん、それが明らかに変化への抵抗であることに私たちは皆同意すると思いますが、それでも私たちはそれが私たちにとって有用であり、個人的な判断によってその重要性を下げることはあまり科学的ではないと言います。

私が引数を提供できる場合。 これが1つです：

（精度）コードを知っているので、Dbクエリをその形状によって変更したことがわかります。
（スピード）ワンクリックでそこにたどり着きます。 巻物はありません。
（UX）大きなファイルで作業する場合、それは大いに役立ちます。 それはすべてをコントロールする感覚を与えるので、あなたは検索する必要はありません。

2月の反復計画＃20021でこの機能を見ることができてとてもうれしいです。

3月の初めにこの機能に対応します
仕事ありがとうございます@all

出荷されると、ユーザーはこれを完全に無効にできますか？

別の小さなビューをレンダリングするためだけに、パフォーマンスをある場所から別の場所に移動させてもかまいません。

/ 、 ?検索に固執します。必要なものはすべて揃っているからです。

ミニマップの場合は+1。 Rly w8ing

インサイダーバージョンではすでに利用可能になっているようですが、
ただし、設定で有効にする必要があります。「editor.minimap.enabled」をtrueに設定してください:)

インサイダー版でミニマップを試してみましたが、見栄えがいいです！

いくつかの提案：

• スクロールバーをクリックしてドラッグするのと同じように、ウィンドウ領域をクリックしてドラッグできるようにしたいと思います。
• editor.minimap.width設定をミニマップが少し広すぎます。

PS：パフォーマンスは素晴らしいです、皆さんに称賛を！

Sublimeでは、ハイライトされていても、highlighが非常に小さいため、ファイル全体を確認する必要があるため、ミニマップでハイライトが実際に表示されることを確認してください（検索関数の実行など）。

聞いてくれてありがとう😄

上と下にスクロールできるといいでしょう...（Sublimeのように）
現時点ではそれをクリックするだけのようです:-(

素晴らしい仕事です-大いに感謝します！

午前21時20分に2017年2月19日には、ムラデンミハイロビッチ[email protected]
書きました：

ハイライトがミニマップに実際に表示されていることを確認してください（
検索機能を実行している）Sublimeであるため、
強調表示されているように、highlighは非常に小さいので、ほとんど行かなくてはなりません。
とにかくファイル全体を通して...

聞いてくれてありがとう😄

—
このスレッドにサブスクライブしているため、これを受け取っています。
このメールに直接返信し、GitHubで表示してください
https://github.com/Microsoft/vscode/issues/4865#issuecomment-280949966 、
またはスレッドをミュートします
https://github.com/notifications/unsubscribe-auth/AATV7DaFs9W2PNnpIYzmSIQQqaIDv60Sks5reLIJgaJpZM4H93xs
。

オーバーレイマスクをクリック/ドラッグしてスクロールできること。 アトム、崇高なテキスト、角かっこ、geanyなどと同じ

倍率を調整することはできますか？ 作業内容に応じて、フォントサイズを大きくしたり小さくしたりしたい場合があります。

この機能のリクエストについて、今しばらくお待ちいただきますようお願いいたします。

基本

• VisualStudioとは異なるミニマップジオメトリを使用しました。
• 2つのグレースケール「フォント」を出荷します。1つは文字が4x2（4pxの高さと2pxの幅-略してx2 ）で、もう1つは文字が2x1（2pxの高さと1pxの幅-略してx1 ）。
• devicePixelRatioまたはズームレベルに基づいて、 x2またはx1ミニマップフォントのいずれかを選択します。 つまり、網膜デバイスまたは他の高ピクセル比デバイス（Surface Booksなど）では、 x2フォントはzoomLevel 0で選択されますが、他のデバイスではx2フォントが選択されます。 zoomLevel 4以上を使用する場合にのみ選択されます。
• これは、ラインがミニマップで4pxまたは2pxの固定量の垂直画面領域を取得することを意味します。
• ファイルにミニマップに収まるよりも多くの行がある場合、ミニマップはスクロールします：

フォントに関する注意

• ミニマップの各文字は、これらのx2またはx1フォントに従ってペイントされます
• これが800％ズームのx2フォントです。 あなたはそこにあるものを読むことができます：

• あなたがそれに情熱を感じているなら、私はこれらのフォントを微調整するのにあなたの助けを借りたいです。 彼らはここに住んでい

試してみる

インサイダーチャンネルの"editor.minimap.enabled": true

何が行われたか

文字/トークンのレンダリングコードは、出荷するのに十分な形（パフォーマンス）です。前のフレームのピクセルが必要に応じて次のフレームにコピーされるため、ミニマップのレンダリングにかかる​​時間はほとんど1ミリ秒未満です。 特定の条件下（縮小された単語でラップされたファイル、別の垂直位置へのジャンプなど）では、最大で数十ミリ秒かかる場合がありますが、全体として、charレンダリングコードにはある程度満足しています。

やるべきこと

やるべきことはたくさん残っています。 ほんの数例を挙げると：

• ミニマップ：ミニマップスライダーのドラッグを実装します。 ＃20935
• ミニマップ：2x1フォントに不規則性が多すぎる＃20929
• ミニマップ：幅を最大150pxに制限します＃20931
• ミニマップ：ミニマップ内の文字より多くをレンダリングする＃20934
• ミニマップ：文字の代わりにブロックをレンダリングするオプションを追加＃20947

より多くの時間を費やす問題もあれば、より困難な問題もあります（たとえば、ミニマップの外側のエラーがどこかにペイントされた場合、ミニマップに概要定規の必要性を引き継がせることができますかなど）。

ミニマップに関連するすべての問題をeditor-minimapというラベルで追跡します。この時点で、この問題を解決したいと思います。

さまざまな側面をカバーする特定の問題についての議論を続けましょう。そのうちのいくつかは2月に成立しますが、他の問題については後で取り組みます。

@alexandrudima

このコメントはどうですか？ https://github.com/Microsoft/vscode/issues/4865#issuecomment -255368352

私は小さな読めないテキストよりもそれを好み、それは私が必要とする情報を提供します。 それがどれほど難しいかはわかりませんが、その音によって、すべての文字が空白を除いた正方形の塗りつぶしである新しいフォントを作成することができます。

@ sprinkle131313別の問題へのコメントを抽出しました-＃20947。

特定の個別の問題について引き続き議論しましょう。既存の問題が見つからない場合は、新しい問題を自由に作成してください。 私は、特定の議論に全員が参加できるように、上記のコメントをリンクで更新し続けます。

ありがとうございました！ それが安定しているのを見て喜んで！

質問：ミニマップをカーソルにすることは可能ですか？ これはVSのデフォルトの動作であり、これが2つのアプリの主な違いであると私は考えています。 また、テストするためにinsidersバージョンをインストールしたことにも注意してください

_編集_
気にしないでください、そのための未解決の問題＃20935があることに気づきました

@ alexandrudima ＃ "editor.minimap.renderCharacters": falseを使用することは可能ですか？ IMOは見た目がはるかに美しく、使い勝手も優れています。

テキストまたはブロックを超えたときにズームできるようにしたいと思います（ファイナルアプローチによって異なります）。 現在、私は何も読むことができず、コードのどの部分にいるのかわかりません。これは、大きなコードで作業している場合に役立ちます。
また、クリックを続けてミニマップ上をスクロールまたは移動しようとしても何も起こらない場合は、クリックを停止してコードの別のセクションを選択する必要があることもわかりました。

@FANMixco私はあなたの請願について考えていましたが、ミニマップをクリックすると、カーソルを動かさずにコードがそのポイントまでスクロールされるため、そのような機能が必要な理由は現在わかりません。事実上同じです。ホバー/ズームとして。 おそらく、ホバリングはクリックよりも効率的ですか？

@ druellan 、 @ FANMixcoは、以下に示すように、通常のVisualStudioにすでに搭載されているミニマップズーム機能について話していると思います。

編集
ズームがミニマップ上に2秒間留まった後にのみ表示されることを忘れました。 ミニマップに目を通し、スクロールを開始すると、ズームは表示されません。実際には、スクロールを停止して2秒待ってから表示する必要があります。

@ghiscodingが@FANMixco機能について

@ghiscodingに感謝し

@pohmelieの提案については、私は完全に同意しますが、これは、スクロールバー/ミニマップのctrl + hoverなどのショートキー修飾子にアタッチして、関数をトリガーすることもできると思います。

@druellanこれもAtomのhttps://atom.io/packages/minimap-codeglance拡張機能と同じです。 11,000のダウンロードは、多くの人々がそれを好き/必要としていることを示唆しているようです。

個人的にはしていませんので、実装する場合はオプションにしてください。 トリガー/ホットキーメカニズムは、特にスクロールバーとミニマップに実装されている場合は、良好に聞こえます。

トグルサイドバー（ctrl-b）トグルパネル（ctrl-j）のように切り替える方法はありますか？

新しいミニマップが好きです。 私が見逃していることの1つは、searchまたはfind-duplicatesで見つかったテキストの強調表示です。 その問題を視覚化するために、2つのスクリーンショットを添付しました。

素敵な機能の人！

💃

@sixenviリクエストは私のものと非常によく似ており、未解決の問題であるため、少なくとも追跡されているため、私が尋ねた別の機能リクエスト＃ 21404に追加することをお勧めします。

VSCodeチームが、ここにあるような、クローズされた問題に関するコメントやリクエストを読んだかどうかはわかりません。

こんにちは@druellan ！ ええ、 @ ghiscodingが私が意味したことです。少し混乱しているので、時間について設定できるかもしれません。

皆さんこんにちは！ VS Codeが1つの機能を見逃した場合、それはこれであり、今では完全です！ そのような素晴らしい実装と素晴らしいパフォーマンス。 （ @alexandrudimaいつものようにあなたは私を魅了します！）

私が気付いたただ一つの簡単なこと：

良い発見。 これはクローズされているので、新しいバグを報告する必要があると思います。 Vscodeチーム
見えないかもしれません。

7:51 Pouya Karyので金、2017年3月3日に[email protected]書きました：

皆さんこんにちは！ VS Codeが1つの機能を見逃した場合、それはこれであり、
私が望んでいたことは何もありませんでした！ そのような素晴らしい実装と素晴らしい
パフォーマンス。 （いつものようにあなたは私を魅了します！）

私が気付いたただ一つの簡単なこと：

[画像：画面外スクロール]
https://cloud.githubusercontent.com/assets/2157285/23557582/c264e420-0045-11e7-9ea6-8789f30db9de.gif

—
あなたが言及されたのであなたはこれを受け取っています。
このメールに直接返信し、GitHubで表示してください
https://github.com/Microsoft/vscode/issues/4865#issuecomment-283990000 、
またはスレッドをミュートします
https://github.com/notifications/unsubscribe-auth/AA-JVANXdhu57m4hlAODRcV6qhsNGzgrks5riDb3gaJpZM4H93xs
。

@nojvekああ気づかなかった！ もう1つ問題があります...

もう1つ素晴らしいと思います。ミニマップで現在の位置を非表示にしないでください（現在、マウスオーバーでのみ表示されます）。

おそらく、このための設定にもう1つのキーがあるのが最善でしょう。

@Andrfasこれは＃21404と＃21784で追跡されます。

提案として、あなたたちはもう追跡されていないクローズドイシューへの書き込みをやめ、新しいイシューを検索/オープンする必要があります。

スクロールバーボタンが欲しいです。

端にマウスオーバーしたときにのみマップまたはスクロールバーを表示させることはできますか？

@gauravsainiこれはクローズドな問題です

古いバージョンを使用する方法はありますか？ 私のオンラインコースの1つで、教師はマップを使用し、コードブロックを分類しました。コードが非常に多いため、サイドバーではまったく読み取れません。そのため、コードの表示を無視する方がはるかに優れていますが、コードはコードで分類されています。ブロック。

@deadmannミニマップをオフにしたい場合は、設定に移動して次を見つけてください。

// Controls if the minimap is shown
  "editor.minimap.enabled": true,

そして、それをfalseに設定します。 古いバージョンに戻す必要はありません。

@deadmannミニマップをオフにしたい場合は、設定に移動して次を見つけてください。

//ミニマップを表示するかどうかを制御します
"editor.minimap.enabled"：true、
そして、それをfalseに設定します。 古いバージョンに戻す必要はありません。

ミニマップが欲しいのですが、実際には私がそれをアクティブにしましたが、コードが大きくなり、長い行がある場合は、より単純な形式でミニマップを見るのは簡単ではありません。本当にこれを読んだ？

私はそれを見つけました、私たちが大きなプロジェクトを持っていた別のシステム、それが現れた場合、それはそのプラットフォームで異なるバージョンのVSを使用している可能性がある、またはファイルが長くなりすぎたためです。 しかし、それは私が画像に示しているものです。