Delphi XE5でモバイルアプリケーションの背景色をiOS7的なグラデーションにする

Paweł Głowacki : Fun with FireMonkey Gradients」で背景色をグラデーションにする方法が紹介されていました。

プロパティを設定するだけでグラデーションにできます。
コーディング不要なところがさすがDelphi。

FireMokey モバイルアプリケーションを作成します。

001

TRectangleコンポーネントを配置します。

002

配置したTRectangleコンポーネントのAlignプロパティを「alClient」にします。

003

FillプロパティのKindプロパティを「bkGradient」にします。

004

背景がグラデーションになりました。

005

FillプロパティのGradientプロパティから「編集」を選択します。

006

ブラシ デザイナ」が表示されるので、「グラデーション表示」タブを選択します。

007

プレビューバーの下にある丸印をクリックしてして、グラデーションでの色を選択します。

008

※配色は「iOS 7 colors」を参考にしました。

「OK」ボタンを押すと、デザイン画面の表示が更新されます。

009

次にアニメーション効果を追加します。

Rectangle1コンポーネントのFillプロパティのGradientプロパティから「TGradientAnimationの新規作成」を選択します。

010

Rectangle1コンポーネントの下にTGradientAnimationコンポーネントが追加されます。

011

次にアニメーション効果を追加します。

GradientAnimation1コンポーネントのStartValueプロパティに、Rectangle1コンポーネントのFillプロパティのGradientプロパティと同じ値を設定します。

GradientAnimation1コンポーネントのStopValueプロパティに、変化したときのグラデーションの色を設定します。

GradientAnimation1コンポーネントのStartメソッドでアニメーションが実行されます。

procedure TForm1.Rectangle1Click(Sender: TObject);
begin
  GradientAnimation1.Start;
end;

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください