atomm で文字列検索と置き換え

atomm で文字列検索と置き換え

まずファイル内の文字列の検索

まずパネルをだす

ctrl + f でファイル内検索ができる

検索窓にプレースホルダーで
Find in current burret
とかかれているところに探すワードを入力

atm

ドットインストールだとすでに
過去に作成したものを開いているけど
実際につくるのは面倒なので

atom &

で端末で起動すると welcom 画面がでるので
これを利用する

ctrl + f で検索欄ができるので
help
と入力すると
2つあるとでる

表示に
2 found
とでている

atm2

これで次の help に移動するには
Find ボタンをおすか
ショートカットキーで
F3 を押して先に進める
前に戻るには
shift + F3 を押せばいい

なお、ショートカットキーを調べるには
コマンドパレットをみたほうが早い

コマンドパレットは
ctrl + shift + p ででるので
ここで使いたい機能を英語で入れれば
ショートカットキーが表示される

atm3

全部入力しなくても
次を検索したいのなら
find nex

F3
と表示される

また検索についてはオプション指定が可能

atm4

左から順番に
.* は正規表現

Aa が大文字、小文字の区別

” が選択範囲の指定

\b が単語の完全一致
となる

そして、文字の置換をするには
Replace in current buffer
とかかれているところに書き換えたい文字を入力し

Replace で置換できる
Replace All だとファイル内の該当するすべてを
置換する

今回の場合だと
help

helper
に変える

atm5

もし、間違えても
ctrl + z で元に戻せる

なおこの検索や置き換えのパネルを消すには
escキーで消せる

ちなみに
ctrl + shift + f
で検索すると、すべてのフォルダが対象になる

検索欄にキーワードをいれて
Enter をおすと、対称となるファイルがでるので
青くなっているファイルをクリックすれば
ファイルを開くことができる

なお、一番したの欄は
ファイルの種類を指定するもの

これで
HTMLファイルにするのなら
*.html
というようにする

atm6

複数ファイルの編集をするときにはこの機能がおすすめ

atomのショートカットキー(ubuntu)

今回も実行環境は Ubuntu 12.04 64bit

atomのファイル検索機能
ドットインストールを参考に実践

ファイル検索のショートカットキーは2つ

ctrl + t

ctrl + b

ctrl + t のほうだとカレントフォルダ全体から
ファイルを探す
ってドットインストールでは解説があったけど
Mac と Ubuntu ではショートカットキーが異なる

原因は Command キーがないから

そこで
Ubuntu atom ショートカット
で検索した結果

Atomの使い方メモ

を参考に実行することができました

ファイルを開く
Ctrl + o

ディレクトリを開く
Ctrl + Shift + o

ディレクトリをツリーで表示/非表示
Ctrl + \

コマンドパレットを開く
Ctrl + Shift + p

設定画面を開く
Ctrl + ,

ファイル名で検索
Ctrl + t

タブで開いているファイルの検索
Ctrl + b

ファイル内文字列検索
Ctrl + f
F3 次を検索
Shift + F3 前を検索

フォルダ内文字列検索
Ctrl + Shift + f

対応するカッコに遷移
Ctrl + m

指定行へ遷移
Ctrl + g

ブックマーク付与
Ctrl + F2

ブックマーク付与検索
Ctrl + Shift + F2

同じ単語の選択
Ctrl + d

画面の分割
Ctrl + k + 矢印キー

現在カーソルが当たっている画面分割の解除
これはブラウザのタブをとじるかんじ
Ctrl + w

Markdownプレビュー
Ctrl + Shift + m

あと実機環境のためか、HTMLの
タブの設定は反映されました

ショートカットキーは慣れるまで時間がかかるので
繰り返し修練していこうと思います

atom の言語別設定

atom の言語別設定

ファイルの種類により設定を変えるときにこれを使う

例えばHTMLなら4桁にして
ruby なら2桁にする

設定画面は
ctrl + shift + p
で検索画面をだして

setting
と入力すればでてくる

ここで
Filter packages
とかかれたところに
language
と入力すると
言語のリストがでる

atom

HTMLの設定をするなら、この中からHTMLを選ぶ

Language HTML
となっているのが html

atom2

これでHTMLの設定画面になる

タブの数をかえたいのなら
Tab Lenght を変える
デフォルトは

今回は 4 に変更

atom3

これで設定が反映されているかを確認

新しいタブを開くには
ctrl + n
で開ける

新しくタブを開いた状態だと
プレーンテキストの状態なので
Atom の画面の右下にある
Plain Text
をクリックして
HTML に変更する

atom4

これで
タブキーをおすと
—-
というように4桁表示されるようになる

atom5

そして便利なのが言語ごとの Snippets設定

これは
Tab キー
を押したときの動作
ショートカットキーのようなもの

例えば aタグをつくるには
a を入力して tabキーをおすと

<a href="#"></a>

となる

atom6

ちなみに、テキストのタイプをそれぞれの
言語にしておかないと機能しないので注意

テキストタイプが
Plain Text だとまったく動作しない

atom7

ubuntu 12.04 へ Atomインストール

ubuntu 12.04 へ Atomインストール

Atom はGithubの開発しているエディタ

公式サイトは
https://atom.io/

ドットインストールは Mac 版だけど

使用している環境が Ubuntu 12.04 64bit なので
これで使える方法を検索

検索ワードは
ubuntu atom インストール

atomをUbuntuにPPA経由でインストールする

にやり方が載っていたので
これを元にインストール

sudo add-apt-repository ppa:webupd8team/atom

でリポジトリ追加

sudo apt-get update

でパッケージを最新版にする

sudo apt-get install atom

でインストール

Atom の起動は
端末で

atom &

とするか

ダッシュボードで atom とすることで起動できます

使い方については
ドットインストールの
Atom入門

を参考に学習

使う環境はできればどれでも使えるものがベスト

最近では virtual box とか vmware player
などで環境を用意できるけど
それでもツールはどの環境でも使えるものに
しておけば、機種依存もしないので
スムーズに作業ができます

youtube へ動画のアップロード(PCからの場合)

youtube へ動画のアップロード

YouTubeにPCから動画をアップロードする方法_YouTube入門(0)

を参考に kazam で録画した動画を
アップロード

本来は wordpress と同じサーバーとかに
アップロードすると楽だけど
容量がすごくとりそうなので、まずは無料で使える
Youtube を使うことに

まずは youtube にアクセス
https://www.youtube.com/
がURL

そして Google アカウントでログイン
Android を使っている場合
すでにアカウントは取得しているので
これをそのまま使用

画面右上のアップロードをクリック

youtube1

次にアップロードしたいファイルを
ドラッグ&ドロップ

今回は
前回撮影した動画ファイルをアップロード

youtube

すると自動的にファイルのアップロードが開始される

youtube2[

アップロードが完了したら
タイトルと説明を編集する

タイトルは最初はファイル名なので
もっとわかりやすいものにする

タイトルには

今回はタイトルをファイル名から
Raspbery Pi で Lチカ
に変更

説明にはわかりやすく
raspberry Pi のLチカの動画解説になります

今回の動画内容に関しての説明を加えます

終わったら変更の保存
をクリック

youtube3

これで動画が公開になっていれば
Youtube での閲覧ができるようになります

せっかく wordpress を使っているので
youtube プラグインなどについても調べて
今後は表示もしていこうと思います「

kazam でLチカの撮影

kazam でLチカの撮影

電子工作を行うときに躓くこととして
実際の配線関連

ということでわかりやすさを求めるため
解説の動画を撮影

今回は web カメラで撮影し
マイクで音声で解説をいれてみました

なお、使用したマイクは

webカメラには

を使用

とはいっても試験的にやったので
解説動画としてはまだまだで、今後いろいろと勉強して
いこうと思います

まず、 kazam を起動

video from webcam
にチェックを入れ

kazam のメニューで
設定を開き
マイクの入力が最初は
内部オーディオアナログステレオになっているので

micset

これを
USB PnP Sound Device アナログモノラル
に変更

micset2

理由は、そのままマイクを刺した状態だと
ノイズがひどく、聞き取りにくいので購入しました

次に、録画する画面の範囲を選択

これは、今回はLチカの動画で
プログラミングなどは行っていないので
webカメラのみにするために
領域を指定

micset3

本当は webcam の設定でできると思ったけど
これにしてしまうと
撮影中の画面が真っ黒になってしまい
実際の動作確認ができないので
領域指定で選択しました

micset4

あとは kazam で録画し
これを youtube にアップロードすれば今後
解説するときに動画での解説が可能になる予定です

youtubeの投稿は初チャレンジということで
後日アップロード関連について行う予定です

kdenlive 操作画面の復旧

kdenlive 操作画面の復旧

kdenlive の操作画面でウィジェットを
xで消してしまうと、次回からそのままの
レイアウトになってしまう

消してしまったウィジェットを復旧するには
kdenlive のview の中から選び
操作画面にドラッグしていけばできる

とりあえず、今のところ必要そうなのは
プロジェクトツリー
クリップモニタ
タイムライン
の3つ

左上がプロジェクトツリー

右上がクリップモニタ

一番下がタイムラインになる

rekdl

保存しなくても、そのまま操作画面は保持される

直し方の参考は
Widget layouts in kdenlive

kdenlive の字幕表示その2

kdenlive の字幕表示その2

7. 動画編集ソフトウェア Kdenliveの使い方 p2.字幕表示について Linux/Ubuntu 12.04

を参考に kdenlive の使い方を学習

前回までの復習を兼ねて、まずは
kdenlive を起動し
ドラッグ&ドロップで
動画編集したいファイルをクリップへ設置

kdl

次に、クリップ欄を右クリックし
タイトルクリップの追加で
タイトルを入力するダイアログを開く

kdl2

そして表示したいところへマウスクリックし
文字を入力

今回は文字列をブログURLにして
画面の左下へ赤文字にして表示

kdl3

あとは
OKを押すと新しいクリップが作成されるので
これを
Video1 へドラッグする
動画については Video 2 にドラッグ

kdl4

ちなみに、タイトルクリップの編集をするには
作成されたタイトルクリップを
ダブルクリックすれば、再びダイアログがでて編集できる

kdl5

ちなみに、映画の翻訳みたいに字幕を切り替える場合
複数のタイトルクリップ作成する必要がある

続いて
8. 動画編集ソフトウェア Kdenliveの使い方 p3.字幕表示について Linux/Ubuntu 12.04

を参考に、字幕の追加方法を学習

作成したタイトルクリップをダブルクリックすると
編集画面になる

そのまま別のところをクリックしても
追加のテキスト入力はできない

テキストを追加したい場合
一番左上のアイコンをクリックし
でてきたメニューで
テキストの追加
を選ぶと、追加でテキストの入力ができるようになる

kdl6

このアイコンをもう一度クリックすると、
テキスト入力状態を解除することができる

なお、入力したテキストを編集するには
テキストをダブルクリックすればいい

kdenlive の字幕表示

kdenlive の字幕表示

kdenlive を使うことで動画にタイトルや字幕を埋め込むことができる

6. 動画編集ソフトウェア Kdenliveの使い方 p1.字幕表示について Linux/Ubuntu 12.04

を参考に実践

今回の動画の場合だと
ずっと表示されるものをつくっている

これの使い道は twitter アカウントとか
ブログのURLとか
facebook のアカウントとか
コピーライトを表示するのに使える

この字幕を作成するには
kdenlive のクリップのところに配置した動画ファイルを
右クリックし
タイトルクリップの追加
を選択

するとタイトルを入力するためのダイアログが表示される

title

文字を入力するには
網目になっているところの任意のところでマウスをクリックすればいい

あとは普通に文字を入力するだけ

今回はブログの URL を入力
https://wp.developapp.net/

title2

そのままだと小さいので
文字の色とフォントサイズを変更

今回は赤い文字にして、フォントサイズを50に設定

title3

これでOKを押すと
タイトルの挿入が反映された新しいクリップが追加される

title4

このクリップを video 項目へドラッグ&ドロップすると
下へ黄色いラベルがつく

title5

これで、挿入する文字を入れたクリップの下にある
動画をみると
入力した文字が表示されているのがわかる

title6

文字列を表示させる位置については
タイトルクリップの追加のときのダイアログの場所が
反映される

注意点としては、文字を表示するには
Video1 に配置すること

そうしないと表示されない

kdenlive のレンダリングについて

kdenlive のレンダリングについて

. 動画編集ソフトウェア Kdenliveの使い方 レンダリングについて Linux/Ubuntu 12.04

を参考に
kdenlive のレンダリングの方法について学習

動画編集は必要な部分になるように
カットしてつなぎ合わせることになる
そしてできたものを動画ファイルとして書き出す

この書き出しがレンダリングになる

レンダリングのやり方は
kdenlive のレンダリングと書いてあるボタンをクリックする

まず、kdenlive を立ち上げ
適当に動画ファイルをつくるため kazam で撮影
次に動画ファイルを
kdenlive へドラッグ&ドロップして
一連の動画になるように適当に配置して
レンダリングボタンをクリック

rend

するとレンダリングのための設定画面が表示される

rend2[

出力先のところにファイル形式がでてるけど
動画では
 .m2t
だったけど
私の環境では
.mp4
になっていた

そのままだと
タイトル未定.mp4
になっているけど
日本語だとあとあと問題がおきることがあるので
test.mp4
に変えておく

スキャンの設定は 自動のままにしておき

エンコーダスレッドは使用するCPUの数なので

を設定

設定ができたらファイルを書き込むので
ファイルにレンダリング
をクリック

rend3

これで動画ファイルが指定した出力ファイル先に
作成される

rend4

ちなみに、編集につかって分割したファイルでいらない部分は
キーボードの Deleteキーで削除する

クリップのほうも消せるけど
こっちを消すと、編集の
Video 1 とか Video2のほうに設置したものまで消えるので注意

もし、間違えて消したのなら Undo をクリックすれば
元に戻すことができる

rend5

なお、動画のレンダリングにかかる時間は
マシンスペックにより異なる