FileMaker Pro 15 基本講座

テーマとスタイルを理解する

全388コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
テーマとスタイルについて、その考え方と利用方法を説明します。
講師:
09:56

字幕

テーマとスタイルについてその考え方と利用方法を説明します。テーマと使うと統一感を持たせてすっきりしたユーザインターフェースを作成することが出来ます。FileMaker は、始めから幾つかテーマを用意してレイアウトを作成するときにはデフォルトのテーマが設定されています。レイアウトモードに切り替えここをご覧ください。テーマは「Enlightened」となっています。このアイコンをクリックするとテーマの変更のダイアログが表示され今、選択されている「Enlightened」のこのプレビューが右側に表示されています。この名前でもう1セット「…タッチ」という風に後ろに「タッチ」が付いたような名前が用意されています。「Enlightened」のタッチを選択するとこのように一回り大きめのボタンやフィールドのサイズと言ったようなプレビューに切り替わりました。新規に作成する段階でこれを選択して作成をするとその後、レイアウトを配置する時にこのサイズになります。ですが、既にレイアウトオブジェクトを配置した後で、これを選択したら、どうなるかやってみます。OK ボタンを押します。すると、テキストのフォントサイズ等は大きくなりましたがレイアウトオブジェクト、そのものは既に配置されているものには影響しません。 従って、テーマや、この、どのデバイス用なのかといったようなところは一番最初に決めて、そして作り始めたほうが良いでしょう。変更したテーマを、一旦戻しましょう。次に、もう一度、テーマを異なるものに変えてみます。「ルミナス」という全くイメージの違うものに変更してみましょう。このように、全てのレイアウトオブジェクト背景色も含めてテーマのイメージが変わりました。次に、見比べがしやすいようにインスペクターを3つほど並べてみました。インスペクターは表示メニューの、ここから「新規インスペクター」と選択することで複数、このように配置することができます。一番左にあるのがスタイルそして次のインスペクターでは外観を表示し一番最後はデータを表示しています。各テーマは沢山のスタイルを持っています。今、レイアウトでは何も選択されていない状態です。ここに、スタイルを反映していますがデフォルトとなっていてこの上部にあるのはレイアウトの背景に対してのスタイルのリストを表示しています。もし、この中で普通のフィールドを1つ選択すると編集ボックスというふうに変わりこの編集ボックスには3つのスタイルが用意されているのがわかります。 これを切り替えることによってテーマが用意したいずれかのスタイルに切り替えることができます。次に、少し画面が狭いですのでスクロールしてボタンなどを用意してありますからボタンを選択してみます。すると、ボタンには、もっと沢山のスタイルが用意されているのがわかります。ここが、対象がボタンというオブジェクトのタイプに変わりました。アクセントボタン1というのをクリックするとこのように、全く違うパターンになりますが目立ったボタンのタイプこれが4種類ほど用意されています。目的によって、種類を統一して利用します。また、ここには四角い枠のオブジェクトを用意してあります。これを選択すると、形成というオブジェクトのタイプに変わりこれには沢山の、やはり、スタイルが用意されています。ボタンと同様に、アクセント的に利用したりコンテンツ領域を背景でくくってひとまとめにするためのものだったりそういったふうな具合です。このように、スタイルは、対象とするレイアウトオブジェクトの種類ごとに様々に用意されているわけです。レイアウトにいずれのオブジェクトかが配置された直後はデフォルトといったものになっているはずです。この各スタイルは、その横の外観と言うタブを表示していますのでこの外観で、塗りつぶしの色を変えたりグラデーションにしたりといったようなことができます。 また、線の色なども変えられます。また、この背景へも何も選択しない状態にして対象にするとグラフィックのところで塗りつぶしを「なし」になっていますがイメージを選択するといったこともできます。ここで、背景色に色を付ける代わりにイメージを挿入してみます。今は、ボディそのものに色が割り当てられているため何も見えませんがこれを無しにしてみます。すると、このように、背景に、今選択したイメージが表示されるようになりました。このように、各フィールドの枠を付けている四角い枠がありますのでこれを色を50%くらいに透過してみます。すると、このような感じになります。ブラウズモードの状態を見てみます。ショートカットで保存してブラウズモードに行きます。このような感じです。ブラウズモードで見ながら作業したいという場合はウィンドウをもう一つ開くと便利かも知れません。そのウィンドウを少し小さくしてステータスツールバーはオフにしておいても良いでしょう。このようにした状態で、レイアウトモードに移動します。そうすると、ここでブラウズ状態が反映されるのがわかります。続けて、テキストのオブジェクトを選択し今、デフォルトとなっていますがこれを外観で少しカスタマイズしてみます。 すると、この編集ボックスのところの下の選択メニューが通常となっているところクリックしてみます。ポイントした時に表示をした時、フォーカスと4種類の、いわゆる、フィールドに対しての操作が行われた時の状態を意味しています。ここで、ポイントした時というのを選択してわかりやすく色を何か変えてみます。保存してショートカットキーを使います。Command +S Windows だと Ctrl + S保存しました。こちらのブラウズモードのところでアクティブにしてマウスオーバーするとこのように色が変わります。つまり、レイアウトオブジェクトのフィールドのようなもの、操作を受け付けるようなものについてはこのような振る舞い、ユーザーの操作に合わせてどのように外観を変えるかいったような設定がそれぞれ行えるわけです。また、今のようにデフォルトの設定されたスタイルの状態から一部外観を変更すると、このように赤くアイコンがグレーから変わりました。ここをクリックすると、現在、スタイルからカスタマイズがされたためスタイルに戻ることができたり或いは、今のスタイルをこのままデフォルトに変更したりといったことができます。或いは、「新規スタイルとして保存」つまり、名前を変えて、他のスタイルを自分で作るといったこともできます。 わかりやすいように、ポイントした時ではなく通常の状態で、色を何かに変えてみます。そして、保存をすると、ここのブラウズモードで、すぐに反映されましたがこのフィールドについては反映されました。これをこのスタイルに現在のスタイルを保存、つまりデフォルトにこのフィールドは全部黄色というものを保存するとこれで、今のレイアウトを保存します。すると、このように、他の同種類のフィールドに関して同じようになりました。これらは全て、同じ編集ボックスのタイプで、デフォルトというスタイルが割り当てられていたものです。これにより、一貫性を持った設定が可能になります。また、このデフォルトという編集ボックスのスタイルが変更されたためここは赤いのがグレーになりましたが次にそれを内包しているテーマそのものが組み合わせが変わったためこのように赤くなりました。テーマそのものも変更・保存とすることによって他のレイアウトでこのテーマを利用していてこのオブジェクトタイプに対してのデフォルトを利用しているものがあれば全てのレイアウトで同様に変わるわけです。このように、テーマは複数のスタイルを内包しており各スタイルは外観でカスタマイズすることができるということを理解しておいてください。 もう1点、嬉しいこととして、各テーマはカラーのパターンというものを持っています。先ほど、この色を変えたカラーの部分を選択するとこのようにカラーパレットが出るわけですが上のほうに並んでいるものというのはこのテーマに用意された使用しているカラーの候補つまり、種類です。いずれかのカラーをうまく使うことによって細かいいろいろと分けるよりも、統一性を持たせる事ができるように考えられています。また、この中からさらに似たようなカラーだがもう1つ使用したいものが見つかった場合ここから、それを選択してドラッグすることによってこのようにそのカラーのベースにしてトーンが変わった種類といったカスタムテーマの色を追加することができます。あまり、沢山のカラーをレイアウトの上で沢山使うよりこのようにトーン違いのものを、うまく組み合わせたほうがすっきりとしたレイアウトになります。このレッスンでは、テーマとスタイルについてその考え方と利用方法を説明しました。

FileMaker Pro 15 基本講座

FileMaker Proは特に開発の経験がなくてもアイデアをすぐに形にできます。このコースではFileMaker Proの基本操作はもちろん、データベースの仕組みからリレーションシップの作成や、コンテキストの概念などについて基礎から学習します。また美しいレイアウトの作成や操作性を向上させるためのさまざまなコツも紹介します。

9時間51分 (99 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
プラン加入者限定
発売日:2017年02月03日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。