Visual studio can place space between if and (:
if you write if( it will autocorrect it to if ( - with space. Same with for and while
Can you do such thing in sublime?
You can install HTML-CSS-JS Prettify package.
Go to Preferences > Package Settings > HTML-CSS-JS Prettify > Prettify Preferences - Default
Then search for space_before... options to adapt to what you need.
In your case, probably you want this:
// Should the space before conditional statement be added, "if(true)" vs "if (true)"
"space_before_conditional": true,
Ctrl + Shift + H is the default key binding to run these customized settings.
This is my solution for this in ST3.
From the menu, choose Tools -> Developer -> New Snippet...
It will generate a file like this (delete comments for simplicity of explanation):
<snippet>
<content><![CDATA[
Hello, ${1:this} is a ${2:snippet}.
]]></content>
<tabTrigger>hello</tabTrigger>
<scope>source.python</scope>
</snippet>
Save this file as my_snippet.sublime-snippet.
Now, every time you open some .py file, typing hello followed by TAB, it will generate line:
Hello, this is a snippet.
with this and snippet being editable. You can learn more about snippets at here.
P.S.
The defined snippet for if statement in Javascript for example is:
<snippet>
<content><![CDATA[
if (${1:true}) {${0:$TM_SELECTED_TEXT}}
]]></content>
<tabTrigger>if</tabTrigger>
<scope>source.js</scope>
<description>if</description>
</snippet>
You can create your custom one, just name it differently and set trigger to be different from if + TAB
Related
Updating my Sublime Text 3, Emmet's comment filter (|c) is no longer expanding in HTML files.
Typing .div_class and hitting tab will expand to:
<div class="div_class"></div>
But typing .div_class|c and hitting tab will result in:
.div_class|<!-- -->
This has meant that I've been using VS Code for templating recently, but as VS Code doesn't have the option of full or partial word selection if the word uses underscores as separators, I'd rather stick with Sublime Text.
Pipe filters are no longer supported in new Emmet version. Instead, you should features like tag commenting in preferences. In Sublime Text, go to Preferences > Packages Settings > Emmet > Settings and set "comment": true.
Alternatively, you can enable "tag_preview" instead to display tag info when caret is inside closing tag: https://github.com/emmetio/sublime-text-plugin#tag-preview
I want to be able to make <%= %> by pressing '=' and 'tab' like in Atom. I downloaded ERB snippets package but it uses other keys in order to make that shortcut. How do I change this?
In Sublime isn't so simple as in Atom, they don't store in the same file, but in a folder within your User configuration as different files, to do it just go to Tools->Developer->New Snippet, and you'll see a new tab:
<snippet>
<content><![CDATA[
Hello, ${1:this} is a ${2:snippet}.
]]></content>
<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
<!-- <tabTrigger>hello</tabTrigger> -->
<!-- Optional: Set a scope to limit where the snippet will trigger -->
<!-- <scope>source.python</scope> -->
</snippet>
All that's between the CDATA is the body of your snippet, and is what you'll see on the editor and where you'll define the pointer position, the code block, and a "placeholder" message, try this way:
<%= ${1:your_awesome_code} %>
Those are the common erb markers, and what's inside is what you'll see when you press tab or select the snippet, the ${} is to open and close the statement, the 1 inside is a field and is telling that it'll be the first thing you'll have under the cursor, because you can assign this same way one or more fields with or without "placeholders", as you want, the : will divide it from "order" and "what you'll get", this way, when you use it you'll have:
<%= your_awesome_code %>
The whole phrase on the cursor, then you can easily erase it and keep coding (it was just an example)
Then within the <tabTrigger> tag you declare the shortcut to select the snippet, in this case will be the = character, so:
<tabTrigger>=</tabTrigger>
Now when you type = on Sublime and hit the tab key the code you defined as snippet will appear on your editor, if it's the only one setted with =, if there are two or more you'll have the opportunity to choose between any of them.
And additional you can set the scope that's to say, that snippet will only appear in files that are recognized by Sublime as the file extension of that language.
Here is a cheat sheet https://www.cheatography.com/tdeyle/cheat-sheets/sublime-text-3/. Hopefully, this helps. I love Sublime, but it takes some time to learn how to use the keystrokes.
If they keystrokes aren't working at all, perhaps try to restart Sublime. Also the free version may have more limits than the purchased one just as a note.
I've got some poorly-formatted HTML code that I'd like to reformat. Is there a command that will automatically reformat HTML code in Sublime Text 2 so it looks better and is easier to read?
You don't need any plugins to do this.
Just select all lines (CTRL+A) and then from the menu select Edit → Line → Reindent.
This will work if your file is saved with an extension that contains HTML like .html or .php.
If you do this often, you may find this key mapping useful:
{ "keys": ["ctrl+shift+r"], "command": "reindent" , "args": { "single_line": false } }
If your file is not saved (e.g. you just pasted in a snippet to a new window), you can manually set the language for indentation by selecting the menu View → Syntax → language of choice before selecting the reindent option.
There are half a dozen or so ways to format HTML in Sublime. I've tested each of the most popular plugins (see the writeup I did on my blog for full details), but here's a quick overview of some of the most popular options:
Reindent command
Pros:
Ships with Sublime, so no plugin install needed
Cons:
Doesn't delete extra blank lines
Can't handle minified HTML, lines with multiple open tags
Doesn't properly format <script> blocks
Tag
Pros:
Supports ST2/ST3
Removes extra blank lines
No binary dependencies
Cons:
Chokes on PHP tags
Doesn't handle <script> blocks correctly
HTMLTidy
Pros:
Handles PHP tags
Some settings to tweak formatting
Cons:
Requires PHP (falls back to web service)
ST2 only
Abandoned?
HTMLBeautify
Pros:
Supports ST2/ST3
Simple and no binaray dependencies
Support for OS X, Win and Linux
Cons:
Chokes a bit with inline comments
Does not expand minimized or compressed code
HTML-CSS-JS Prettify
Pros:
Supports ST2/ST3
Handles HTML, CSS, JS
Great integration with Sublime's menus
Highly customizable
Per-project settings
Format on save option
Cons:
Requires Node.js
Not great for embedded PHP
Which is best?
HTML-CSS-JS Prettify is the winner in my book. Lots of great features, not much to complain about.
The only package I've been able to find is Tag.
You can install it using the package control. https://sublime.wbond.net
After installing package control. Go to package control (Preferences -> Package Control) then type install, hit enter. Then type tag and hit enter.
After installing Tag, highlight the text and press the shortcut Ctrl+Alt+F.
I recommend this plugin: HTML/CSS/JS Prettify, It really works.
After the installation, just select the code and press CTRL+SHIFT+H.
Done!
Just a general tip. What I did to auto-tidy up my HTML, was install the package HTML_Tidy, and then add the following keybinding to the default settings (which I use):
{ "keys": ["enter"], "command": "html_tidy" },
this runs HTML Tidy with every enter. There may be drawbacks to this, I'm quite new to Sublime myself, but it seems to do what I want :)
Altough the question is for HTML, I would also additionally like to give info about how to auto-format your Javascript code for Sublime Text 2;
You can select all your code(CTRL+A) and use the in-app functionality, reindent(Edit -> Line -> Reindent) or you can use JsFormat formatting plugin for Sublime Text 2 if you would like to have more customizable settings on how to format your code to addition to the Sublime Text's default tab/indent settings.
https://github.com/jdc0589/JsFormat
You can easily install JsFormat with using Package Control (Preferences -> Package Control) Open package control then type install, hit ENTER. Then type js format and hit ENTER, you're done.
(The package controller will show the status of the installation with success and errors on the bottom left bar of Sublime)
Add the following line to your key bindings (Preferences -> Key Bindings User)
{ "keys": ["ctrl+alt+2"], "command": "js_format"}
I'm using CTRL+ALT+2, you can change this shortcut key whatever you want to. So far, JsFormat is a good plugin, worth to try it!
Hope this will help someone.
For me, the HTML Prettify solution was extremely simple. I went to the HTML Prettify page.
Needed the Sublime Package Manager
Followed the Instructions for installing the package manager here
typed CMD+SHIFT+P to bring up the menu
Typed prettify
Chose the HTML prettify selection in the menu
Boom. Done. Looks great
There's a plugin called SublimeHtmlTidy which works pretty well
https://github.com/welovewordpress/SublimeHtmlTidy
Simply go to
Edit -> Tag -> Auto-format tags on document
I created a Package called HTMLBeautify that does a decent job of reformatting HTML. I based it off of a Perl script I found back in 1997—I updated it to work with all the new fangled modern tags. :)
Check it out and let me know what you think!
https://github.com/rareyman/HTMLBeautify
I think this is what you're looking for:
https://github.com/victorporof/Sublime-HTMLPrettify
I am yet to have the privilege to comment so this is simply additional information related to #peter's answer above answer.
I found HTML did not align as expected if IE conditional comments in the header were not completely in-line e.g. flush to the left:
<!--[if lt IE 7]>
<p class='chromeframe'>Your browser is <em>unsupported</em>. Upgrade to a different browser or install Google Chrome Frame to experience this site.</p>
<![endif]-->
<!-- Le HTML5 shim, for IE6-8 support of HTML elements -->
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
There is a nice open source CodeFormatter plugin, which(along reindenting) can beautify dirty code even all of it is in single line.
I'm using tidy together with custom build system to prettify HTML.
I have HTMLTidy.sublime-build in my Packages/User/ directory:
{
"cmd": ["tidy", "-config", "$packages/User/tidy_config.cfg", "$file"]
}
and tidy_config.cfg file in the same directory:
indent: auto
tab-size: 4
show-warnings: no
write-back: yes
quiet: yes
indent-cdata: yes
tidy-mark: no
wrap: 0
And just select build system and press CTRL+B or CMD+B to reformat file content. One minor issue with that is that ST2 does not automatically reload the file so to see the results you have to switch to some other file and back (or to other application and back).
On Mac I've used macports to install tidy, on Windows you'd have to download it yourself and specify working directory in the build system, where tidy is located:
"working_dir": "c:\\HTMLTidy\\"
or add it to the PATH.
you can set shortcut key F12 easy!!!
{ "keys": ["f12"], "command": "reindent" , "args": { "single_line": false } }
see detail here.
HTML-CSS-JS Prettify - Hands down the best.
Install Package Control
⌘ + left shift + p (or ctrl + alt + left shift + p) -> Package Control: Install Package
Enter HTML-CSS-JS Prettify
Install node
Restart Sublime Text
Enjoy.
How can I set a maximum length for Android Studio's code editor, or may be set a word wrap?
In my Android Studio, no matter how long a statement I type on a single line, it never automatically goes to the next line, but rather a horizontal scroll bar appears.
When I autoformat using the Ctrl+Alt+L (reference), nothing happens.
My SO or Google search found a lot of material on this for Eclipse, but not for Android Studio.
If you need not a soft wrap,
but actually, brake one long line onto several lines you need:
Go to Preferences(mac) or Settings(windows) -> Editor -> Code style -> Java/Kotlin -> Wrapping and braces (tab) -> Check "Ensure that right margin is not exceeded"
Now try to reformat your code:
press
OPTION (ALT) + CMD + L on your Mac
(or CTRL + ALT + L on PC)
Edit 13.02.19
As noted in comments this option seems not available in settings for Kotlin.
However, there is a workaround to manually add it.
Here is what it takes to make it work:
Export the settings scheme.
Open saved xml file.
Find <codeStyleSettings language="kotlin"> tag (or create)
Add the WRAP_LONG_LINES setting manually:
<codeStyleSettings language="kotlin">
...
<option name="WRAP_LONG_LINES" value="true" />
</codeStyleSettings>
Save edits and and import back the scheme.
Here you go!
MacOS:
Click on Android Studio ( left top corner )
Click Preferences
Type Code Style in search
Click on Code Style
There is a filed right to the 'Hard wrap at' - you can enter needed about of symbols you need
In File | Settings, select "Editor", then "Code Style". There is an option "Wrap when typing reaches right margin".
Edit: Just tried it, and it doesn't seem to work. Anyway, maybe the option "Use soft wrap" in the "General" group is more what you want.
#Solace, actually #Fahim Faysal's answer is quite close to what you need, but since you want to solve the problem no matter how long a statement I type on a single line, it never automatically goes to the next line, 2 more steps you need to follow:
[Step 9] type the max length you prefer at `"Hard wrap at" ()
[Step 10] change "Wrap on typing" from Default: No or No to Yes
With version 4.1.2 and with Dart language you need to go to "File/Settings/Editor/Code Style/Dart" and modify the "Line length" to the preferred number.
In Android Studio:
File->Setting->
Editor->code Style->java->Wrapping and braces(tab:right side)->keep when reformatting->Line break(make unchecked)
You can change the max column width from:
File > Settings > Editor > Code Style > Right Margin (columns)
Android Studio 3.5:
Mac -
Android Studio > Preferences > Editor > CodeStyle > HardWrap at: ____
The existing answers already answer the question in straight forward way. As a different approach you could set the style guide to kotlin style guide code style. Then if you do alt + ctrl + l as you did, you'll see auto wrap as you expected.
Just open the settings, search for kotlin and look for kotlin under code style.
On the top right hand side of the settings window you'll see Set from..., click on it.
Then on predifined style > kotlin style guide
If you'd like to follow the kotlin formatting style this could reduce more effort. For more information: https://developer.android.com/kotlin/style-guide
My Environment：
Ubuntu 18.04
AndroidStudio 3.3.2
My operate：
File -> Settings -> Editor -> Code Style
Scheme -> select Project
Hard wrap at '120'
Apply
To move the grey vertical line, that tells Android Studio where to wrap your code, go to
Settings- Editor- Code Style- Java or Kotlin- Wrapping and Braces- Hard wrap at
and enter the number of characters, where the line should be.
For dart
settings => code style => Dart => Line length
In settings/code style/kotlin/wrapping and braces replace the "do not wrap" values with "wrap if long"
You can change the Hard wrap at param
In Resharper when I go back to edit some existing code.. eg. wanting to insert a String.Format into this code:
<td>
<%= Html.Encode(item.Address) %>
</td>
I move the cursor to before 'item' and type in 'String.F', getting Resharper's intellisense completion list that includes the 'Format' method.
However if I press TAB then it replaces 'item' with '.Format()'
Is there a way to use completing without replacing the existing text?
Stumbled upon using Enter instead of TAB to choose from the completion list. That does exactly what I want. It surrounds (in this case) 'item.Address' with the String.Format( .. ).
There are two techniques you can use.
The first is to use the Enter key, the second is to pop a space between where you are going to start typing and the next bit of code, which will prevent the next bit of code from being overwritten.
There is an actual setting now to disable this (annoying) behavior.
Go to the Options dialog (Menu -> Resharper -> Options).
In this Options dialog go to Environment -> IntelliSense -> Completion Characters.
Here you can set the Tab behavior to Insert instead of Replace.
Screenshot of Options
Resharper documentation about Completing Characters
This is an addition to the answer in 2010, for everyone that reaches this post via populair search engines ;)
You could also use the String.Format surround template but you may have to map a hotkey to it for easier access.
The keyboard command you want to use is called: Resharper_ForceCompleteItem. So if you go into Visual Studio's Tools > Options > Environment > Keyboard you could assign a keyboard shortcut there. Not sure if it would be possible to use Tab, though.