How to get an outline view in sublime texteditor?

Development EnvironmentText EditorSymbolsOutlineSublimetext

Development Environment Problem Overview


How do I get an outline view in sublime text editor for Windows?

The minimap is helpful but I miss a traditional outline (a klickable list of all the functions in my code in the order they appear for quick navigation and orientation)

Maybe there is a plugin, addon or similar? It would also be nice if you can shortly name which steps are neccesary to make it work.

There is a duplicate of this question on the sublime text forums.

Development Environment Solutions


Solution 1 - Development Environment

Hit CTRL+R, or CMD+R for Mac, for the function list. This works in Sublime Text 1.3 or above.

Solution 2 - Development Environment

A plugin named Outline is available in package control, try it! https://packagecontrol.io/packages/Outline

Note: it does not work in multi rows/columns mode. For multiple rows/columns work use this fork: https://github.com/vlad-wonderkidstudio/SublimeOutline

Solution 3 - Development Environment

I use the fold all action. It will minimize everything to the declaration, I can see all the methods/functions, and then expand the one I'm interested in.

Solution 4 - Development Environment

I briefly look at SublimeText 3 api and view.find_by_selector(selector) seems to be able to return a list of regions.

So I guess that a plugin that would display the outline/structure of your file is possible.

A plugin that would display something like this:

code outline

> Note: the function name display plugin could be used as an inspiration to extract the class/methods names or ClassHierarchy to extract the outline structure

Solution 5 - Development Environment

If you want to be able to printout or save the outline the ctr / command + r is not very useful. One can do a simple find all on the following grep ^[^\n]*function[^{]+{ or some variant of it to suit the language and situation you are working in.

Once you do the find all you can copy and paste the result to a new document and depending on the number of functions should not take long to tidy up.

The answer is far from perfect, particularly for cases when the comments have the word function (or it's equivalent) in them, but I do think it's a helpful answer.

With a very quick edit this is the result I got on what I'm working on now.

    PathMaker.prototype.start = PathMaker.prototype.initiate = function(point){};
    PathMaker.prototype.path = function(thePath){};
    PathMaker.prototype.add = function(point){};
    PathMaker.prototype.addPath = function(path){};
    PathMaker.prototype.go = function(distance, angle){};
    PathMaker.prototype.goE = function(distance, angle){};
    PathMaker.prototype.turn = function(angle, distance){};
    PathMaker.prototype.continue = function(distance, a){};
    PathMaker.prototype.curve = function(angle, radiusX, radiusY){};
    PathMaker.prototype.up = PathMaker.prototype.north = function(distance){};
    PathMaker.prototype.down = PathMaker.prototype.south = function(distance){};
    PathMaker.prototype.east = function(distance){};
    PathMaker.prototype.west = function(distance){};
    PathMaker.prototype.getAngle = function(point){};
    PathMaker.prototype.toBezierPoints = function(PathMakerPoints, toSource){};
    PathMaker.prototype.extremities = function(points){};
    PathMaker.prototype.bounds = function(path){};
    PathMaker.prototype.tangent = function(t, points){};
    PathMaker.prototype.roundErrors = function(n, acurracy){};
    PathMaker.prototype.bezierTangent = function(path, t){};
    PathMaker.prototype.splitBezier = function(points, t){};
    PathMaker.prototype.arc = function(start, end){};
    PathMaker.prototype.getKappa = function(angle, start){};
    PathMaker.prototype.circle = function(radius, start, end, x, y, reverse){};
    PathMaker.prototype.ellipse = function(radiusX, radiusY, start, end, x, y , reverse/*, anchorPoint, reverse*/ ){};
    PathMaker.prototype.rotateArc = function(path /*array*/ , angle){};
    PathMaker.prototype.rotatePoint = function(point, origin, r){};
    PathMaker.prototype.roundErrors = function(n, acurracy){};
    PathMaker.prototype.rotate = function(path /*object or array*/ , R){};
    PathMaker.prototype.moveTo = function(path /*object or array*/ , x, y){};
    PathMaker.prototype.scale = function(path, x, y /* number X scale i.e. 1.2 for 120% */ ){};
    PathMaker.prototype.reverse = function(path){};
    PathMaker.prototype.pathItemPath = function(pathItem, toSource){};
    PathMaker.prototype.merge = function(path){};
    PathMaker.prototype.draw = function(item, properties){};

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
Questionuser89021View Question on Stackoverflow
Solution 1 - Development EnvironmentCory PetoskyView Answer on Stackoverflow
Solution 2 - Development EnvironmentElianView Answer on Stackoverflow
Solution 3 - Development EnvironmentEnmanuel RiveraView Answer on Stackoverflow
Solution 4 - Development EnvironmentName is carlView Answer on Stackoverflow
Solution 5 - Development EnvironmentTrevorView Answer on Stackoverflow