マニュアルキャンセル

Animate での線、塗り、グラデーション

検索

最終更新日 : 2023年5月24日

グラデーションの塗りの作成または編集

グラデーションは、1 つのカラーから別のカラーへと徐々に変化するマルチカラーの塗りです。Animate（旧 Flash Professional CC）では、最大で 15 色を適用してグラデーションを作成できます。グラデーションを作成すると、滑らかなカラーグラデーションを複数のオブジェクトに適用できます。グラデーションをスウォッチとして保存しておくと、複数のオブジェクトに簡単に適用できます。Animate では、次のような 2 種類のグラデーションを作成できます。

線状グラデーションでは、1 つの軸（水平または垂直）に沿ってカラーが変化します。

放射状グラデーションでは、中央の焦点から外側に向かってカラーが変化します。グラデーションの方向、カラー、焦点の場所、その他の様々なグラデーションプロパティを調整できます。

Animate には、Flash Player で使用可能な線状および放射状のグラデーションに対する追加のコントロールがあります。これらのコントロール（オーバーフローモードという）を使用すれば、グラデーションを超えてカラーを適用する方法を指定できます。

既存のアートワークにグラデーションの塗りを適用するには、ステージで 1 つまたは複数のオブジェクトを選択します。
カラーパネルが表示されていない場合は、ウィンドウ／カラーを選択します。
カラー表示モードを選択するには、パネルメニューから「RGB」（デフォルトの設定）または「HSB」を選択します。
タイプメニューからグラデーションの種類を選択します。

線状

直線の始点から終端まで陰影を作るグラデーションを作成します。

放射状

中央の焦点から外側に向かって放射状にブレンドするグラデーションを作成します。

Flash Player 8 以降を対象とするパブリッシュの場合、線状または放射状のグラデーションを選択すると、2 つの追加のオプションがカラーパネルに表示されます。1 つは、タイプメニューの下に表示されるオーバーフローメニューです。グラデーションの範囲外のカラーの適用方法を指定するには、オーバーフローメニューを使用します。もう 1 つは、グラデーション定義バーです。バーの下には、グラデーション内のカラーを表すポインターが表示されます。
（オプション）オーバーフローメニューで、グラデーションに適用するオーバーフローモードを、「拡張」（デフォルトのモード）、「反映」、「繰り返し」の中から選択します。
（オプション）SVG（Scalable Vector Graphics）互換の線状または放射状のグラデーションを作成するには、「リニア RGB」チェックボックスをオンにします。これにより、最初に適用された後に異なるサイズに拡大された場合にグラデーションが滑らかに見えるようにします。
グラデーションのカラーを変更するには、グラデーション定義バーの下にあるカラーポインターのいずれかを選択します（選択したカラーポインターの上の三角形が黒色になります）。その後、グラデーションバーの上に表示されるカラースペースペイン内をクリックします。「明度」スライダーをドラッグし、カラーの明度を調整します。
グラデーションにポインターを追加するには、グラデーション定義バーまたはその下をクリックします。前の手順の方法で、新しいポインターのカラーを選択します。

最大で 15 色までポインターを追加できます。つまり、最大で 15 色のトランジションを持つグラデーションを作成できます。
グラデーションのポインターの位置を変更するには、グラデーション定義バーに沿ってポインターをドラッグします。グラデーション定義バーのポインターを下にドラッグすると、ポインターが削除されます。
グラデーションを保存するには、カラーパネルの右上隅にある三角形をクリックし、メニューから「色見本を追加」を選択します。

グラデーションが、現在のドキュメントの色見本パネルに追加されます。
グラデーションを変形する（水平のグラデーションを垂直にするなど）には、グラデーション変形ツールを使用します。詳しくは、グラデーションおよびビットマップの塗りの変形を参照してください。

線のカラーと塗りのカラーの調整

ツールパネルの「線のカラー」コントロールまたは「塗りのカラー」コントロール、またはプロパティインスペクターの「線のカラー」コントロールまたは「塗りのカラー」コントロールを使用して、グラフィックオブジェクトとシェイプの線のカラーと塗りのカラーを指定できます。

ツールパネルの「線のカラー」セクションと「塗りのカラー」セクションには、「線のカラー」ボックスと「塗りのカラー」ボックスをアクティブにするためのコントロールがあります。これらのボックスは、選択したオブジェクトの線または塗りがカラー選択の影響を受けるかどうかを決定します。また、「カラー」セクションには、カラーをすばやくデフォルトにリセットするコントロール、線と塗りのカラー設定を「なし」に設定するコントロールおよび塗りと線のカラーをスワップするコントロールがあります。

グラフィックオブジェクトまたはシェイプの線と塗りのカラーを選択することに加え、プロパティインスペクターには、線の幅とスタイルを指定するためのコントロールもあります。

これらのコントロールを使って既存のオブジェクトのペイント属性を変更するには、まずステージでオブジェクトを選択します。

「カラーのライブプレビュー」も参照してください。

ツールパネルを使用した線および塗りのカラーの調整

ツールパネルの「線のカラー」および「塗りのカラー」コントロールは、描画ツールやペイントツールを使って作成される新しいオブジェクトのペイント属性を設定します。これらのコントロールを使って既存のオブジェクトのペイント属性を変更するには、まずステージでオブジェクトを選択します。

「線のカラー」または「塗りのカラー」のコントロールをクリックして、色見本を選択します。
ポップアップウィンドウの「システムカラーピッカー」ボタンをクリックして、カラーを選択します。様々なカラーの上にマウスポインターを置いて、シェイプでのカラーのエフェクトをプレビューすることもできます。
カラーの 16 進値をボックスに入力します。
デフォルトのカラー設定（白の塗りと黒の線）に戻るには、ツールパネルの「白黒」ボタンをクリックします。
いずれかの線または塗りを削除するには、「カラーなし」ボタンをクリックします。

「カラーなし」ボタンは、楕円または矩形の作成時にのみ表示されます。線や塗りを使用せずにオブジェクトを作成することはできますが、既存のオブジェクトに対して「カラーなし」ボタンを使用することはできません。代わりに、既存の線または塗りを選択してそれを削除してください。
塗りのカラーと線のカラーを入れ替えるには、ツールパネルの「カラーの入れ替え」ボタンをクリックします。

Animate では、色見本から線または塗りのカラーを変更すると、変更の状況をリアルタイムにプレビューできます。詳しくは、「カラーのライブプレビュー」を参照してください。

プロパティインスペクターを使用して単色の塗りを適用する

ステージ上の閉じたオブジェクト選択します。複数のオブジェクトを選択することもできます。
ウィンドウ／プロパティを選択します。
カラーを選択するには、「塗りのカラー」コントロールをクリックし、次のいずれかを行います。
- パレットからカラーを選択します。
- カラーの 16 進値をボックスに入力します。

プロパティインスペクターを使用した線のカラー、スタイルおよび太さの選択

選択したオブジェクトの線のカラー、スタイル、および太さを変更するには、プロパティインスペクターの「線のカラー」コントロールを使用します。線のスタイルについては、Animate にあらかじめ組み込まれているスタイルから選択するか、カスタムスタイルを作成できます。単色の塗りを選択するには、プロパティインスペクターの「塗りのカラー」コントロールを使用します。

ステージ上のオブジェクトを 1 つまたは複数選択します（シンボルの場合は、最初にダブルクリックしてシンボル編集モードに入ります）。
ウィンドウ／プロパティを選択します。
線のスタイルを選択するには、スタイルメニューをクリックし、オプションを選択します。カスタムスタイルを作成するには、プロパティインスペクターで「カスタム」をクリックし、線のスタイルダイアログボックスの各オプションを選択して「OK」をクリックします。

実線以外のスタイルを選択した場合、ファイルサイズが大きくなる可能性があります。
線の太さを選択するには、線スライダーを設定するか、テキストボックスに値を入力します。
線のヒント処理を有効にするには、「線のヒント処理」チェックボックスをオンにします。線のヒント処理を使用すると、線や曲線のアンカーの位置がピクセルと完全に一致するように調整され、水平または垂直の線がぼやけて表示されるのを防ぐことができます。
パスの終端のスタイルを設定するには、「線端」オプションを選択します。

なし

線端をパスの終端と同一面に描画します。

丸型

線端をパスより線の幅の半分だけはみ出して描画する丸いキャップを追加します。

四角

線端をパスより線の幅の半分だけはみ出して描画する四角いキャップを追加します。
（オプション）描画モードを「スムージング」に設定して鉛筆ツールまたはブラシツールで線を描画する場合は、Animate で描画する線を滑らかにする程度を指定するために、「スムージング」スライダーを使用します。

デフォルトでは、スムージング値は 50 に設定されていますが、0 ～ 100 の値を指定できます。スムージングの値が大きいほど、作成される線は滑らかになります。

描画モードが「ストレート」または「インク」に設定されている場合、「スムージング」スライダーは無効になります。
2 つのパスセグメントが交わる方法を定義するには、「結合」オプションを選択します。開いているパスまたは閉じているパスに含まれる角を変更するには、パスを選択して他の結合オプションを選択します。

マイター結合、丸型結合、ベベル結合
マイター結合がべベル処理されるのを避けるには、マイターの限度を入力します。

この値を超える長さの線は、とがらずに四角になります。例えば、3 ポイントの線に対してマイターの限度が 2 である場合、ポイントの長さが線の幅の 2 倍になると、Animate は限度ポイントを削除します。

マイターの限度の適用

複数の線またはシェイプの線の調整

線のカラー、幅、および 1 つ以上の線のスタイル、またはシェイプアウトラインを変更するには、インクボトルツールを使用します。線またはシェイプアウトラインには単色だけを適用できます。グラデーションやビットマップは適用できません。

個々の線を選択する代わりに、インクボトルツールを使って複数のオブジェクトの線属性を一度に変更する方が簡単です。

ツールパネルからインクボトルツールを選択します。
線のカラーを選択します。
プロパティインスペクターから、線のスタイルと太さを選択します。
線の修正内容を適用するには、ステージ上のオブジェクトをクリックします。

線と塗りのコピー

スポイトツールを使用すれば、1 つのオブジェクトの塗り属性または線属性をコピーし、ただちにそれを別のオブジェクトに適用できます。また、スポイトツールを使用すれば、ビットマップ内のイメージを抽出して、それを塗りに使用することもできます。

1 つの線または塗り領域の属性を別の線または塗り領域に適用するには、スポイトツールを選択して、適用する属性の線または塗り領域をクリックします。

線をクリックすると、ツールは自動的にインクボトルツールに変化します。塗り領域をクリックすると、ツールは自動的にバケツツールに変化し、「塗りの固定」ボタンがオンになります。
新しい属性を適用する線または塗り領域をクリックします。

バケツツールによるペイントされた領域の変更

バケツツールは、閉じている領域をカラーで塗りつぶします。このツールを使用して、次のような処理を行うことができます。

空白の領域を塗りつぶして、既にペイントされた領域のカラーを変更する。
単色、グラデーションおよびビットマップの塗りを使ってペイントする。
完全には閉じていない領域を塗りつぶすためにバケツツールを使用する。
バケツツールを使用するとき、Animate によってシェイプアウトラインの隙間を自動的に埋める。

ツールバーからバケツツールを選択します。
塗りのカラーとスタイルを選択します。
ツールパネルの一番下に表示される隙間の大きさモディファイアをクリックし、隙間の大きさオプションを選択します。
- シェイプを塗りつぶす前に手作業で隙間を埋める場合は、「隙間を閉じない」を選択します。複雑な描画の場合、手作業で隙間を埋める方が早く処理できるかもしれません。
- 「閉じる」オプションを選択すると、隙間を持つシェイプが Animate によって自動的に塗りつぶされます。
隙間が大きすぎる場合は、手動で閉じる必要があります。
塗りつぶすシェイプまたは閉じた領域をクリックします。

バケツツールオプション

バケツツールを使用して、オブジェクトの輪郭をクリックしてドラッグし、選択した色で塗りつぶすことができます。輪郭内の任意の方向にツールをクリックしてドラッグできます。バケツツールは、輪郭内で点がキャプチャされている場所を塗りつぶします。

「すべての領域を塗りつぶす」チェックボックスをオンにすると、ドラッグ中に、選択したすべての領域がその色で塗りつぶされます。

デフォルトでは、「すべての領域を塗りつぶす」オプションはオフになっています。このモードでは、バケツツールは、特定の色のみを塗りつぶします。

「すべての領域を塗りつぶす」が選択されていない場合（デフォルト）

このモードでは、ユーザーがバケツを使用してマウスをクリックすると、置き換えられる色を確認できます。ここでは、緑色が赤で置き換えられる場合を考えてみましょう。
このオプションは、ユーザーがアートワークをドラッグするにつれて、緑色で塗りつぶされた輪郭のみを置き換えます。
ユーザーが空の閉じた輪郭をドラッグすると、赤で塗りつぶされます。
マウスクリック時に基になる輪郭が空だった場合、このオプションは、ユーザーがバケツツールをドラッグすると、空の輪郭を塗りつぶします。

「すべての領域を塗りつぶす」が選択されている場合

すべての領域が選択した色で塗りつぶされます。前述の説明の場合、赤になります。

グラデーションおよびビットマップの塗りの変形

グラデーションまたはビットマップの塗りのサイズ、方向、中央を調整することにより、塗りを変形できます。

ツールパネルからグラデーション変形ツールを選択します。ツールパネルにグラデーション変形ツールが表示されていない場合は、自由変形ツールをクリックしてマウスボタンを押したままにし、表示されるメニューからグラデーション変形ツールを選択します。
グラデーションまたはビットマップで塗りつぶされた領域をクリックします。境界ボックスと編集ハンドルが表示されます。ポインターをいずれかのハンドルの上に重ねると、カーソルの形が変化してハンドルの機能を示します。

中心点

中心点ハンドルのロールオーバーアイコンは、4 方向の矢印です。

焦点

焦点ハンドルが表示されるのは、放射状のグラデーションを選択した場合のみです。焦点ハンドルのロールオーバーアイコンは、反転した三角形です。

サイズ

サイズハンドル（境界ボックスの先端中央にあるハンドルアイコン）のロールオーバーアイコンは、内側に矢印の付いた円です。

回転

グラデーションの回転を調整します。回転ハンドル（境界ボックスの先端下にあるハンドルアイコン）のロールオーバーアイコンは、4 つの矢印が円の形をしています。

幅

グラデーションの幅を調整します。幅ハンドル（四角形のハンドル）のロールオーバーアイコンは、両方向の矢印です。

Shift キーを押すと、線状グラデーションの塗りの移動方向が 45 度の倍数に制限されます。

放射状グラデーションのコントロール

A. 中心点 B. 幅 C. 回転 D. サイズ E. 焦点
グラデーションまたはビットマップの塗りは、次のような方法で変更できます。
- グラデーションまたはビットマップの塗りの中心の位置を変更するには、中心点をドラッグします。
- グラデーションまたはビットマップの塗りの幅を変更するには、境界線の横の四角いハンドルをドラッグします。このオプションは塗りのサイズだけを変更します。塗りを含んでいるオブジェクトのサイズは変更されません。
- グラデーションまたはビットマップの塗りの高さを変更するには、境界線の下の四角いハンドルをドラッグします。
- グラデーションまたはビットマップの塗りを回転させるには、隅にある円形の回転ハンドルをドラッグします。放射状のグラデーションまたは塗りの場合も、境界線の下にあるハンドルをドラッグして回転させることができます。
- 線状のグラデーションまたは塗りを伸縮するには、境界線の中央にある四角形のハンドルをドラッグします。
- 放射状グラデーションの焦点を変更するには、境界線上の中央にある円形のハンドルをドラッグします。
- シェイプ内の塗りの形状を歪曲または傾斜させるには、境界線の上側または右側にある円形のハンドルの 1 つをドラッグします。
- シェイプ内に同じビットマップを複数並べてタイリング表示するには、塗りを伸縮させます。
大きな塗りやステージの端付近の塗りを操作するためにすべてのハンドルを表示するには、表示／ペーストボードを選択します。