コンポーネントの基本

画面を構築するためのコンポーネントの使用方法のご紹介します。

コンポーネントについて学ぶ

コンポーネントは、アプリのデザインの基本要素です。ユーザーがアプリを使用する際に相互作用するものすべてはコンポーネントと見なされます。これらはアプリの視覚要素です！

コンポーネントの挿入

コンポーネントは、＋ボタンをクリックした後に表示される追加パネルにあります。挿入するには、画面にドラッグしてクリックします。

コンポーネントは画面上のすべての要素です — リスト、ボタン、テキストなど

• Addパネルからコンポーネントを画面キャンバスにドラッグ＆ドロップします。

• 1つの画面から別の画面にコンポーネントをコピー＆ペーストするには、コンポーネントを選択してコピーし、新しい画面の画面タイトルをクリックして貼り付けます。

• コンポーネントを編集するには、それをクリックすると左側のパネルが開き、コンポーネントを構成およびカスタマイズするためのすべてのオプションが表示されます。

• コンポーネントをグループ化する場合は、複数のコンポーネントを選択してドラッグし、左側のパネルで"Make Group"ボタンをクリックします。

• 画面上のコンポーネントの順序を調整して、1つのコンポーネントが他のコンポーネントの上または下に配置されるようにするには、ツールバーの'Screens'タブに移動し、関連する画面をクリックしてそのコンポーネントのリストを表示します。そのリストでコンポーネントを上下にドラッグして、順序を前後に移動します。

• コンポーネントをクリックしてアクションにリンクさせるか、別の画面にリンクさせるには、アクションの基礎セクションをご覧ください。

コンポーネントは非常にシンプルなものから多くのオプションを持つ堅牢なものまでさまざまです。テキストや図形などのシンプルなコンポーネントを組み合わせて独自のカスタムデザインを作成できます。

すべてのコンポーネント

ナビゲーション

• タブバー

• アプリバー

• サイドナビゲーション
• トップナビゲーション

リスト

• シンプルリスト

• カードリスト

• 画像リスト

• アバターリスト

• 横型のカードリスト

• 横型のチップリスト

• カスタムリスト

ボタン

• ボタン

• アクションボタン

• アイコン

• トグル

シンプル

• テキスト

• 画像

• 楕円

• 四角形

• 線

• ベクトル

• Webビューコンポーネント
• ビデオコンポーネント

フォーム＆フィールド

• フォーム
• テキスト入力
• 日付ピッカー

• ドロップダウンメニュー

• ファイルピッカー

• 画像ピッカー

マーケットプレイスのコンポーネント

• マップ

• カレンダー

• 画像スライダー

• Googleサインイン

• マルチセレクトドロップダウン

• スターレーティング

• プログレスバー

• YouTube

• AdMobバナー

• Stripe Kit

• デッキスワイパー

• Plyrビデオ

• チャートキット

• オーディオプレーヤー

• Appleサインイン

• メールアドレス検証

• スライダー

• Lottie

• QRコードジェネレータ（by Knight）

• カウントダウン

• ランダマイザー

• NocoderHQ HTMLRenderer

• QRコードスキャナー

• カレンダーストライプ

• ストップウォッチ

• シグネチャーパッド

• IAPキット

• QRコードジェネレータ（by Zeroqode）

• マジックカラーの四角形

• NocoderHQ ラウンドボタン

• ランダムピッカー

• NocoderHQ カウントダウン

• Twitter タイムライン

• URL エンコードデコーダー

• スイッチ

• マスクされたフォーム

• Markdown レンダラー

• Jam Room