Como obter uma visão de contorno em um editor de texto sublime?

117

Como obtenho uma visão geral no editor de texto sublime para Windows?

O minimapa é útil, mas sinto falta de um esboço tradicional (uma lista selecionável de todas as funções em meu código na ordem em que aparecem para navegação e orientação rápidas)

Talvez haja um plugin, addon ou similar? Também seria bom se você pudesse nomear rapidamente quais etapas são necessárias para que isso funcione.

Há uma duplicata desta pergunta nos fóruns de texto sublime.

user89021
fonte
Eu adicionei um pedido de recurso para SublimeText 3. Sinta-se à vontade para votar nele.
nome é carl

Respostas:

266

Pressione CTRL+ Rou CMD+ Rpara Mac para a lista de funções. Isso funciona em Sublime Text 1.3 ou superior.

Cory Petosky
fonte
Parece bom. Mas nada acontece quando pressiono ctrl-r. Tenho um arquivo php aberto. Posso localizar o comando em um menu? Isso funciona sem um plugin? karlthorwald
user89021
6
Ctrl + r existe na versão beta atual ( sublimetext.com/beta ), mas não na 1.2
jskinner
1
Isso é incrível e eu realmente estava sentindo falta da visão geral do Eclipse. Honestamente, isso é muito melhor, embora eu desejasse que houvesse uma maneira de fazer com que ele puxasse apenas as funções principais e não as funções de retorno de chamada / sucesso.
Michael BW
1
A lista não está ordenada, infelizmente. Sinto falta de ter a visão de esboço do Eclipse com uma lista ordenada de funções.
scorpiodawg
1
Algum progresso adicional em uma visão de contorno real, como o que está disponível nos editores Eclipse e Oxygen? O que está faltando com ctrl + r é que não há indicação do que foi delineado se é uma variável ou uma função semelhante.
kstubs
17

Eu uso o fold all action. Isso vai minimizar tudo para a declaração, posso ver todos os métodos / funções e, em seguida, expandir o que estou interessado.

Enmanuel Rivera
fonte
10
No menu ST 3: Edit-Code Folding-Fold All. Atalho Ctrl + k, 1. Ctrl-k, j para desfazer
wolfstevent
16

Um plugin chamado Outline está disponível no controle de pacote, experimente! https://packagecontrol.io/packages/Outline

Nota: não funciona no modo de várias linhas / colunas. Para trabalhar com várias linhas / colunas, use esta bifurcação: https://github.com/vlad-wonderkidstudio/SublimeOutline

Elian
fonte
2
Observação: para sair da visualização de esboço, clique no pequeno botão Fechar na guia Esboço e, em seguida, pressione Shift+ Alt+ 1ou vá para Exibir -> Layout -> Único. Para abri-lo novamente, use Ctrl+ Shift+ Pe pesquiseBrowse Mode: Outline
Gabriel Staples
8

Eu dou uma olhada rápida na api SublimeText 3 e view.find_by_selector(selector)parece ser capaz de retornar uma lista de regiões.

Portanto, acho que é possível um plugin que exiba o esboço / estrutura do seu arquivo.

Um plug-in que exibiria algo assim:

esboço de código

Nota: o plugin de exibição do nome da função pode ser usado como uma inspiração para extrair os nomes das classes / métodos ou ClassHierarchy para extrair a estrutura de tópicos

Nome é carl
fonte
0

Se você quiser imprimir ou salvar o esboço, ctr / command + r não é muito útil. Pode-se fazer uma localização simples no grep a seguir ^[^\n]*function[^{]+{ ou em alguma variante dele para se adequar à linguagem e situação em que você está trabalhando.

Depois de fazer a localização de tudo, você pode copiar e colar o resultado em um novo documento e, dependendo do número de funções, não deve demorar muito para limpar.

A resposta está longe de ser perfeita, principalmente para os casos em que os comentários contêm a palavra função (ou equivalente), mas acho que é uma resposta útil.

Com uma edição muito rápida, este é o resultado que obtive no que estou trabalhando agora.

    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){};
Trevor
fonte