アプリにカスタムコンポーネントを追加する方法

Qodly Studio for 4Dは、あらゆる機能をそなえた複雑なビジネスアプリケーションを作成するためのパワフルなツールです。最初から付属するコンポーネントは多機能ですが、ソリューションをカスタムすることが不可欠な場合もあります。

カスタムコンポーネントを使えば、自分のプロジェクト用にカスタムされたソリューションを構築することができ、4Dやコミュニティによって構築された多くのコンポーネントの恩恵を受けることで、ユーザーインターフェイスを充実させることができます。

このブログ記事では、ビデオチュートリアルを交えて、カスタムコンポーネントを4DプロジェクトのQodly Studioに組み込む手順を説明します。

カスタムコンポーネントのメリット

カスタムコンポーネントを使用すると、4Dフォームで使用される4Dコンポーネントや4Dプラグインと同様に、Qodly Studio for 4Dアプリケーションのユーザーインターフェイスを豊かにすることができます。

以下は、公開されているカスタムコンポーネントの例です：

• 日付ピッカー

  

• 評価ウィジェット
  
  

• カラーピッカー
  
  

• カレンダー(月次、週次、日次)
  
  

• チャート
  
  

• 地図

  

• タイムライン

  

• 他にもこちらにまだまだたくさんあります！

カスタムコンポーネントはReactを使って作られており、開発者にとって柔軟でパワフルな基盤を提供します。

Qodlyカスタムコンポーネントのインストール方法

1. コンポーネントを選択する：GitHubのQodly custom componentsリポジトリの一覧の中から、使用したいコンポーネントを選択します。
2. 最新バージョンをダウンロードする：コンポーネントをクリックし、Releasesセクションに移動し、最新バージョンをダウンロードするようにしてください。zipをクリックしてダウンロードします。必ずReleasesセクションに行き、ダウンロードはソースそのものではなく、ビルド前のコンポーネントをダウンロードするという点に注意してください。
   
   

3. Qodly Studio for 4D 側の手順：
   1. Components セクションで、Upload component ボタンをクリックします。
   2. ダウンロードしたコンポーネントを選択するか、あるいはそれをダイアログにドラッグ＆ドロップします。
   3. Install Component をクリックし、Reload をクリックします。
   4. コンポーネントは、コンポーネントセクションの下にあるCustomのリストに表示されるはずです。

   

4. これで準備は完了です: コンポーネントをプロジェクトで使用する準備ができました。