I would like to build a plugin where I put a Chart or a Tree component for people to drag and drop and use/build their own flows. Is this possible to build in VS Code? Are there any examples or documents on how to do that?
Yes, that's possible. You can use a WebView instance to show graphical output (written in HTML). In my vscode extension (https://github.com/mike-lischke/vscode-antlr4) I display a visual parse tree using D3.js:
In the graphic you can collapse nodes, zoom in/out, move the viewport with the mouse and more.
Related
I was watching a video about a flutter project in vs code, and I saw that the developer used an extension to group sections of widgets and its childs with a dashed-vertical-line on the left side. Does anyone know what extension is used here?
That is not an extension. This is from VS code settings. Go to settings and search for FLUTTER UI you will get two options as shown in image. Select both option and restart your vs code. You will get broken line tree as you want.
I am writing a small tools for VS Code and the tool will need to draw arrows between symbols in the code.
Something along these lines.
Please forgive my skills with Paint.
What it is the best way to achieve this effect in VS Code?
What you want is not possible. The editor output in vscode is a list of DOM nodes (divs for the lines, spans for the syntactic elements). You cannot draw lines between DOM nodes.
If you had full control over the editor you could add an overlay over the entire text to draw the lines, but then you have to take care not to disturb the normal behavior of the editor and, after all, you don't have that kind of control.
A webview is not a good approach, as it would not only require to duplicate the work the normal editor does, it's also isolated and has no direct access to the main application, which means actions, language server support etc. don't work
yes sure use this Rainbow Brackets
its draw an arrow between the start and the end .
enter image description here
I have been trying numerous editors, from Inkscape, to online converters, to MS store apps, etc.
All I'm trying to do is find an easy way to create either transparent PNG files or SVG files for the activitybar icon inside of VS Code for an extension I'm working on.
Everything I've tried either totally warps the dimensions of what I create and seems to blow the image way up inside the activity bar, even though the files I'm saving as PNG are all 128px x 128px with 32 bit depth, same as another that ships with examples from https://github.com/Microsoft/vscode-extension-samples/tree/master/tree-view-sample
What I see in VS Code after specifying the path in the extension package.json:
What I am trying to get it to look like:
I've tried using SVG viewer plugins for VS Code as well, and sometimes the SVG's I've used don't even show up, even though an item does exist in the activity bar when I hover over the position it should be in.
Any modicum of help would be appreciated.
Is it possible to make an extension that draw lines on the background? You can decorate a lot of thing but I can't find a way to draw colored lines.
I would like to see the flow of my data (inspired by visual programming).
Something like that (but the like drawn under the text) :
Keep in mind vscode is an add-on to Electron, which is a webbrowser in a desktop raiment. So what you see are webpages and hence everything what's possible on a webpage (with a node.js basement) is also possible in vscode - at least in theory. I say "in theory" because after all vscode is a text editor and limits interaction in a way that supports this goal. So, what you can is either some drawing/graphics or add extensions that work in normal editor pages. You certainly don't want to write your own text editor interface within vscode.
I want a write a desktop application using GTKMM. I want the interface to be made of different panels like in Eclipse you have the Project Explorer, Console, Properties, etc. You should be able to drag the panels to change their position, close them and popout them (not sure if you can popout the panels in Eclipse but you can do it in Visual Studio).
I am using the word panels here as I am not sure what the right term is. I guess some call it dockable windows.
Any pointers on how this can be achieved in GTKMM?
The term is "docking" widgets and the GDL Library is the easiest way to get started with that. You may have seen GDL in action in applications like Anjuta and Inkscape. The documentation isn't that great, but, the source code includes a sample app and once you get going with it it's not that hard.
Basically, you add your widgets to a DockItem and those to a Dock. You put a DockBar somewhere in your application to which the docked items can be minimized. You can save and load the dock "layout" to XML files so that the user doesn't have to re-arrange the dock items every time they start the application.