「SE New Feature No.13」の編集履歴（バックアップ）一覧に戻る
SE New Feature No.13 - (2005/10/11 (火) 19:04:17) の編集履歴(バックアップ)
PictBearを自分流にカスタマイズする PART３
1. 今度はカスタマイズの「メニュー」動作を確認してみましょう。
「メニュー」を開くと下図の表示がされます。
2. まず左側のアプリフレームメニューについて説明します。
この項目の「メニューを表示するカテゴリ」で「イメージ」を見てみましょう。
3. 上記の状態でメニューバー表示を見ると、下図のようにイメージ操作している時に表示されるメニューの表示になります。
4. 今度は「デフォルトメニュー」を見てみましょう。
5. 上記の状態でメニューバー表示を見ると、下図のようにイメージが何も開かれていない時に表示されるメニューの表示になります。
6. では具体的にアプリフレームメニューの動きを確認してみます。
確認する前に下図のようにメニューバーの「スクリプト」と「ウィンドウ」の間に、新規作成コマンドを追加しておきます。
7. 上記の状態でカスタマイズダイアログの「メニューを表示するカテゴリ」で「イメージ」を指定し、「リセット」ボタンをクリックしてみます。
8. すると下図のような確認ダイアログが表示されます。
リセット処理を行なう場合は「はい」、操作を中止する場合は「いいえ」をクリックします。
ここでは操作を行なうので、「はい」をクリックします。
9. 処理が実行されると先程追加したコマンドが消えてメニューバーが初期状態に戻っていることが確認できます。
この動作は「デフォルトメニュー」でも同じです。
また、前に説明した「ツールバー」のカスタマイズであったリセット動作と同様ですが、このメニュータブでは「デフォルトメニュー」も表示やリセット動作が出来ますので、さらにカスタマイズ可能な状態になります。
10. 次に今の下に表示がある「メニューの表示方法」の動作確認をしてみましょう。
最初は「標準」を選択した時の動作を確認しますので、下図のように「標準」を選択してカスタマイズを閉じます。
11. 上記の設定でここでのサンプル表示としてメニューの「選択範囲」をクリックしてみます。
すると下図のようにクリックすると、一瞬でメニューの詳細が表示されます。
この動作が「標準」動作になります。
（実際の動作と表示速さは異なります）
12. 次に下図のように「メニューの表示方法」を「展開」に設定して動作を確認してみましょう。
設定できたらカスタマイズダイアログを閉じます。
13. 上記の設定でここでのサンプル表示としてメニューの「選択範囲」をクリックしてみます。
すると下図のようにクリックすると、左上から徐々に表示が展開されるのが確認出来ると思われます。
この動作が「展開」動作になります。
（実際の動作と表示速さは異なります）
14. 次に下図のように「メニューの表示方法」を「スライド」に設定して動作を確認してみましょう。
設定できたらカスタマイズダイアログを閉じます。
15. 上記の設定でここでのサンプル表示としてメニューの「選択範囲」をクリックしてみます。
すると右図のようにクリックすると、上から徐々に下に向かって表示がスライドされるのが確認出来ると思われます。
この動作が「スライド」動作になります。
（実際の動作と表示速さは異なります）
16. 次に右図のように「メニューの表示方法」を「フェードイン」に設定して動作を確認してみましょう。
設定できたらカスタマイズダイアログを閉じます。
17. 上記の設定でここでのサンプル表示としてメニューの「選択範囲」をクリックしてみます。
すると右図のようにクリックすると、メニュー全体の不透明度が徐々に上がってくるのが確認出来ると思われます。
この動作が「フェードイン」動作になります。
（実際の動作と表示速さは異なります）
18. 次に左側一番下に表示されている「メニューの影を表示」について確認してみましょう。
デフォルトではチェックが付いた状態になっていますので、まずはこのままでカスタマイズダイアログを閉じて確認しましょう。
19. 上記の状態で下図のようにメニューを開くと、メニューリストの右側と下側にうっすら影が表示されて、立体的に見えるような視覚効果があります。
20. 次に「メニューの影を表示」のチェックをはずした状態で動作を確認してみましょう。
チェックをはずしたらカスタマイズダイアログを閉じます。
21. 上記の状態で下図のようにメニューを開くと、メニューリストの右側と下側にあった影が消えて平面的な表示になります。
これが「メニューの影を表示」動作になります。
22. 次に右側に表示されている「ショートカットメニュー｣について動作を確認してみましょう。
23. まず、「ショートカットメニューを選択」のリストを開いて見ると、下図のようなリストが表示されます。
これは、リストを見ると分かるように各右クリックメニューのリストになります。
またその下の方にはヒントも表示されます。
ではさっそく動作を見てみましょう。
24. 「ショートカットメニューを選択」のリストで「イメージメニュー」を指定します。
25. すると画面上にキャンバスにて右クリックしたときに表示されるメニューが、表示されます。
このように全ての右クリックメニューが表示できますので、表示した状態でコマンドを追加したり削除したりできますから、オリジナルな右クリックの作成も可能です。
26. 下図に「イメージメニュー」のオリジナルサンプル例を表示してみました。
このように既存のコマンドを削除したり、新しく追加することが可能ですから自分がより使いやすいメニューに変更する事が可能です。
27. 次に「リセット」動作を確認してみましょう。
下図のように「ショートカットメニューを選択」のリストでリセットしたいメニューを指定して、リセットボタンをクリックします。
ここでは今変更した「イメージメニュー」を選択しています。
28. すると下図のようなダイアログが表示されます。
リセット処理を行なう場合は「はい」、操作を中止する場合は「いいえ」をクリックします。
ここでは操作を行なうので、「はい」をクリックします。
29. すると下図のように先程変更した、「イメージメニュー」が初期状態に戻り表示されます。
このように初期状態に戻せますので、気軽にカスタマイズが楽しめると思われます。
これが「ショートカットメニュー」の動作になります。
1. 今度は「オプション」のカスタマイズ動作を確認してみましょう。
「オプション」を開くと下図のように表示されます。
2. では実際の動作を確認してみましょう。
下図はデフォルト設定の状態で「ツールヒントを表示」と「ショートカットキーを表示」にチェックが付いている状態です。
この状態で実際の表示を確認してみますので、設定されたらカスタマイスダイアログを閉じます。
3. 下図のようにアイコンにマウスを持って行くと、マウスの下にツールヒントとしてコマンド名が表示されます。
この状態が「ツールヒントを表示」動作になります。
さらにツールヒントの右側にショートカットキーが表示されていますが、これが「ショートカットキーを表示」動作になります。
4. 次に「ショートカットキーを表示」のチェックをはずした状態で動作を確認してみましょう。
チェックをはずしてカスタマイズダイアログを閉じます。
5. 上記の状態で、下図のようにアイコンにマウスを持って行くと、マウスの下にツールヒントとしてコマンド名が表示されまが、先程表示のあったショートカットキーの表示が出ていない事が確認できます。
これが「ショートカットキーを表示」のチェックをはずした時の動作になります。
6. 次に「ツールヒントを表示」のチェックをはずした状態で動作を確認してみましょう。
チェックをはずしてカスタマイズダイアログを閉じます。
7. 上記の状態で、下図のようにアイコンにマウスを持って行くと、マウスの下に表示されていたツールヒントの表示が出ていない事が確認できます。
これが「ツールヒントを表示」のチェックをはずした時の動作になります。
8. 次に「大きいボタン」のチェックを付けて動作を確認してみましょう。
チェックを付けます。
9. すると各種アイコンの表示が大きくなる事を確認出来ると思われます。
これが「大きいボタン」のチェックを付けた時の動作になります。
10. 次に「オプション」の右側に表示されている「Visualization...」について動作を確認してみます。
この機能は現在のbeta5では機能しません。
今後のバージョンアップにより対応出来るかどうか現在検討中との事です。
という事なので、beta5で動作する範囲で一応説明しておきます。
この「Visualization」とはいわゆる「スキンデータ」になります。
つまりPictBearの見た目を変更する機能になります。
ではさっそく動作を確認してみましょう。
「Visualization...」ボタンをクリックします。
11. すると下図のような「Visualizations」ダイアログが表示されます。
ここでスキンデータの変更を設定します。
最初の状態ではスキンデータは「デフォルト」しかありません。
12. スキンデータがないと変更する事ができませんので、スキンデータを追加してみましょう。
左下に表示されている「Download...」ボタンをクリックして、スキンデータをインターネットを通じて、追加します。
ですので、ここからの操作はインターネットにつながった状態で操作しなければいけませんので、注意してください。
13. すると下図のダイアログが表示されて、「BCGSkins Download Center」に接続中の状態になります。
14. しばらくすると、下図の状態になり「BCGSkins Download Center」につながったことが確認できます。
この状態になったらダウンロードやプレビューが出来る状態になります。
15. ではまずプレビューを確認してみましょう。
この説明を作成した段階では、4種類のスキンデータが存在しました。
まず最初に「Gradient Bar」のNameの部分をクリックします。
すると下図のように右側にどのようなスキンデータかが分かるようにサンプルのプレビュー画面が表示されます。
このプレビューで確認して、自分で変更したいスキンデータをダウンロードすることが可能です。
16. 次に「Gradient Button」のNameの部分をクリックします。 すると下図のように右側にプレビューが表示されます。
17. 次に「Mac Style Skin」のNameの部分をクリックします。 すると下図のように右側にプレビューが表示されます。
18. 次に「Silver Ring」のNameの部分をクリックします。
すると下図のように右側にプレビューが表示されます。
19. ではダウンロード動作を見てみましょう。
ここでは一番上の「Gradient Bar」にチェックを付けます。
20. チェックが付いた状態で下の「Download」ボタンをクリックします。
21. すると下図のようにプログレスバーが表示され、Downloadの進行状況が確認できます。
22. ダウンロードが終了すると下図のように元の状態に戻ります。
23. これでスキンデータが取得できたので、このダイアログを下図のように「Close」ボタンをクリックして閉じます。
24. するとダウンロードのダイアログが消えて、下図のように元の「Visualizations」ダイアログが表示されます。
本来ならここで、「Available Visualizations」の欄に今ダウンロードしたデータが反映されるはずですが、現在のBeta5バージョンでは反映することができません。
ここで項目を指定し、右下の「Apply」ボタンをクリックすると指定したスキンに変更できるはずです。
25. ちなみに、下図のように Created by: 「BCGSoft」表示の家アイコンをクリックすると、開発元のホームページを見ることができます。
ではクリックしてみます。
26. クリックするとブラウザーが起動され下図のようにホームページを見ることが可能です。
27. オプションのカスタマイズ動作になります。
色々カスタマイズして使用してみてください。
 |
メニューのカスタマイズ |
1. 今度はカスタマイズの「メニュー」動作を確認してみましょう。
「メニュー」を開くと下図の表示がされます。
2. まず左側のアプリフレームメニューについて説明します。
この項目の「メニューを表示するカテゴリ」で「イメージ」を見てみましょう。
3. 上記の状態でメニューバー表示を見ると、下図のようにイメージ操作している時に表示されるメニューの表示になります。
4. 今度は「デフォルトメニュー」を見てみましょう。
5. 上記の状態でメニューバー表示を見ると、下図のようにイメージが何も開かれていない時に表示されるメニューの表示になります。
6. では具体的にアプリフレームメニューの動きを確認してみます。
確認する前に下図のようにメニューバーの「スクリプト」と「ウィンドウ」の間に、新規作成コマンドを追加しておきます。
7. 上記の状態でカスタマイズダイアログの「メニューを表示するカテゴリ」で「イメージ」を指定し、「リセット」ボタンをクリックしてみます。
8. すると下図のような確認ダイアログが表示されます。
リセット処理を行なう場合は「はい」、操作を中止する場合は「いいえ」をクリックします。
ここでは操作を行なうので、「はい」をクリックします。
9. 処理が実行されると先程追加したコマンドが消えてメニューバーが初期状態に戻っていることが確認できます。
この動作は「デフォルトメニュー」でも同じです。
また、前に説明した「ツールバー」のカスタマイズであったリセット動作と同様ですが、このメニュータブでは「デフォルトメニュー」も表示やリセット動作が出来ますので、さらにカスタマイズ可能な状態になります。
10. 次に今の下に表示がある「メニューの表示方法」の動作確認をしてみましょう。
最初は「標準」を選択した時の動作を確認しますので、下図のように「標準」を選択してカスタマイズを閉じます。
11. 上記の設定でここでのサンプル表示としてメニューの「選択範囲」をクリックしてみます。
すると下図のようにクリックすると、一瞬でメニューの詳細が表示されます。
この動作が「標準」動作になります。
（実際の動作と表示速さは異なります）
12. 次に下図のように「メニューの表示方法」を「展開」に設定して動作を確認してみましょう。
設定できたらカスタマイズダイアログを閉じます。
13. 上記の設定でここでのサンプル表示としてメニューの「選択範囲」をクリックしてみます。
すると下図のようにクリックすると、左上から徐々に表示が展開されるのが確認出来ると思われます。
この動作が「展開」動作になります。
（実際の動作と表示速さは異なります）
14. 次に下図のように「メニューの表示方法」を「スライド」に設定して動作を確認してみましょう。
設定できたらカスタマイズダイアログを閉じます。
15. 上記の設定でここでのサンプル表示としてメニューの「選択範囲」をクリックしてみます。
すると右図のようにクリックすると、上から徐々に下に向かって表示がスライドされるのが確認出来ると思われます。
この動作が「スライド」動作になります。
（実際の動作と表示速さは異なります）
16. 次に右図のように「メニューの表示方法」を「フェードイン」に設定して動作を確認してみましょう。
設定できたらカスタマイズダイアログを閉じます。
17. 上記の設定でここでのサンプル表示としてメニューの「選択範囲」をクリックしてみます。
すると右図のようにクリックすると、メニュー全体の不透明度が徐々に上がってくるのが確認出来ると思われます。
この動作が「フェードイン」動作になります。
（実際の動作と表示速さは異なります）
18. 次に左側一番下に表示されている「メニューの影を表示」について確認してみましょう。
デフォルトではチェックが付いた状態になっていますので、まずはこのままでカスタマイズダイアログを閉じて確認しましょう。
19. 上記の状態で下図のようにメニューを開くと、メニューリストの右側と下側にうっすら影が表示されて、立体的に見えるような視覚効果があります。
20. 次に「メニューの影を表示」のチェックをはずした状態で動作を確認してみましょう。
チェックをはずしたらカスタマイズダイアログを閉じます。
21. 上記の状態で下図のようにメニューを開くと、メニューリストの右側と下側にあった影が消えて平面的な表示になります。
これが「メニューの影を表示」動作になります。
22. 次に右側に表示されている「ショートカットメニュー｣について動作を確認してみましょう。
23. まず、「ショートカットメニューを選択」のリストを開いて見ると、下図のようなリストが表示されます。
これは、リストを見ると分かるように各右クリックメニューのリストになります。
またその下の方にはヒントも表示されます。
ではさっそく動作を見てみましょう。
24. 「ショートカットメニューを選択」のリストで「イメージメニュー」を指定します。
25. すると画面上にキャンバスにて右クリックしたときに表示されるメニューが、表示されます。
このように全ての右クリックメニューが表示できますので、表示した状態でコマンドを追加したり削除したりできますから、オリジナルな右クリックの作成も可能です。
26. 下図に「イメージメニュー」のオリジナルサンプル例を表示してみました。
このように既存のコマンドを削除したり、新しく追加することが可能ですから自分がより使いやすいメニューに変更する事が可能です。
27. 次に「リセット」動作を確認してみましょう。
下図のように「ショートカットメニューを選択」のリストでリセットしたいメニューを指定して、リセットボタンをクリックします。
ここでは今変更した「イメージメニュー」を選択しています。
28. すると下図のようなダイアログが表示されます。
リセット処理を行なう場合は「はい」、操作を中止する場合は「いいえ」をクリックします。
ここでは操作を行なうので、「はい」をクリックします。
29. すると下図のように先程変更した、「イメージメニュー」が初期状態に戻り表示されます。
このように初期状態に戻せますので、気軽にカスタマイズが楽しめると思われます。
これが「ショートカットメニュー」の動作になります。
|
オプションのカスタマイズ |
1. 今度は「オプション」のカスタマイズ動作を確認してみましょう。
「オプション」を開くと下図のように表示されます。
2. では実際の動作を確認してみましょう。
下図はデフォルト設定の状態で「ツールヒントを表示」と「ショートカットキーを表示」にチェックが付いている状態です。
この状態で実際の表示を確認してみますので、設定されたらカスタマイスダイアログを閉じます。
3. 下図のようにアイコンにマウスを持って行くと、マウスの下にツールヒントとしてコマンド名が表示されます。
この状態が「ツールヒントを表示」動作になります。
さらにツールヒントの右側にショートカットキーが表示されていますが、これが「ショートカットキーを表示」動作になります。
4. 次に「ショートカットキーを表示」のチェックをはずした状態で動作を確認してみましょう。
チェックをはずしてカスタマイズダイアログを閉じます。
5. 上記の状態で、下図のようにアイコンにマウスを持って行くと、マウスの下にツールヒントとしてコマンド名が表示されまが、先程表示のあったショートカットキーの表示が出ていない事が確認できます。
これが「ショートカットキーを表示」のチェックをはずした時の動作になります。
6. 次に「ツールヒントを表示」のチェックをはずした状態で動作を確認してみましょう。
チェックをはずしてカスタマイズダイアログを閉じます。
7. 上記の状態で、下図のようにアイコンにマウスを持って行くと、マウスの下に表示されていたツールヒントの表示が出ていない事が確認できます。
これが「ツールヒントを表示」のチェックをはずした時の動作になります。
8. 次に「大きいボタン」のチェックを付けて動作を確認してみましょう。
チェックを付けます。
9. すると各種アイコンの表示が大きくなる事を確認出来ると思われます。
これが「大きいボタン」のチェックを付けた時の動作になります。
10. 次に「オプション」の右側に表示されている「Visualization...」について動作を確認してみます。
この機能は現在のbeta5では機能しません。
今後のバージョンアップにより対応出来るかどうか現在検討中との事です。
という事なので、beta5で動作する範囲で一応説明しておきます。
この「Visualization」とはいわゆる「スキンデータ」になります。
つまりPictBearの見た目を変更する機能になります。
ではさっそく動作を確認してみましょう。
「Visualization...」ボタンをクリックします。
11. すると下図のような「Visualizations」ダイアログが表示されます。
ここでスキンデータの変更を設定します。
最初の状態ではスキンデータは「デフォルト」しかありません。
12. スキンデータがないと変更する事ができませんので、スキンデータを追加してみましょう。
左下に表示されている「Download...」ボタンをクリックして、スキンデータをインターネットを通じて、追加します。
ですので、ここからの操作はインターネットにつながった状態で操作しなければいけませんので、注意してください。
13. すると下図のダイアログが表示されて、「BCGSkins Download Center」に接続中の状態になります。
14. しばらくすると、下図の状態になり「BCGSkins Download Center」につながったことが確認できます。
この状態になったらダウンロードやプレビューが出来る状態になります。
15. ではまずプレビューを確認してみましょう。
この説明を作成した段階では、4種類のスキンデータが存在しました。
まず最初に「Gradient Bar」のNameの部分をクリックします。
すると下図のように右側にどのようなスキンデータかが分かるようにサンプルのプレビュー画面が表示されます。
このプレビューで確認して、自分で変更したいスキンデータをダウンロードすることが可能です。16. 次に「Gradient Button」のNameの部分をクリックします。 すると下図のように右側にプレビューが表示されます。
17. 次に「Mac Style Skin」のNameの部分をクリックします。 すると下図のように右側にプレビューが表示されます。
18. 次に「Silver Ring」のNameの部分をクリックします。
すると下図のように右側にプレビューが表示されます。
19. ではダウンロード動作を見てみましょう。
ここでは一番上の「Gradient Bar」にチェックを付けます。
20. チェックが付いた状態で下の「Download」ボタンをクリックします。
21. すると下図のようにプログレスバーが表示され、Downloadの進行状況が確認できます。
22. ダウンロードが終了すると下図のように元の状態に戻ります。
23. これでスキンデータが取得できたので、このダイアログを下図のように「Close」ボタンをクリックして閉じます。
24. するとダウンロードのダイアログが消えて、下図のように元の「Visualizations」ダイアログが表示されます。
本来ならここで、「Available Visualizations」の欄に今ダウンロードしたデータが反映されるはずですが、現在のBeta5バージョンでは反映することができません。
ここで項目を指定し、右下の「Apply」ボタンをクリックすると指定したスキンに変更できるはずです。
25. ちなみに、下図のように Created by: 「BCGSoft」表示の家アイコンをクリックすると、開発元のホームページを見ることができます。
ではクリックしてみます。
26. クリックするとブラウザーが起動され下図のようにホームページを見ることが可能です。
27. オプションのカスタマイズ動作になります。
色々カスタマイズして使用してみてください。
