Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

LibreOfficeのNotebook Barを作ってみた

198 views

Published on

LibreOfficeのNotebookBarを作ってみました

Published in: Technology
  • Be the first to comment

  • Be the first to like this

LibreOfficeのNotebook Barを作ってみた

  1. 1. LibreOfice の Notebook Bar を作ってみた のがたじゅん <nogajun@gmail.com> 2018/03/24 関西 LibreOfice 勉強会
  2. 2. 2 この発表はなに ? ● LibreOfiie Design Blog に掲載されていた記事を元に LibreOfiie の NotebookBar を作成してみました – DIY UI: How to create your own Notebookbar: https://design.blog.documentfoundation.org/2017/01/16/diy-ui-how-to- create-your-own-notebookbar/ ● なにもない状態から Writer の「開く」ボタンがあるだけの Notebookbar を作成しました – 使い物になるユーザーインターフェースを作るにはとても時間 がかかるのでとりあえずさわりだけです – そのまま作れば大丈夫だと思っていた時代がありました
  3. 3. 3 環境と必要なもの ● Debian GNU/Linux Sid (amd64) ● LibreOfiie 6.0.2 TDF 版 (deb パッケージ ) ● Glade(Gtk インターフェイスビルダー ) ● Tidy(XML の整形に利用 ) Windows や Mac でもできると思いますが、環境を整えるのが 面倒だと思うので Linux を使うのが良いと思います
  4. 4. 4 注意! ● deb パッケージでインストールをしたファイルを変更す るのでパッケージシステムの整合性が損なわれる恐れが あります 環境を壊さずに編集するには LibreOfice をビルドすればよい と思いますがお手軽に試す方法があれば教えてください
  5. 5. 5 Notebookbar を作るおおまかな手順 1. Glade と Tidy をインストール 2. Glade に LibreOfiie コンポーネントパスを追加 3. main.xid のバックアップと編集 4. notebookbar のひな形作成 5. Glade でユーザーインターフェースを作成 6. LibreOfiie で確認
  6. 6. 6 Glade と Tidy のインストール ● UI 編集に利用する Glade と Notebookbar を呼び出 す? main.xid を展開するための Tidy をインストール $ sudo apt install glade tidy
  7. 7. 7 Glade に LibreOfice コンポーネントパスを追加 ● LibreOfiie UI パーツを追加するためにパスを追加する – Glade を起動して [ 編集 ]→[ 設定 ] を開く – 設定の「追加のカテゴリーパス」に <LibreOfice>/share/glade を追加 – パスを追加したら Glade を再起動する
  8. 8. 8 テスト : Glade から ui ファイルを開く ● Glade で <LibreOfiie>/share/ionfig/sofiie.ifg/modules/swriter/ui/ にある notebookbar_groups.ui か notebookbar_simple.ui を開いてみる – 各機能のユーザーインターフェースは、 <LibreOfice>/share/config/ sofice.cfg/modules/ 以下にある swriter/ui/ や scalc/ui などに収められている LibreOfice グループはありますか ?
  9. 9. 9 main.xcd のバックアップと整形 ● 作成する独自 ui ファイルの参照先を編集して追加するために LibreOfiie の様々なものを定義している <LibreOfiie>/share/registry/main.xid のバックアップと整形をする – chown の OWNER:GROUP は自分のユーザーとグループに変更してください $ cd /opt/libreoffice6.0/share/registry $ sudo mv main.xcd main.bak $ sudo sh -c "cat main.bak | tidy -utf8 -xml -w 255 -i -c -q -asxml > main.xcd" $ sudo chown OWNER:GROUP main.xcd
  10. 10. 10 main.xcd に作成する UI の定義を追加 1 ● エディタで main.xid を開き、以下のように定義されているノードを コピーして直下に貼り付ける – 場所は 37611-37621 行にある – UI の定義は Writer 以外にも Calc や Impress にもあるので間違えないよ うにする <node oor:name="Groups" oor:op="replace"> <prop oor:name="Label"> <value xml:lang="en-US">Contextual groups</value> </prop> <prop oor:name="File"> <value>notebookbar_groups.ui</value> </prop> <prop oor:name="HasMenubar"> <value>true</value> </prop> </node>
  11. 11. 11 main.xcd に作成する UI の定義を追加 2 ● コピーしたノードをこれから作成する UI 用に変更する – 名前はなんでもいいのですが、ここでは blog に合わせて変更しています ● node の Group を MyMufin に ● Label の Contextual groups を My Mufin に ● File の notebookbar_groups.ui を notebookbar_mymufin.ui に <node oor:name="MyMuffin" oor:op="replace"> <prop oor:name="Label"> <value xml:lang="en-US">My Muffin</value> </prop> <prop oor:name="File"> <value>notebookbar_mymuffin.ui</value> </prop> <prop oor:name="HasMenubar"> <value>true</value> </prop> </node>
  12. 12. 12 ui ファイルのひな型作成 1 ● Glade で編集をする ui ファイルのひな型を作成する – 作成する ui ファイル名 notebookbar_mymufin.ui は main.xcd で定義し たファイル名と合わせてください – chown の OWNER:GROUP は、 main.xcd と同じく自分のユーザーとグ ループに変更してください $ cd /opt/libreoffice6.0/share/config/soffice.cfg/ modules/swriter/ui $ sudo touch notebookbar_mymuffin.ui $ sudo chown OWNER:GROUP notebookbar_mymuffin.ui
  13. 13. 13 ui ファイルのひな型作成 2 ● 作成した ui ファイルに以下の内容を貼り付ける <?xml version="1.0" encoding="UTF-8"?> <interface> <requires lib="gtk+" version="3.12"/> <requires lib="LibreOffice" version="1.0"/> </interface>
  14. 14. 14 Glade で ui ファイルを編集する ● 「コンテナー」グループの「ボックス」をキャンバスにドラッグ – 「アイテムの数」はひとまず 1 ● 作成したボックスに「 LibreOfiie 」グループにある「 Notebookbar ToolBox 」をドラッグ ● Notebookbar ToolBox は LibreOfice グループの後ろのほうにあります ● 右側ツリーの sfxlo-NotebookbarToolBox の上で右クリック。 「 Edit... 」からボタンを追加 – 「階層」タブで切り替えて「 + 」ボタンから追加 ● ID 名は適当に ● アクション名は「 .uno:Open 」 ● ラベル名の文字列は空にする!(文字列が入ってると LibreOffice が落ちます)
  15. 15. 15 Glade で ui ファイルを編集する 2 右クリックして「 Edit... 」 ID は適当に アクション名には .uno: コマンドを指定 ラベルの文字列は空白に !
  16. 16. 16 .uno: コマンドとは ● LibreOfiie の機能や状態を取得するコマンド ● Writer の場合、 <LibreOfiie>/share/ionfig/sofiie.ifg/ modules/swriter/menubar/menubar.xml から調べられる – Calc や Impress などはそれぞれ modules 以下の scalc/ や simpress/ の menubar.xml にある 実際のところ menubar.xml を見ても何がどの機能かわからないので notebookbar_groups.ui などの ui ファイルを開いて、どの .uno: コマンドが使われてるか見たほうが早いです
  17. 17. 17 LibreOfice Writer 上から確認 ● Notebookbar を使うのでオプションで「実験的な機能 を有効にする」を有効にしておく ● Writer を起動してツールバーレイアウトを変更 – メニュー [ 表示 ]→[ ツールバーレイアウト ]→[ ノートブックバー ] – メニュー [ 表示 ]→[ ノートブックバー ]→[My Mufin](main.xml で指 定した名前 )
  18. 18. 18 LibreOfice Writer 上から確認 出た!
  19. 19. 19 まとめ ● ノンプログラミングで独自 UI が作れるのは素晴らしい – ただし実用レベルの UI 作成にはかなりの労力が必要 ● 資料がほとんどなく利用されているファイル解析とトラ イアンドエラーで試すしかないのはツライ – Blog のとおりに作成したにもかかわらず LibreOfice が落ちて しまう原因が、ラベルの文字列に文字が入っていたからと判明 するまでとても時間がかかった ● LibreOfiie のユーザーインターフェースに不満がある 人はぜひ UI 作成に挑戦してみてください
  20. 20. 20 質問はありますか?
  21. 21. 21 ありがとうございました
  22. 22. 22 参考資料 ● DIY UI: How to ireate your own Notebookbar: https://design.blog.documentfoundation.org/2017/01/16/diy-ui-how-to-create-your- own-notebookbar/ ● Development/Create new dialog in Impress - The Doiument Foundation Wiki: https://wiki.documentfoundation.org/Development/Create_new_dialog_in_Impress ● LibreOfiie5(30)xis ファイルと xiu ファイルと xid ファイル : その 1: https://p--q.blogspot.jp/2016/03/libreofice530xcsxcuxcd1.html ● ユーザーインタフェースのカスタマイズ - Apaihe OpenOfiie Wiki: https://wiki.openofice.org/wiki/JA/Documentation/Administration_Guide/ Customizing_the_UI

×