冬コミC91に参加します

 サークル「理ろぐ」は、コミックマーケット91にも参加です。
 今回も創作系のエリアで、「金曜日 西地区 "ひ" 02b」です。

 Webカタログでもサークル情報を公開してます。
  https://webcatalog.circle.ms/Circle/13015363/

 今回は西館でサークルが配置されるのは、西1だけなのでなんだか隔離部屋扱いされているようです。
 何となくまったりした雰囲気になりそうですが、企業エリアへ行った帰りにでも寄ってください(西2~4が企業です)。

 本の内容ですが、女子高生と女子高生の犬を通じたちょっと不思議な出会いのお話の予定!
 小説家になろうにアップしている前半と、これからアップする(予定)の後半に表紙と挿絵を付ける感じです。
  ・雨降りの再会
  ・雨降りの発見

 表紙絵をイラストレーターさんにお願いしてしまった手前、書ききらねばなりません(自ら追い込んだ)。
 毎度、自由気ままに書いている本ですが、なにとぞ。
 スペースに遊びにくてくれるだけでも嬉しいので、まだまだ先のようなあっという間な年末にお会いしましょう!

 あと、
 当日は、新刊と既刊の小説を2種類持っていきます。
 既刊(もう無くなってしまったQt本とか)は、BOOTH( https://relog.booth.pm/ )で販売していますのでよろしくお願いします。

Qt World Summit 2016に参加してきたよ(旅編)

 The Qt Companyの主催で「Qt World Summit 2016」が10/18~20にサンフランシスコで行われましたので、参加してきました。
 この投稿は、カンファレンス本編以外の旅行に関する部分についてです。つまり、ただの旅行日記的なものです。

 カンファレンス自体の雰囲気レポは「Qt World Summit 2016に参加してきたよ(本編)」を参照ください。

 本編の方でもさらっと触れましたが、基本ぼっち移動のち、現地でSRAのお二人と合流しての行動でした。
 偶然ですが、ホテルもすぐ側で助かりました。


/// 出発~成田空港~サンフランシスコ空港 ///


 帰りの時間の都合もあって成田からの直行便にしました。なので、初めて成田エクスプレスを使いました。意外と快適だった。でも、可能なら羽田が楽で良いなーと思うところ。
 飛行機は、ユナイテッド航空を使ってみました(ANAだと予算オーバー過ぎだったので)。日本との直行便(往復とも)は機内のアナウンスは日本語でもしてくれるし、CAさんに日本語でOKと案内してました。日本人のCAさんは日本語で話しかけてきますが、さすがに外国の方の場合は英語で話しかけてきました。トラブルでも無い限り機内では「飲み物何がいい?」と「食事は○か×のどっちにする?」くらいしか聞かれないので平気ですね。中国語で話しかけられたこともあったような気がする。通じてないと思ったか英語になったけど。CAさんも国際色豊かな感じでした。
 機内では、スナック(あられ)と夕食(アイス付き)と朝食がでました。唐揚げ弁当的なのと、親子丼でしたが、2回ともご飯が底で焦げ付いてたのが、少々残念でした。
 IMAG0250.jpg IMAG0255.jpg
 
 世界の車窓
 IMAG0256.jpg IMAG0263.jpg
 2枚目はサンフランシスコ市街の上空からで、橋はサンフランシスコ-オークランドベイブリッジ、少し横にアルカトラズがかろうじて見えますが、ゴールデンゲートブリッジを写真に入れることは出来ませんでした(市街が見えているの気づくの遅れた^^;)。
 今回乗った飛行機(B747-400)のエコノミーには個別のモニターはなくて、機内WiFiに繋いでユナイテッド航空アプリでコンテンツを好きに見てねってスタイルでした。
 screenshotshare_20161017_175601.png
 
 

/// サンフランシスコ空港~市街 ///


 BARTという電車(地下鉄?)を使いました。
 Clipperカードという日本で言うSuicaっぽいのが便利なの知ってたのですが、BARTの自販機では買うことができず、市街までは普通の切符を買ってしまいました。
 こんなカード
 IMAG0496.jpg
 自分はとある理由でパウエル駅でBARTを降りたのですが、MUNIという市内の交通網(名古屋市交通局的なの)の地下鉄の駅とくっついてて、そちらの自販機でClipperカードが買えます。適当にチャージして使いましょう。
 MUNIのバスとかでも使えるのですけど、チャージできる場所が良く分からなくて自販機だけに頼ろうとすると地下鉄の駅でしかチャージできなくなるのである程度計画的にです。
 なお、バス(路面電車込み)は$2.25で90分間乗れるので、時間内なら何回乗り継いでも$2.25で便利です。
 で、パウエル駅で降りた理由に戻ると、飛行機の到着が午前中でホテルのチェックインまで時間が余っていたので観光したいけどスーツケースが邪魔なので預けるためでした(自分のホテルはフィッシャーマンズワーフのそばだったので、パウエル駅からもう1つ先の駅まで行った方が乗り継ぎ的には本当は便利なのです)。
 預け先は、日航ホテルにあるJCBプラザ(ホテルの壁に埋め込まれている看板はJGAデスクだった気がする。部屋の前にはJCBプラザって書いてあります)です。ここはJCBカードを持ってると荷物の一時預かりとか観光案内をしてもらえます。前回、Google I/Oで行ったときに利用して知っていたので利用させていただきました。
 ただ、JCBプラザの場所がわかりにくいw。ホテルのロビーよりも下の階のこの先関係者のみじゃないの?って雰囲気の廊下の奥にあります。しかも、そこが車で来たときの入り口になっててベルボーイさんが親切に「フロントはエスカレーター昇ってね」って案内してくれちゃうもんだから、気まずいw。


/// 市街観光 ///


 JCBプラザのおねーさんから軽く情報を仕入れつつ、割引券(結局使わなかったけど)とか観光パンフをもらって出かけました。
 行き先は、フェリー乗り場付近。
 
 ここは、ちょっとしたショッピングモールになっていて中に色々なお店が入ってました。
 IMG_4962.JPG
 中にはワインバーとかあって、飲める人だったらここだけで時間つぶせただろうなーって感じでした。ワインの種類もあったのですが、チーズもたくさんの種類から選べたようです。チーズは食べてみたかったけど、ワイン飲んだら身動き取れなくなりそうだったので止めました。
 他には雑貨屋さんとか、いろいろあって、おしゃれっぽいレストランで牡蠣を食べてる人もいました。
 お昼には、メキシコ料理屋さんに入ってタコス(ポーク)を頼んでみたのですが、想像と全然違うものが出てきてビビりました。ひたすら肉でした。
 IMAG0265.jpg
 もたれたお腹を消費するべく、埠頭のあたりをしてみました。
 IMAG0277.jpg IMAG0278.jpg
 IMAG0279.jpg IMAG0280.jpg
 お昼が微妙になってしまったので、再びフェリー乗り場に戻ってきて可愛らしいお嬢さん方店員さんで流行っぽいアイス屋さんでかって口直しをしました(結局なにか口に入れてしまう)。
 IMAG0284.jpg
 思ってたよりは重くなくて普通に食べられました。ケーキくらいの温度感だったらヤバい?


/// ホテルへ~夕食 ///


 街をぷらぷら歩いて、預けていた荷物を受け取ってからホテルへ移動しました。
 IMG_4982.JPG
 ホテルへの移動には路面電車を利用しました。
 IMG_4987.JPG
 使ったMUNIのF路線とE路線のみで使われているっぽい古めかしい車両で中はこんな感じ。
 IMAG0289.jpg IMAG0290.jpg
 右側の写真をよく見てもらうと分かるのですが、ペダルが付いてます。アクセルとブレーキがペダルでした。路面電車という表現をしてしまうとどうしても日本の電車のイメージなので、少し驚きました。分岐のところでは、ボタンを押して方向を決めているようでした。台車を無理矢理、左右のどっちかに振ってるんだろーなーと想像してました。

 ホテルは「Zephyr」というところでした。初めてトリバゴ使って値段比較して調べたよ。
 IMAG0377.jpg
 
 ピア39とかめっちゃ目の前です(海は見えない部屋でしたけどね)。
 中庭がこんな感じになってるハイカラなホテルでした。
 IMAG0380-PANO.jpg

 無事にチェックインを済ませて、SRAのお二方が空港に到着する頃だったので連絡を取って夕食をご一緒させていただく約束をして、だらけてました。
 その後、無事にお二人と合流して近くのレストラン「The Franciscan Crab Restaurant」で夕食でした。
 
 IMAG0297.jpg IMAG0295.jpg
 メニューを見てて、「clam chowder」と「crab chowder」がダジャレだなーとか思ってしまいました。アサリとカニなんですけどね。

 ポケモンGoを少しだけ起動してみたのですが、「ポケストップの近くにいるポケモン」機能が使えました。へぇ~って眺めた程度ですが。
 Screenshot_20161018-230354.png


/// ピア39~ゴールデンゲートブリッジ~デ・ヤング美術館 ///


 2日目は、SRAのお二方はQt World Summitのトレーニングに参加するということで、再びぼっち観光でした。
 とりあえず、朝食は近所のレストラン「Beach Street Grill Organic Restaurant」で朝食。
 
 IMAG0300.jpg

 食後は、少しフィッシャーマンズワーフとピア39のあたりを散歩しました。
 IMAG0302.jpg
 IMAG0306-PANO.jpg

 その後、MUNIバスの90分ルールを使って乗り継ぎをしてゴールデンゲートブリッジへ行きました。
 
 途中、高速っぽいところを使うので20分くらいで到着しました。早いです。橋の手前の展望台?のあるところのバス停で降りて歩いて近づきます。
 橋に歩道もあるので、歩いて渡ることも出来ます。自分は、1本目の橋脚のところまでで引き返しました。レンタルサイクルで反対側まで行く人も居ますし、そもそも市街から自転車で来ている人も居るようです。
 IMAG0328-PANO (2).jpg
 IMAG0333.jpg IMAG0365.jpg

 このあと、バスに乗ってゴールデン・ゲート・パーク内にある、デ・ヤング美術館へ行って来ました。美術館ってぼっちにこそ行くべきところですね。複数人で行くとどうしても見るペースに気を使ってしまうので、安心して見られます。気になった作品があればじっくり見れるし、疲れたら休憩も自由。
 

 美術館を見ていたら、程よい時間になってしまったのでホテルへ引き返しました。
 トレーニングに参加していたSRAのお二方にも連絡を取ってみたところ、ホテルに戻って休憩していたところだったので夕食へ出かけました。
 IMAG0379.jpg IMAG0378.jpg


/// Qt World Summit 2016の1日目の後に少し寄り道 ///


 会場から帰り道にピア39があるので、少し寄り道しました。
 乗ってないですけど、奥にメリーゴーランドがあるんですよね。夜はキラキラです。
 IMAG0439.jpg IMAG0438.jpg
 夜だと見えないよなーと思ってのぞいてみたアザラシゾーンからの夜景。
 IMAG0443.jpg


/// Qt World Summit 2016の2日目の後に少し寄り道 ///


 1日目と違ってパーティがないので2日目は普通に夕方の暗くなる前に終わったので、SRAのお二方からのリクエストもあり夕焼けのゴールデンゲートブリッジを見に行こうとなり行ってきました。
 IMAG0461-PANO.jpg
 IMAG0475.jpg

 その後、有名らしいカニのお店「Crustacean」に行きました。
 
 お店の特製ヌードル(太いラーメンのようなうどんのような?)をカニのゆで汁につけて食べると、めちゃうまいらしいです。
 IMAG0483.jpg


/// ホテル~サンフランシスコ空港 ///


 最終日は朝から空港へ移動して帰るだけでした。
 ホテルのそばの駅(バス停?)から路面電車に乗って、BARTに乗り換えました。ただ、空港方面は途中までしか行かない路線や、惜しいけどちょっと方向がそれる路線があるので、ちょっとだけ気をつけましょう。間違えてもリカバリー簡単ですけどね。電光掲示板見ればすぐ分かります。


/// サンフランシスコ空港~成田空港~自宅 ///


 帰りの飛行機は、エコノミーで3列埋まってたので窮屈でした(行きは3列独り占め)。
 機内食は、焦げてなかったけど、お米の種類が日本のじゃなくて少しパサパサでした。デザートのアイスとか、添えられているパンも出発地の製品のようなので、そのからみでしょう。行きのアイスはグリコだったけど、帰りは知らないところ。
 IMAG0489.jpg IMAG0491.jpg

 成田からは、成田エクスプレスの切符売りが激混みだったのでスカイライナーを使いました。
 IMAG0493.jpg

 新幹線が博多行きだったけど、寝過ごすことなくちゃんと名古屋駅で乗り換えて無事に帰宅できました。

 本編のQt World Summit 2016の方をもう少し身があると良いのですけど、全体としては楽しかったので良しとしたいと思います。
 最後に、SRAのお二方のおかげで、完全ぼっちを回避して楽しい旅行ができました。本当にありがとうございます。

Qt World Summit 2016に参加してきたよ(本編)

 The Qt Companyの主催で「Qt World Summit 2016」が10/18~20にサンフランシスコで行われましたので、参加してきました。
 雰囲気など様子を紹介したいと思います(英語が不自由なので)。
 今回は、一応去年Qt Championということで、参加費を無料にしていただきました。ありがとうございます。

 当初、The Qt Companyの鈴木さんと「一緒に行きましょー」と話していたのですが、鈴木さんは(たぶん)大人の事情で行けなくなってしまったので、基本ぼっちで行ってきました。
 幸いにもSRAさんから参加するお二方と現地でご一緒することができたので、完全ぼっちは回避できたので助かりました。ありがとうございます。

/// 会場 ///

 会場は、サンフランシスコの第27埠頭にある「James R. Herman Cruise Terminal」で行われました。  IMG_5050.JPG  フィッシャーマンズワーフやお買い物で有名なピア39から海沿いを歩いて10分くらいのところです。  地図的にはココです。  

 2階建ての建物で、1階は「企業の製品展示」「打ち合わせブース」「休憩所」で、2階が「セッション部屋」でした。
 1階の休憩所では3日間の開催期間中、朝食や軽食が用意されていました。
 
 セッション部屋は、広い部屋(というか建物のほとんどがずどーんと広い感じ)をカーテンで仕切って小部屋を作ってました。
 セッション部屋はそれぞれにThe Qt Companyの支店のある都市の名前が付けられていました。
 中サイズ部屋はこんな感じ(看板に部屋名とスケジュールがありました)。
 IMAG0405.jpg IMAG0406.jpg
 小サイズ部屋はこんな感じ。
 IMAG0415.jpg
 一番でかくてキーノートが行われたHelsinki部屋はこんな感じ(パノラマ)。
 IMAG0398-PANO.jpg

 カーテンで仕切られているだけなので、ぶっちゃけ隣の部屋の声が聞こえました。
 自分の部屋のスピーカーさんの声が小さめで隣の人が大きめだと、ちょっと聞き取りにくいこともあったのかもしれません。


/// トレーニングデー(0日目) ///


 10/18は、トレーニングデーとして8種類のテーマでQtについて学ぶことができる日でした。
 自分は、参加していないので詳細は不明ですが、グループでディスカッションして発表する形式だったところもあったようです。


/// カンファレンスデー(1日目) ///


 10/19は、 キーノートの各種セッションの日です(スケジュール)。
 キーノートで印象に残っている内容をいくつか紹介します。
 - How the OneDrive Mobile Team uses Qt
  Microsoftの人のお話。事前にタイトルは出ていなかった(と思う)ですがキーノートで話すってことが公表されている時点で気づく事のできる内容ではあるのですが、Qt使われてたんだーと思いました。
  ありがちな要求ですが、UIはそれぞれのプラットフォーム(WindowsMobile/Android/iOS)のネイティブを使ってコアになる部分は共通化したい、かつライブラリが抱負であるというところでQtが選ばれたようです。

 - Multi Screen Sharing on LG Displays using Qt
  LG製品のお話。特にテレビ(サイネージ)とか時計とかwebOSを使っている製品や車の表示系製品についての紹介でした。
  どれも、複数のモニターを連動させて動かせる製品で、サイネージについては16x16のパネルをシンクロさせて動かせるそうです。製品としては「VIDEO WALLS」この辺りとかでしょうか。

 - Rimac Automobili Ltd.の車
  EVの車を作っている会社で、過去にコンセプトカーを作ってモーターショーにも出していたそうです。
  BMW M3 E30をEV化してゼロヨン(11.850秒)でFiA公認記録を取ったそうです(2015年にTesla Model S P85Dが11.6秒でEVの中で世界記録らしいので凄いですね)。
  キーノートではサラッとでしたけど、同じ人が別セッション(Qt Inside the World's First Fully Electric Supercar)でパイクスピーク(山を登るレース)で有名なモンスター田嶋さんの車も作ったよと紹介されてました(レースレポート)。紹介の中でレーシングカーのテレメトリーの画面を少し見せてくれてました。オンボード映像と4輪のトラクション(とブレーキ)のかかり具合も見れて「ほら、曲がるときに右側のタイヤにしかブレーキかかってないときあるでしょ?これで上手に曲がるんだよ」ってQt関係ない話しもありました(そのセッションは車の紹介でほぼ関係ない話しだった気がするけど)。

 各セッションは、以下の分類がされていました。
 - Built with Qt(11件)
 - 0 to 1(5件)
 - Automotive(8件)
 - Future proof(6件)
 - Advanced(4件)
 事例ベースのお話だったり、今後の話しだったり、盛りだくさんでした。
 「Built with Qt」はある意味「その他」的な分類と思われるので数が多いのは当然として、件数を見てもらうと分かりますが「Automotive(自動車関係)」が多めでした。他にはVR系のセッションも人気があったそうです。

 車関係だと「Qt Automotive Suite」は良いぞってのもありました。車のメーターとかセンターコンソールとか作るときに便利よって感じでQMLを使うとこんな感じでアプリケーションを起動できるとか紹介してました。
 他の車系のセッションでは、メーターのアナログ計(スピードとか回転)は60fpsないと滑らかに表示できないし3D表示もあるから低コストに使用とすると大変だったよって話しもありました(i.MX6DL・DDR3(32bit)・LCD(1920x720)でメモリバスの転送が大変だったそうです)。で、60fpsで描画するところと逐次で更新するところを分けて工夫したりで何とかしたそうです。あとは、起動速度の話とかいろいろ。
 いろいろなツールを使って効率化をしているよって話とか。

 昼食は、裏の海沿いの場所に屋台的な車(市内でもときどき見かける)が4台くらい来ていて好きなのを食べてねって感じでした。
 休憩中にSRAの方と話していたら凄い流暢な日本語でベトナム人の方に話しかけられました。7年くらい日本に居て、今は同じ会社のアメリカの支店にいるらしいです。
 
 夜は1階の軽食を出していたところを使って、立食パーティーでした。
 建物の裏というか海側が解放されていて、結構寒いのですが、外でずっと話している人たちもいました。日本人は朝晩は寒くて上着を着ているのに西洋人すごいよ(笑。
 パーティー中に、東京で働いているというパキスタンの人に話しかけられFacebookで友達になったり、日本に興味があるという中国の人と話したりとミラクルがありました。というか、日本語で積極的に話しかけてくるの凄いです。
 
 会場裏から見えるサンフランシスコ-オークランドベイブリッジの夜景
 IMAG0425-PANO.jpg


/// カンファレンスデー(2日目) ///


 10/20は、1日目に引き続いてキーノートとセッションの日です(スケジュール)。
 
 二日目のキーノートはThe Qt CampanyのCTOのLars Knoll氏が最初でした。
 特に気になったところをピックアップです。
 - オープンソース版・商用版のどっちでも動く製品への対応(ChartとかオープンソースになったのもあるけどGPLだから気をつけて)(これはちょっと誤解があるかも)
 - C++の新しいバージョンにも対応していくよ(現在はC++11で14/17と続いていく)
 - OSサポート(macOSやiOSの最新版、tvOS/watchOSへの対応)
 - 通信系の対応強化
   HTTP/2をQt Networkで対応
   Qt Serial BusでCAN
   Qt Network Autentication module(TP)でOAuth 1&2に対応(これ嬉しい)
 - QMLのJIT on WinRTと64bit ARM対応
 - Qt Quick COntrols 2でパフォーマンスアップ(これは前から言われてるけどね)
  MaterialとUniversalスタイルに対応して個別のデスクトップスタイルは無しになった
 - Qt Webengine(印刷、ドラッグ&ドロップ、DRMメディア用プラグイン(widevine plugin)対応)
 - Qt Liteの目標(小さいフットプリント、速い起動、OpenGL無しなど)
 - Web関連(C++コードをブラウザで動くようにコンパイルできるようになるらしい。開発中で今、alpha版くらい)(この辺りの話しかと「Qt for Native Client (and emscripten)」)
 - リモートディスプレイ関連(Qt 5.8でVNC対応)

 2日目の各セッションは以下のように分類わけされてました。
 - Success(10件)
 - Performance Optimizations(5件)
 - Qt Roadmap Today(6件)
 - Qt Roadmap Tomorrow(5件)
 - Qt Tips & Tricks(5件)

 
 通常セッションでQt Liteについて2コマで概要とツール関連がありました。
 こちらも気になったところを箇条書きにします。
 - 冒頭の振り返り的なところでEmbeddedで使われたQtとしてZaurusの写真が!(箇条書きの中にNokia N9もあったけど)
 - これくらいのスペックで~という話し(ARMv7 ~300MHzとか、QMLでモダンなUXだけどOpenGLなしとか)。
 - 容量を60%は小さくするよ
 - Qt Liteの設定ツールの目標(自由度を上げる・管理を簡単にするなど)
 - qmakeを使う
 - 設定にJSONの対応
 - 新しくGUIツール作る
 - QML Samegameを例にすると
   5.6 dynamic 25MB弱
   5.6 static 14MBくらい
   5.8 dynamic 25MB弱
   5.8 static 10MB弱
   5.8 Lite 5MB

 Qt Quickの描画エンジンでDirect 3D 12の対応もしている話もあり。Vulkanの対応?まだよ。もしかしたらQVulkanWindowとかかなって話題とか。
 Qt Creatorの導入ってセッションもあったので、某氏が本を書いているのでネタを少しくらい拾えるかなーと思って参加してみました。主に便利なショートカット覚えようぜがメインだったのですが、セッション機能とか、Q_PROPERTY(~)からメンバ各種を生成できる機能を初めてしって衝撃を受けてました。
 WindowsのUWP関連の話としては、前半は「Status Update on Qt for WinRT / UWP」に書いてある内容なのかなーと思いつつ、(ちゃんと読んでなかったので)Hololensやxboxも対応するんだーと見てました。5.8の対応としてD3D12バックエンド対応などと、5.9での対応として印刷やFile I/O v2(ってなんだ)など上げられてました)。あとは、ストアについてとか。アプリへSDKバージョンを設定方法(Windows 10の細かいバージョンの違いに合わせて適切に設定する方法)とか。
 Qt Quick Control 2の紹介してくれているセッションはスライドの字が小さすぎてツラかった。でも、スライドの中に動くUIが埋まってました(どうやって実現しているのかはサラッとしゃべってたのか・・・・・・)。


/// 展示など ///


 展示は、こんな感じでした。
 この写真の反対側(という左の方)に自動車関係が多くメーターパネルを展示しているところがずらっとありました。
 IMAG0452.jpg
 一角では、LTスペースもありました。 
 IMAG0451.jpg

 日本から来て展示している企業さんもいました。「sdtech」さんで唯一まともに話ができました(そりゃそうなんですが)。
 デザイナーさんと技術屋さんとの橋渡しとして、Illustratorで作ったモックをQMLに変換して、Photoshopで取り込んで画像を作って再出力、そしてQt Creatorで読み込んで実行という流れができるAdobe系のプラグインをデモされてました。凄いなーと思いましたよ。


/// まとめ ///


 基本的に画面関係はQt Quick前提でした。そーいう流れだってのは聞いてましたが、実感できました。
 特に車関係のところでQMLで画面を作って~って感じの話が聞けたので、UIは実際にQMLへ移行していってるんだなーという印象です。
 日本で話していると、なかなか移行できずにいるのを感じていた(耳に入る範囲なのでごく一部ですが)ので、最先端は違うなと思いました。
 それでも、ここ最近は徐々にQML使ってるよって話しも増えているので、皆さん恐れず使って欲しいですね。

 もっとちゃんと英語で説明されている内容を聞いてまとめられると良いのですけど、雰囲気だけでも感じていただければと思います。
 (その割に、以外と写真を撮り忘れてて、ダメダメですね。書いていて受付の写真忘れたーとか色々です)

電子書籍(epub)作成ツール「LeME」はQtで作ってます

 先日、リリースしたLeMEですが、いつものようにQtで作りました。
 ソースは今のところオープンにしていないですし、オープンになってても実際に中身を見てみようと思う方は中々いないと思うので、少し紹介です。
 これからのQtアプリ(どれくらいの規模に耐えられるのは分かりませんが)のスタンダードな作り方になるんじゃないかなーと思います。
 あくまでも構成的な話しなので、具体的な実装方法とかは今回はないです。

/// 構成 ///
 ざっくりと構成を図にすると下のようになります。
 path4250.png

 それぞれをざっくり説明するとこんな感じです。
①UI
 UIです。QMLを使用します。
 Qt Quick Controlsも2.0になって、ますますパワーアップして使い勝手が良くなってます。今回は使用していませんが、マテリアルデザインにさくっと変更することもできます。
 Qt Quickデザイナーが復活してhoge.qmlとhoge.ui.qmlという2つのファイルを組み合わせてデザインとロジックを分離する方式の作成方法も使用しました。
 レイアウトについてはRowLayoutなどが追加されてから、いろいろ強化されているのですが、デザイナーが使えるようになってわかりやすくなったと思います。

②読み書きクラスとのI/Fエレメント
 ユーザー操作や設定などを読み書きクラスへ届けます。逆に結果をユーザーに届けたりします。本の情報とかを保存したり、読み出したりと簡単なことをC++で書きます。
 他には、本に変換するコンテンツの一覧を管理するモデルクラスも作成します。それ程小難しいことはしませんが、ファイルの種類をQML側に伝えたりUI表示に必要な情報を提供します。

③読み書きクラス
 Wordファイルを解析したり、epubファイルを生成したりします。ここはC++のみでゴリゴリいきます。

④Qt Quick標準エレメント
 標準のエレメントです。見た目の部分をQMLで書かれていたりもします。

⑤Qt標準クラス
 言わずと知れたQtが提供する豊富なライブラリ群


/// Qt Quickデザイナーを使用するときの小ネタ ///
 見た目のないエレメントを配置すると左のツリーで思った通りの操作ができなくなります。
 文字通りツリーに表示されないのにいる扱いされて良く分からなくなります。
 なので、*.ui.qmlに見た目のないエレメントを手書きしないのが無難です。*.qmlをデザイナーで編集するときは注意しましょう。

/// まとめ? ///
 UIはQMLで作ります。
 アプリケーションのメイン機能はC++で作ります。
 見た目のない(今回の②)は、とても簡単です。まずは、この辺りから試して見ましょう。
 標準で用意されていない見た目を作りたいときはC++でエレメントを作ることになります(今回はない)。
 C++の部分は、今までどおりのQtプログラミングです。

 今回のソースコード8割弱はC++でした(Githubのリポジトリで表示される数字)。
 QMLかーと思っていても大丈夫です。全体から見ればそうでもないで安心してください(本当か?アプリ次第ですね)。
 ちょっと不安だなーと思われましたら、「Qt Quickを使いこなすクロスプラットフォームUIプログラミング+」という本があります。良ければ、どうぞ。

/// おまけ ///
 配布に使用しているインストーラに「Qt Installer Framework」を使用しています。
 こちらは、ちょこちょこっと設定ファイルを書くと簡単にインストーラを作成できます。
 ちなみに、解説書の「インストーラを作ろう!」と「インストーラを作ろう!!」があります。良ければ、どうぞ。
 作成方法と自動化で前後編になっています。

 作りました。
 夏休みくらいからチマチマ作業を進めて、いったんリリースしました。XMLとXHTMLとの長い戦いでした^^
 最初は、小説がルビ付きで変換できれば、いいやーくらい思っていたのに随分Wordファイルを再現できるようになってしまいました。
 それでも、いろいろ足りないところはあるかと思いますが、結構頑張ってます。
(だってー、某太郎さんのepub出力で画像の扱いが思い通りにいかないんだもん。挿絵が変なふうにしか出力できないんだもん)
 いつもは、アプリを作ってもこのブログで適当に配布していましたが、専用サイトっぽいものも作って見ました。

 公式サイト:LeME -Let's make ebooks!-

 上記のサイトにも書いてますが、作れる本は
 ・小説など文字が中心の本(縦書き)
 ・技術書など文字が中心の本(横書き)
 ・漫画、イラスト集、写真集など画像が中心の本
 です。

 売りっぽいところは
 ・Wordファイルの変換(Officeインストールしてなくてもできます)対応
 ・BOOK☆WALKERさんのめがイラスト(巻頭のカラー口絵で横にスクロールするやつ)対応
 ・リフローの縦書き・横書き対応
 ・QtなのでLinux系やMacへも移植が簡単(Linuxでは動くのは確認してます)

 漫画とか画像を並べるだけのは割と簡単なんですが、テキスト系はちょっと大変でした。
 Wordだと表とかスタイルとかいろいろ勉強になりました。Wordは2007からOffice Open XMLという形式(docx)なったため、ファイルフォーマットが誰でも知ることができるようになりました。なので、実現出来たわけです。.NETを使えばもっと簡単なのですが、クロスプラットフォームに一応したかったので。
 ファイルフォーマットについて知りたい方は以下のサイトを参照してみてください。

 ・Microsoft:Office Open XML と ECMA-376 仕様
 ・Wikipedia:Office Open XML

 注意事項としては、Wordファイルのすべての機能に対応しているわけではないので、思い通りな結果にならないかもしれないと言うことです。あと、epubに変換する上で不要だと思われる内容もそぎ落とす方針で進めてます。
 図が変換できないのが、現状の最大の弱点でしょうか。簡単な図形からだけでも変換できるようにしたいなぁ。ところで、図が「ここから下はアプリ独自に定義できるタグね(僕の解釈が間違ってなければ)」ってところにあることなんですが、なんでですかねぇ(棒

 最後に、今回のアプリは(使ってもらえたら)商売に直結できるので、課金要素を追加しました。基本無償ですが、本の最後に必ずロゴが入るようにしています。課金すると外せるようになります(早く課金方法を作らないと・・・)。

 もし、興味がある方はお試しいただけると嬉しいです。
 ご意見ご要望は随時受け付けてます。聞き遂げられる保証はありませんけど・・・・・・(これはいつもどおり)。


 夏コミの新刊情報のお知らせです。
 今年もなんだかんだと小説を続けてます。継続が力になると良いですね。
 さて、本作も「小説家になろう」に投稿している作品の書籍化です。
 表紙と挿絵が入りますので、お得度アップです。ぜひ、手に取って見てほしいです。
 当日、スペースにてお待ちしております。


販促用(表紙のみ).jpg

/// 情報 ///
サークル名:理ろぐ
場所:水曜日 東パ14a
ページ数:228ページ
予価:800円
著者:あやねいおり
イラスト:ましろ.あー。(pixiv)

/// 内容 ///
少女はひとり世界の終焉を見ていた。
それは、幾度となく繰り返され、そのたびに悲劇を目の当たりにする。
終焉を避けることはできず、いつしか目の当たりにする悲劇にすら慣れてしまっていたころ。
ひとりの少年との出会いを境に事態は好転する。
そして、同時にある感情が芽生えていた。
少女は、その感情と、世界の行く末を変えた理由を知ることになる。


技術書オンリーの同人誌イベントの技術書典に参加します。

/// イベント情報 ///
 日時:2016/6/25(土)
 場所:秋葉原通運会館
 主催:TechBooster/達人出版会
 イベントバックアップ:日光企画
 URL:https://techbookfest.github.io/

本日、当落発表がされ、「理ろぐ」は無事スペースをいただくことができました。
 サークル名:理ろぐ
 スペース:A-27(2F)


/// 頒布予定 ///
・インストーラを作ろう!!
 去年の夏コミ(C88)で頒布したQt Installer Framework本の続編。
 インストーラの自動実行などがテーマです。
 目次など
 20160506_hyoushi_only.jpg

・Qt Quickを使いこなすクロスプラットフォームUIプログラミング+
 一昨年の夏コミ(C86)で頒布したQt Quick本のQt5.6対応とちょっと追加です。
 こちらは鋭意制作中ですが、どうなるかはちょっと怪しいかも^^;
 Qt Quickデザイナーについても少しふれてます(これだけ知ってれば何とかなる的な)。
 無事に入稿できたので頒布決定です!
 目次など
 hyoushi.jpg

/// 特典情報 ///
 当日頒布する本、既刊を含めてご購入して頂いた方にはPDF版の
 ダウンロードURL付きカードをお配りします。
 (作業が間に合えば本に挟んだ状態にします)
 

/// 委託情報 ///
 qmake入門
 @hermit4さんによるqmakeの解説本を委託頒布します。
 知ってそうで知らなかったQtの奥深さが分かる一冊です!


詳細は決まり次第、ブログやTwitterと合わせて告知していきます。
当日、参加した皆さんとお会いできることを楽しみにしております。

 一太郎を使用したepubファイルの作成方法です。

 一太郎には電子書籍用フォーマットであるepub形式での出力が可能です。が、挿絵を入れようとすると少し工夫(というか後加工)が必要です。
 何が起こるかは「一太郎から挿絵を入れた小説(縦書き)をepub形式で出力するときの一工夫」を参照してください。
 前回の記事の内容でも概ねOKなのですが、欲がでてきます。実際に出版社さんで作られているように作りたくなります。挿絵のページには、ノンブルを表示しないとか、巻頭のカラー口絵に横長のイラストを表示してページ内横スクロールをしてみたいなど。
 というわけで、調べてみました。


/// 出版業界のガイドライン ///
 今更かよって感じもありますが、「一般社団法人 日本電子書籍出版協会」という組織がありガイドラインを公開しています。そこでは、サンプルやテンプレートも配布しています。
 また、「KADOKAWA-EPUB 制作仕様」という情報も公開されています。こちらは日本電子書籍協会が公開しているガイドラインを拡張して複数のストアで配布可能なepubを作成すると共に社内のデータの統一を図っているようです。リンク先に「KADOKAWA-EPUB 制作仕様」の概要をまとめた資料や実際の仕様・サンプルも見られます。
「KADOKAWA-EPUB 制作仕様」でダウンロードできる仕様の中で、「角川書店BC向け仕様ver.2.1.1(サンプル修正版)」が参照でき、いわゆるBOOKWAKERなどで販売しているファイルの仕様が見られます。
 今回は、これを参考にしました。


/// 目標 ///
 一太郎から出力されるデータを最大限利用し、最小限の修正でリリース可能なepubを作成する。
(ガイドラインを参考に自力作成ツールの作成も考えましたが、そんなに繰り返し作業するわけでもないので保留しました。)

 今回のサンプルでは書籍の構成として、以下を最終形とします。
 ・表紙
 ・カラー口絵(横長)
 ・本文(章が1つに挿絵1つ)


/// サンプル ///
 諸事情により画像ファイルは削除したが、変更前後を確認しやすいようにepubの中身のアーカイブを用意した。
 WinMergeなどを使用して比較してください。
  修正内容比較用サンプル


/// 一太郎で本文の作成 ///
 挿絵を入れる場所をハッキリさせるために、文章中に実際に埋め込みたい挿絵用の画像ファイルを埋め込みます。
 文字よけの設定を「配置しない」として行の間に画像が入るようにだけします。その際、改ページ設定などは特に必要ありません。
 カラー口絵用のイラストは文章の先頭に入れておくと後で画像のコピーを手動でしなくて良くなるため楽です。


/// 一太郎からの出力 ///
 epubの出力機能を使用しますが、以下の項目は必須です。
 ・「表紙」を「画像」で選択する
 ・「種類」を「リフロー」にする
 その他の作者情報などは、適宜設定してください。
 screenshot_ichitaro_2_epub.png


/// ファイル構成 ///
 出力したファイルを解凍します。章が1つの場合の例になりますが、以下のようになります。
┬META-INF
│├com.apple.ibooks.display-options.xml
│└container.xml
├OEBPS
│├content.opf    ......[1]
│├cover.xhtml    ......[2]
│├coverstyle.css    ......[3]
│├document1.xhtml    ......[4]
│├nav.xhtml
│├stylehorizontal.css
│├stylevertical.css
│├toc.ncx
│└images
│ ├coverimage.jpg
│ ├gallery.jpg
│ └artwork.jpg
└mimetype
 数字のついているファイルが修正対象です。
 詳細は後述しますが、最終的に以下のファイル構成になるように修正します。
┬META-INF
│├com.apple.ibooks.display-options.xml
│└container.xml
├OEBPS
│├content.opf    ......[1]
│├cover.xhtml    ......[2]
│├coverstyle.css    ......[3]
│├document1.xhtml    ......[4]
│├document1-2.xhtml    ......[*]
│├document1-3.xhtml    ......[*]
│├gallery.xhtml    ......[*]
│├nav.xhtml
│├stylehorizontal.css
│├stylevertical.css
│├toc.ncx
│└images
│ ├coverimage.jpg
│ ├gallery.jpg
│ └artwork.jpg
└mimetype
 [*]のついたファイルが追加するファイルです。
 初期状態では、カラー口絵としてのページが存在しないため「gallery.xhtml」を追加し、挿絵は単体のファイルにするため「document1.xhtml」を3つに分解します。


/// [1] content.opfの修正 ///
 ここには書籍全体で扱うファイルの情報を修正・追加をします。
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<package xmlns="http://www.idpf.org/2007/opf" version="3.0" unique-identifier="pub-id" xml:lang="ja"
 prefix="rendition: http://www.idpf.org/vocab/rendition/#
         access: http://www.access-company.com/2012/layout#"
>
略
  <manifest>
    <item id="ncx" href="toc.ncx" media-type="application/x-dtbncx+xml"/>
    <item id="nav" href="nav.xhtml" media-type="application/xhtml+xml" properties="nav"/>
    <item id="cover" href="cover.xhtml" media-type="application/xhtml+xml" properties="svg"/>
    <item id="gallery" href="gallery.xhtml" media-type="application/xhtml+xml" properties="svg"/>
    <item id="csscover" href="coverstyle.css" media-type="text/css"/>
    <item id="doc1" href="document1.xhtml" media-type="application/xhtml+xml"/>
    <item id="doc1-2" href="document1-2.xhtml" media-type="application/xhtml+xml" properties="svg"/>
    <item id="doc1-3" href="document1-3.xhtml" media-type="application/xhtml+xml"/>
    <item id="cssvert" href="stylevertical.css" media-type="text/css"/>
    <item id="csshori" href="stylehorizontal.css" media-type="text/css"/>
    <item id="img1" href="images/gallery.jpg" media-type="image/jpeg"/>
    <item id="img2" href="images/artwork.jpg" media-type="image/jpeg"/>
    <item id="img3" href="images/coverimage.jpg" media-type="image/jpeg" properties="cover-image"/>
  </manifest>
  <spine toc="ncx" page-progression-direction="rtl">
    <itemref idref="cover" linear="yes" properties="rendition:layout-pre-paginated rendition:spread-none rendition:page-spread-center"/>
    <itemref idref="gallery" linear="yes" properties="rendition:layout-pre-paginated rendition:spread-none rendition:page-spread-center access:scroll-both access:orientation-portrait"/>
    <itemref idref="nav" linear="no"/>
    <itemref idref="doc1"/>
    <itemref idref="doc1-2" linear="yes" properties="rendition:layout-pre-paginated rendition:spread-none rendition:page-spread-center"/>
    <itemref idref="doc1-3"/>
  </spine>
</package>
 <package>タグで属性「prefix」を追加します。忘れるとチェッカーでエラーになります。

 <manifest>タグの中で、使用するファイルの定義をします。
 イラストを表示するページには、属性「properties="svg"」を追加します。
 
 <spine>タグの中で、表示するページの順番を定義します。
 イラストを表示するページには、属性を追加します。
 属性「linear="yes"」でリーダーの都合で非表示にされなくなります。なので、全部に追加しても良い。必須ではありません。
 属性「properties」で表示方法を指定する。特に横長イラストを表示するgalleryにはスクロールと向きを指定します。


/// [2]cover.xhtmlの修正と、gallery.xhtmlの追加 ///
 表紙を画面全体にフィットするようにタグを修正する。
略
  <head>
    <title>epubに挿絵</title>
    <link type="text/css" rel="stylesheet" href="coverstyle.css"/>
    <meta name="viewport" content="width=1444, height=2037"/>
  </head>
  <body>
    <svg xmlns="http://www.w3.org/2000/svg" version="1.1"
         xmlns:xlink="http://www.w3.org/1999/xlink"
         width="100%" height="100%" viewBox="0 0 1444 2037">
      <image width="1444" height="2037" xlink:href="images/coverimage.jpg"/>
    </svg>
  </body>
</html>
 <meta>タグで画像のサイズを指定する。横スクロールする場合は特に重要でこの指定がないと思った通りの挙動をしません。

 <img>タグは、<svg>タグと<image>タグに書き換えます。こちらでも画像の実サイズを指定します。

 なお、「gallery.xhtml」はこのファイルをコピーして作成します。
 表紙との違いは、画像ファイルのパスとサイズだけです。横スクロールに関する内容は「content.opf」でしているので、ここでは何もしません。
(一太郎から出力する時点でカラー口絵用のイラストを差し込んでいなかった場合は、画像ファイルをこの時点でコピーしても構いません。)


/// [3]coverstyle.cssの修正///
 <svg>タグのスタイルを追加します。
svg {
  margin:    0;
  padding:   0;
}


/// [4]document1.xhtmlの修正 ///
 このファイルは、以下の役割で3つに分割します。目次に関連する情報を修正しなくても良いように元のファイル名は変更しません。
  ・document1.xhtml  本文の前半(挿絵より前)
  ・document1-2.xhtml 挿絵のみ
  ・document1-3.xhtml 本文の後半(挿絵より後)

「document1-2.xhtml」は、「cover.xhtml」をコピーして「gallery.xhtml」と同様に作成します。
 その他の前半と後半用のファイルは、<img>タグを検索して前と後ろを消します。ファイル最後の閉じタグを消さないように注意してください。
 また、カラー口絵用の画像を予め入れていた場合は、それようの<img>タグも消してください。


/// 修正ファイルをepubファイルに戻す ///
 Windowsの標準機能で圧縮できます。
 ただし、最初に「mimetype」ファイルだけを圧縮したファイルを作成してから、「META-INF」「OEBPS」フォルダを追加します。
 「mimetype」が先頭にないとチェッカーでエラーになります。


/// チェッカーでチェック ///
 EpubCheckというツールで行います。
 https://github.com/IDPF/epubcheck
 (この記事執筆時のバージョンは4.0.1です)
 残念ながらjavaアプリかつ、コマンドラインから実行しなければなりません。
>java -jar epubcheck.jar hoge.epub
EPUB version 3.0.1 のルールを使って検証します.
エラーも警告も検出されませんでした.
epubcheck 完了
 ↑エラーがないときの実行結果です。


以上です。折角、書いた作品を格好良い感じにしましょう!

イラスト:ましろ.あー。さん


 

 一太郎にはepub形式でドキュメントを出力する機能がついています。そのため、自分で書いた作品をepub形式に対応したリーダーや端末で読むことができます。この機能があるために一太郎を買ったと言っても過言ではありません。
 ただ、この機能完璧ではないようです。自分は日本語の小説を出力したかったので縦書きで、そこへ挿絵を入れようとしたら困ったことになりました。
 そこで、なんとか対処するための方法をまとめた記事になります。
 ただ、対処といっても完璧ではないです。市販の小説のような感じにはできていません。そのうちなんとかしたいですね。
 それと、作成したepubファイルの確認でAndroid版のBOOKWALKERアプリを使用しています。使用方法は、こちらの記事「自作の電子書籍(EPUB/MOBI)をスマートフォンで読む」を確認してください。

/// 現状確認 ///
 一太郎の編集画面で以下のように画像をページ一杯に貼り付けて出力しました。

 ichitaro-editing.png

 出力した結果を携帯のBOOKWAKERのアプリに読み込ませると以下のようになりました。
 少しわかりにくいですが、左が手を離して表示しているところ、右が指でページ送りをしようとスライドしているところです。左上のページ番号とタイトル的なものの表示位置を見るとなんとなく伝わるのではと思います。

Screenshot_2016-03-01-21-32-29.png Screenshot_2016-03-01-21-32-25.png

 画像の縦横比が少しおかしくなっている上に、画像がページをまたいでしまいました。これでは困ります。
 一太郎で出力するときの設定をいじってみましたが、うまくいく気配がありませんでした。
 もしかすると、レイアウトを固定にするとうまくいくのかも知れませんが、小説なのでリフロー設定にしないと折り返しなどが固定になるPDFと変わらなくなってしまいます。
 というわけで、なんとかします。
 
/// epub形式について ///
 まず、epubは電子書籍用に整理されたXHTMLをzipで圧縮したファイルです。なので、普通の圧縮解凍ソフトで解凍できます。
 一太郎から出力されたepubファイルを解凍すると以下のようなフォルダ構成(例)になっています。
┬META-INF
│├com.apple.ibooks.display-options.xml
│└container.xml    ......起点で「OEBPS/content.opf」が指定されている
├OEBPS
│├content.opf     ......使用するファイルの登録とか
│├document1.xhtml   ......本文
│├nav.xhtml      ......目次
│├stylehorizontal.css ......横向きのスタイルシート
│├stylevertical.css  ......縦向きのスタイルシート
│├toc.ncx       ......タイトルや目次情報
│└images        ......画像ファイル
│ ├hoge1.png
│ └hoge2.jpg
└mimetype
 章を区切っていると、章単位でdocument1.xhtml, document2.xhtml......と連番がふられたファイルが作成されます。
 epubについて詳細を知りたい方は、公式サイトをご覧ください。

/// xhtmlとスタイルを修正 ///
 xhtmlを少し修正して、元々あるスタイルをコピーして都合の良い内容に変更する。が、今回することです。

 今回の対象ファイル
  ・document1.xhtml
  ・stylehorizontal.css
  ・stylevertical.css
  (これらのファイルを一時的に解凍して編集します。)

 実際に出力すると「document1.xhtml」ファイルに以下のような<img>タグが埋め込まれます。
    

義乃は笑う口元を握った手で隠しながら、末永の正面に立つ。視界の中を移動する笑顔。揺れる髪。末永には本当にキラキラと輝いて見えた。

 

窓から差し込む傾きかけたの光のせいだろうか、と考えるが、いつも通りの教室だ。

 この例では、<img>タグを収める<p>タグがあります。このタグで指定されているクラス「div5」を別の名前に変更します。重複しそうにない名称なら何でも良いです。ここでは「artwork1」とします(以下、変更後)。
 また、<span>タグと<img>タグに指定されたclass属性も消します。次の行にある空の<p>タグも消します。空のタグは一太郎上でどのように画像を差し込むかで変化すると思います。
    

義乃は笑う口元を握った手で隠しながら、末永の正面に立つ。視界の中を移動する笑顔。揺れる髪。末永には本当にキラキラと輝いて見えた。

窓から差し込む傾きかけたの光のせいだろうか、と考えるが、いつも通りの教室だ。


 続いて、スタイルシートを修正します。「stylehorizontal.css」と「stylevertical.css」で同じ事をします。
 それぞれのファイルで「div5」を検索して、複製し、名称を「artwork1」に変更します。
 そして、いくつか項目を追加します。
.artwork1 {
    -epub-break-after: always;
    -moz-break-after: always;
    -ms-break-after: always;
    -o-break-after: always;
    -webkit-page-break-after: always;
    break-after: always;
    page-break-after: always;
    text-align: center;
/*    text-indent: 1.10em;*/
/* これ以降追加 */
    margin: 0;
    padding: 0;
    max-height: 100%;
    max-width: 100%;
}

 編集が終わったら、epubファイルへ戻します。
 そして、出来上がったファイルを携帯へ転送してBOOKWALKERアプリで表示すると以下のようになります。
 フル画面にはできませんが、ちゃんと縦横比は維持されて表示されます。ダブルタップすれば拡大表示もできます。
 なお、画像ファイルは元ファイルがそのままepubの中に収められるので解像度の高いファイルを指定すれば拡大して綺麗に見られます。

 Screenshot_2016-03-01-22-43-27.png Screenshot_2016-03-01-22-43-38.png
 Screenshot_2016-03-01-22-47-30.png

 これで一応、目標達成です。
 いろいろ突っ込みどころあると思いますので、詳しい方がいましたら是非ご教授いただきたく。

 今回は、挿絵を本文と同じファイルに含めているので(おそらく)フル画面にはできません。フル画面にしたい場合は、挿絵が入る章のファイルを分割して、挿絵だけのファイルを作成する必要があると思っています。
 そのうち試してみよう!
 縦書きの小説に限定すればWordで書いてVBAでepub吐き出すのも何とかなるんじゃないかとか思ってしまったのは、気のせい。

イラスト:ましろ.あー。さん