【glide】ハートのお気に入りをつけれるオーバーレイ機能【使い方と設定方法】

最近、注目を浴びているノーコード。

簡単にアプリが作れる人気のノーコードツールGlideなら、プログラミングなしでアプリが作れると言われています。

ここでは、Glideの「オーバーレイの使い方と設定方法」を紹介します。

Glide

Glide(グライド)は、ノーコードツールで、Googleのスプレッドシートを用いて、アプリを作成できるサービスです。

クリックアンドドラッグで操作ができ、テンプレートやスプレッドシートとの連携が容易にできるためプログラミングは必要ありません。


プログラムコードの入力をせずに画面を操作してアプリが作成が可能で、簡単にアプリを作成することができる人気ツール。

Glideは、無料で登録して使用することができます。

オーバーレイの設定

オーバーレイは、表面を覆うという意味があります。

Glideにはオーバレイ機能があります。

以下の画像はオーバーレイを使用して、画像の上に文字やテキストを表示しています。

このように画像の表面に追加することができるレイヤーです。

glideでは、簡単にオーバーレイを使用することができます。

通常は画像だけが表示されますが、オーバーレイを使用することで、画像の上にマークやテキストを重ねて表示することが可能です。


Glideでオーバーレイが使用できるレイアウトは、「タイルレイアウト」と「カードレイアウト」と「画像コンポーネント」

オーバーレイを表示できるレイアウトは決まっています。

オーバーレイが使用できるレイアウトでのみ追加することができます。

オーバーレイの設定方法

オーバーレイは、画像やリストアイテムに追加できる追加のレイヤーです。

レイアウトの「タイルレイアウト」と「カードレイアウト」で、左側をスクロールした下の部分にOVERLAYS(オーバーレイ)があります。

OVERLAYS(オーバーレイ)の項目

  • Button:ボタン
  • TAG:タグ
  • Avator:アバター
  • Caption:キャプション


以上の4つの項目がありました。

オーバーレイに表示されるデータは、シートの列から取得されます。

それぞれの項目にシートの列を選択して、画像の上に表示させます。


一番上にあるのはButtom(ボタン)です。

Buttonには、ハートマークのFavoriteがあります。

画像の上部にお気に入りが追加され、画像にはハートマークが入ります。

ハートをクリックすると白くなります。

スプレッドシートには、Is Favoriteが記入されます。

ハートのクリックでチェックが入りますので、リレーションなどを使用してカウントをしたり出来そうです。


その他は以下のように表示されます。

タグは、シートの列から選択します。左側に色付きのタグが入ります。

アバターは、左下に丸い画像が入ります。image画像を表示しています。

キャプションは下に追加でテキストを入れれます。表示したい列を選択します。

カードレイアウトでは、Avatar Textもあり、アバターの横にテキストを入れこともできます。


レイアウトは設定を変えると、見え方も異なります。

このように画像の上に表示できるので、必要に応じてオーバーレイを使用してください。

アイキャッチになったり、視認性の向上にもつながります。

動画解説


ここでは、グライドのオーバーレイの設定方法を紹介しました。

そのほかのGlideの記事はこちら。

⇒ Glideの使い方【アプリダッシュボード】アプリ作成手順

⇒ ノーコードGlide【Googleのスプレッドシートを使用したアプリ作成編】

⇒ Glideの外観変更

⇒ Glideのログイン認証設定

⇒ GlideのアプリのTAB設定

⇒ Glideのアプリのアイコン変更とアプリ情報入力方法

⇒ GlideのChatの設定

スポンサードリンク



コメントを残す

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