DELPHI BOOT CAMP / DELPHIでビジュアル開発に挑戦しよう ◆ DAY2: DelphiでUI設計のポイントを学ぼう [JAPAN]

Posted by on in Programming

 ◇◆◇◆ Delphi Boot Camp / Delphiでビジュアル開発に挑戦しよう ◇◆◇◆

Day2: DelphiでUI設計のポイントを学ぼう

 

2016年9月13日(火) 、Webによるオンラインセミナー 「Delphi Boot Camp / Delphiでビジュアル開発に挑戦しよう」を実施しました。Delphi Boot Campは延べ4日間にわたり実施されているWebセミナーで、当記時はそのセミナー2日目の内容について記載しています。

詳しいBoot Camp説明はこちらのブログに記載があります。 Boot Camp申し込みのページは下記にもあり、内容も記載されていますので、ご興味のある方は覗いてみてください。

Webセミナー「Delphi Boot Camp」:http://forms.embarcadero.com/delphi-boot-camp-2016

このブログでは、Day2にてご紹介した内容のサマリーと、参考資料を掲載いたします。

Day2のセミナーの動画はこちらからご覧ください:

http://forms.embarcadero.com/delphi-boot-camp-2016

※ページ下部の[オンデマンド視聴]から[登録実行]を行ってご視聴ください。準備ができ次第、順次アップロードされます。

 

以下、Webセミナー上でご紹介したリンク情報など記載いたします。

多くの資料はエンバカデロのドキュメントWikiから引用しています。

 

■サンプルコードについて

動画内で説明のとおりでありますが、RAD Studio / Delphiインストール時に「sample」を追加インストールしておくとHDD内にコピーされています。しかし、バグ修正や改善がなされているサンプルコードがオンライン上にリポジトリとして保存してあります。

RAD Studio 10.1 Berlin時のサンプルコード類のリポジトリはこちら: https://sourceforge.net/p/radstudiodemos/code/HEAD/tree/branches/RADStudio_Berlin/

こちらをダウンロードしてサンプルコードとしてお使いいただくことを推奨します。

 

■主要なコンポーネントを確認できるサンプルコード:

まずは主だったコンポーネント(パーツ)を覚えていただく方法として、主要なパーツが使われているサンプルコードを開いていただきました。

 

■学習に使えるリンク

 

■ユーザーインターフェースのレイアウトを構成する要素

 

■レイアウトに便利なコンポーネント

レイアウトをする上で便利なコンポーネント類をご紹介しました。

ヘルプやDockwikiにあるチュートリアル、サンプルコードを上手に使ってコンポーネントの使い方を学んでいただけます。

 

■レイアウト応用編  - レイアウトマネージャ -

レイアウトマネージャ:http://embt.co/firemonkey-layoutmgr

  • TFlowLayout
  • TGridLayout
  • TGridPanelLayout

スケールレイアウト:http://embt.co/scaledlayout

  • TScaledLayout

スクロールボックス: http://embt.co/scrollbox

  • TScrollBox

 

■ユーザーインターフェイスをより見栄えよく 

アニメーションやエフェクトを使うことで、生き生きとした、インタラクティブな、ユーザーのアテンションをとれるUIとなります。

ご参考:スタイルについては、こちらのブログで使用法をご紹介しています。

簡単にUIの印象を変える方法 - Styleの適用 - FireMonkey と VCL [Japan]

http://community.embarcadero.com/manage-blog-posts?view=entry&id=8713

 

■使いやすいUIを作るコツ – 処理編 -

メインスレッド(メインのUIフォーム)上で時間のかかる処理を行うと、アプリがハングしているように見えます。TTaskなどを使用して処理を分けてあげましょう。

デモで使用していたTTaskはこちら:並列プログラミング ライブラリの TTask の使用

参考までにTTaskを使用していたボタン側に記載していたコードは以下となります。

//TTask demo (ppl)
uses
    System.Threading;

procedure TForm1.btnTaskClick(Sender: TObject);
var
    aTask: ITask;
begin
    aTask := TTask.Create(procedure ()
    begin
    Sleep(5000);
    Show('TTask - Finish'); // Show はMemo1 に完了メッセージを表示している
    end);
    atask.Start;
end;

 

 



About
Gold User, No rank,
Sales consultant - Embarcadero Technologies , at Japan Twitter : @kazaiso

Comments

Check out more tips and tricks in this development video: