みんなに優しく、解りやすくをモットーに開設しています。 以下のルールを守りみんなで助け合いましょう。
1.ファイルメーカーで解らない事があればここで質問して下さい。 何方でも、ご質問・ご回答お願いします。 （優しく回答しましょう）
You are not logged in.
Pages: 1
ファイルメーカー19 Macintoh を使用しています。
フォトショップでボタンを作成し、PNGで保存したものを,
ファイメーカーのボタンに追加しました。
レイアウトから、ボタンを選択し、「通常」から「ポイントした時に表示」に設定しています。
アイコンは朱色を選択し、添文字の色は黒色から白色に設定しています。
ボタンをポイントした時にボタン全体の背景は確かに朱色になるのですが、アイコンを囲むくらいの四角形の背景のみが白色で表示されます。
ボタンに添えている文字は指定した通り白色になります。
ファイルメーカーのデフォルトのボタンでは添えている文字のみが白色になり、アイコン周りは全て指定の色（朱色）になります。
フォトショップで周りを透明にしてみたのですが、デフォルトボタンのようにはなりません。
どのようにすれば、デフォルトボタンのようにアイコンの周りを指定した色にできるのでしょうか。
悪戦苦闘しています。
どなたか、ご教授いただけないでしょうか。
Offline
アイコンのボーダーを設定してみるか、無しにしてはどうでしょう。
Offline
PNGで作成した画像をアイコンとして設定しているのでしょうか？
アイコンの設定で色が変わるのは SVG で作成されたアイコンのみです。
詳細は こちら （英語）
透過設定された PNG をアイコンとして追加してもアイコンの色は変更できません。
［塗りつぶし］の色が透過部分には設定されます。
［ポイントしたときに表示］の［塗りつぶし］を赤色にすればポイント時に赤く表示されます。
※［ポイントしたときに表示］はボタンにスクリプトまたはステップが割り当てられていないと動作しません。
どのような操作でどのように設定したのかインタフェースに使われている言葉で書けませんか？
どこに色を設定しているのか分かりづらいです。
作成したイメージをアイコン以外にもボタンの背景にも設定できますが、
同時に［塗りつぶし］で色を設定することができません。
Offline
Shin 様 Moz 様 ご指導ありがとうございます。
Shin 様
「アイコンのボーダーを設定してみるか、無しにしてはどうでしょう。」フォトショップで行うのでしょうか？
Moz 様
インターフェースに使われている言葉がよくわかりませんので、私なりに精一杯記述してみます。
右上向きアイコン「飛行物体のような黒塗りアイコン」がファイルメーカーにありますが、
右下向きアイコンを追加したいと思っています。
ファイルメーカーから右上向き飛行アイコンを取り出す方法がわからないので、
スクリーンショットを撮り、フォトショップでPNGとして保存しました。
そのPNGはファイルメーカーにボタンとして登録することができ、きちんと画像は出ていますが、
レイアウトでボタンを選択したのち → インスペクター → ポイントした時の色を赤に指定しました。
ボタンをポイントすると、ボタン全体は赤色になります。
その時、アイコンは元の黒色のままで表示されますが、アイコンを囲う四角形のアイコン以外の部分が白色のままになるのです。
ボタンの中でこのように白色に抜けないように、アイコン以外の周りは全て同じ赤色にしたいと思っています。
そこで、先ほどのPNGファイルをフォトショップに取り込み、SVG ファイルに変換して取り込んでみました。
ファイルメーカー → ボタン設定 → 「＋」を押して取り込むと、ボタンとしては登録されるのですが、ボタン全体が白紙のままになります。
アイコンをポイントした時は全て赤色になってしまいます。肝心の「飛行アイコン」は当然なのでしょうが見えなくなっています。
ということです。わかりにくいかと思いますが引く続きご指導よろしくお願いします。
Offline
デフォルトのアイコンと同じように動作する右下向きの矢印アイコンを作りたいということですね。
上でも書きましたが PNG では SVG と同じように動作しません。
SVG を自分で作れないなら、手っ取り早いのは作成済の SVG アイコンを探すことかな、と。
（他社の作った画像を SVG に変換するのは自分で作るとは言いません）
※サラッと書かれていますが取り出せないものを無理に取り出して複製加工するのってNGですよ。
上で紹介したリンクに書かれてるような SVG にすればデフォルトのアイコンと同じように動作します。
Photoshop で変換した SVG はそのように書かれていないのでしょう。
Icon集（おすすめ）
IconManager
SVG を加工してデフォルトアイコンと同じように動くようにする方法のヒント
Google の icon を FileMaker で使う
Illustrator で SVG アイコンを作る方法
illustratorでFileMakerのSVG形式のボタンアイコンを作ろう！
Last edited by Moz (2021-03-17 12:56:48)
Offline
Moz 様
ご指導ありがとうございました。
イラストレーターで作成したものをボタンにできる方法を教えていただきありがとうございました。
イラストレーターなら得意分野です。 早速SVGにしてみましたら、願っていたようなボタンが作成することができました。
ご親切にご教授いただき、本当にありがとうございました。
Offline
Pages: 1
[ Generated in 0.006 seconds, 9 queries executed - Memory usage: 568.23 KiB (Peak: 588.45 KiB) ]