無償コードエディター Brackets 1.2 リリース
Photoshopで作成されたPSDのデザインカンプからコードヒントを得られるようになるなど、最近話題の無償の軽量コードエディター、Bracketsの最新版「1.2」が、3/2付けでリリースされました。
https://blog.adobe.com/media_932ec30606313421934a00d75777749fc2ac2d0b.gif
今回のバージョンの主な新機能は以下の通りです。
Release 1.2 – 2015-03-02 ( リリースノート[英語] )
- ドラッグ&ドロップでテキストを並べ替え – dragDropText 環境設定を有効にすると、選択したテキストをドラッグ&ドロップできます。複数選択にも対応しています。
- CSS カラー名のヒント – カラースウォッチのプレビューなど、CSS/LESS/SCSS で標準の名前付きカラーのコードヒントが表示されます。
- SVG コードヒント – .svg ファイルで、タグ、属性、名前付きカラーのコードヒントが表示されます。
- Windows の高 DPI のサポート – 高 DPI ディスプレイでは、テキスト、アイコン、イメージが自動的により鮮明にレンダリングされます。
- 検索の目盛りマークインジケーター – 検索/置換のスクロールバーで、現在選択されている検索結果の目盛りマークが強調表示されるようになりました。
- ウィンドウ配置の改善 – Windows では、モニターの接続が切断された後や、画面解像度が変更された後でも、Brackets が画面上に配置されたままになります。
ドラッグ&ドロップでテキストを並び替え
Bracketsはこれまでテキストをドラッグ&ドロップして、編集することができませんでした。今回のアップデートで、ユーザーからの要望が多かったこの機能がサポートされています。ただし、環境設定ファイル(brackets.json)を自分で編集する必要があります。
手順:
**1. 環境設定ファイル(brackets.json)を開く
**「デバッグメニュー」>「環境設定ファイルを開く」
2. dragDropTextプロパティを追記する
※この作業が不安な方は、brackets.jsonファイルをバックアップしておいてください。
環境設定ファイル(brackets.json)の一番下の行に「}」があります。(下図の場合は、161行目)
https://blog.adobe.com/media_b32d381d10d03ccdbc331338932e07267bedae29.gif
その一つ上の行(上図の場合は、160行目)の終端に、「,」を打って改行し、
“dragDropText”: true
と書き加えて下さい。
https://blog.adobe.com/media_b8388b61bda1d33994a3ec1eab78027ed9808a4e.gif
3. Bracketsをリロードする
「デバッグメニュー」>「拡張機能付きでリロード」
4. テキストを選択して、ドラッグ&ドロップする
これでテキスト編集作業を頻繁に行うコーダーさんは、少しは楽になるかもしれませんね。
CSS カラー名のヒント
CSSでフォントカラー(colorプロパティ)やバックグラウンドカラー(background-colorプロパティ)などのカラープロパティを記述する際に、W3Cカラーネームのリストがスウォッチと共にコードヒントに出現するようになりました。
https://blog.adobe.com/media_7bea50fe789f5f191d8665d4c3c524e5fd2daae0.gif
その他、Dartファイルのシンタックスハイライトや、PageUpやPageDown、Homeなどのカスタムキーバインドのサポートなどの他、多数のバグフィックスが含まれています。詳細はBracketsチームブログ(英語)やBrackets 1.2 リリースノート(英語)をご覧下さい。