(新)「萌え電卓」HTML版とそのアプリ化。萌え萌えmoebuntuubuntuを萌え萌えにするmoebuntuのブログです。(新)「萌え電卓」HTML版とそのアプリ化。http://moebuntu.blog48.fc2.com/blog-entry-789.html(新)「萌え電卓」HTML版とそのアプリ化。★画像アップ先の不調により、過去のエントリーで画像が見られないものが多数あります。画像の見たいものがありましたらご連絡いただければ復活するようにします。さんのサイトにアップ(【萌え電卓】貼れるのか?)され、それを元に勉強がてら少しモディファイした(新)「萌え電卓」HTML版を用意してみました。「node-webkit」というWebベースのGUIライブラリを使ってアプリ化することにも成功しました。Web版は↓こちらで弄ることができます。*イラストはジュエルセイバーFREEを利用しています。\もしよかったらお願いします。/●受取人の欄にmoebuntu★gmail.com(「★」は「@」に置き換える)で寄付(15円〜)できます。Amazonギフト券(Eメールタイプ)今回の新バージョンでは吹き出しやボタンなどが画像化されているので、好きに変えることもできます。わたしはGIMPで少し吹き出しを見やすく加工して、CSSを編集して吹き出しとボタンの表示位置を調整してみました。計算結果で表示される「だよ」や「なったよ」に加えて「じゃない...かな?」と「くらいだよ」というのを付け加えてみました。「node-webkit」でアプリ化HTMLのアプリ化ってその昔WebサイトをFoggerでアプリ化っていうのがあったのでそれを使ってできるかな~と思っていたのですが、これもうサポートされてないみたいですね。使うことはできそうですが...。そんなことを思っていたところ、先日senopenさんが、「node-webkit」でHTMLのアプリ化をできるようなことをtweetしていたので、いろいろ調べてみたところ、ようやく使い方が分かってアプリ化に成功しました。「node-webkit」とは「node-webkit」はNode.jsとChromiumを利用たランタイム/開発フレームワークで、HTML/CSS/JavaScriptでアプリを作ることができるものらしいです。以下GitHubのDownloadから入手できます。使う環境に合わせてダウンロードしましょう。64bit用をダウンロードしました。nw.js「node-webkit」の使い方わたし自身細かいことは分かってないので、やったことを書きますね。入手した「node-webkit」(nwjs-v0.12.0-linux-x64.tar.gz)を解凍して操作しやすいようにホームへ移動しておきます。World」を表示してみます。用意するのは「index.html」と「package.json」です。それぞれテキストエディタで以下のファイルを作り、「node-webkit」のディレクトリ(nwjs-v0.12.0-linux-x64)に入れておきます。*以下「index.html」と「package.json」はsenopenさんのサイトのWebベースGUIライブラリnode-webkitのチュートリアルの実行を参考にしました。"index.html"}以下のようになります。つぎに用意した「index.html」と「package.json」は「app.zip」とZIPファイルに圧縮し、そのファイル名を「app.nw」にリネームします。これでとりあえず準備はOKです。端末を開いてcdコマンド使うなりしてその展開した「node-webkit」のディレクトリ(nwjs-v0.12.0-linux-x64)に入ります。nwjs-v0.12.0-linux-x64「app.nw」のパッケージング端末内で以下の操作でパッケージングができます。appこの操作で「app」ファイルという実行ファイルが生成されます。この「app」ファイルをダブルクリックで起動してみます。あれ、うんともすんとも言わない?こういう時は端末に突っ込んで(「app」ファイルを端末内にドラッグ)起動してみます。directory上記のようなエラーが出てました。libudev.so.0)というのを見つけました。それで書かれているとおりにやってみました。端末上で以下を入力適用しました。/lib/x86_64-linux-gnu/libudev.so.0そのあと再度「app」ファイルをダブルクリックで起動してみます。World」が無事表示されれば「萌え電卓」のアプリ化も同様です。「萌え電卓」のファイル郡(index.html+moecalc.css+moecalc.js+imgフォルダ)と上記「package.json」を一緒にZIPファイル化してあとは同様の手順でアプリができます。*できた「app」ファイルの起動には同じフォルダに「nw.pak」が必要です。アプリ化した「萌え電卓」は以下からダウンロードできます。起動ファイルは「moecalc」とリネームしてます。moecalc(moecalc.tar.gz):ダウンロードデータのソースはこちらに置いてあります。前回の「萌え電卓」のデータも一緒くたになっているのであしからず。indexファイルは「index2.html」の方になります。「index.html」と「bg.jpg」が前回のファイルとなります。(2015/04/18)(新)「萌え電卓」HTML版とそのアプリ化。名前タイトルメールアドレスURL本文パスワード非公開コメント管理者にだけ表示を許可するLinuxでのプログラムの拡張子TOYさん早速DLして試してみました。電卓の大きさが小さくなっていて,デスクトップで開いて使いやすくなりましたね。前回の記事で「Wine経由で起動しないといけないと」とコメントしました。Linuxでは拡張子にexeをつけるとWindowsのプログラムとして認識されてしまうみたいですね...。拡張子からexeを除去すれば,Ubuntuでも普通にダブルクリックで起動できました。それとicudtl.datは不要でしたね...。node-webkitのチュートリアルでは,僕の記事も参考にしてくださり,ありがとうございます。node-webkitは最近nw.jsに名前を変更したようです。TOYさんはHTMLにお詳しそうなので,nw.jsを使えば簡単なアプリならいろいろ作れてしまいそうですね(笑)。DLして試してみました。試していただきありがとうございます。電卓の大きさが小さくなっていて,デスクトップで開いて使いやすくなりましたね。あとはHTMLを弄って表示されるウインドウのサイズなども調整したりするといいかもしれませんね。node-webkitのチュートリアルでは,僕の記事も参考にしてくださり,ありがとうございます。Ubuntu用の記述が見つからなくていろんなサイトあさってたまたま参照しました。後になってsenopenさんのサイトだって気づきました(^_^;)。node-webkitは最近nw.jsに名前を変更したようです。GitHubのところnw.jsになっていたんですね。TOYさんはHTMLにお詳しそうなので,nw.jsを使えば簡単なアプリならいろいろ作れてしまいそうですね(笑)。moebuntuサイトを自力で作れるくらいで、さほど詳しくはないのですが...手軽にアプリ化できるのはいいですね。サイズが大きくなるのは難点ですけど、そういえば、小さくする方法あるんですね。試していませんが教えてくれてありがとうございました。wikiお気軽にコメントください。Reserved.情報商材+。