最近のアクセス:
SD Image Gallery コントロールを使用する方法

警告: このコントロールは GeneXus 16 Upgrade 11 以降では廃止されました。

スマートデバイス用 SD Image Gallery コントロールを使用すると、既定の Grid コントロールとは異なる方法で画像を表示、操作できます。
リストのデータには、Image データタイプに基づくフィールドが必要です。コントロールでは、このデータを使用して、画像がより高度な方法で表示されます。
コントロールの実行時の動作は、いくつかのプロパティの値と、アプリケーションが実行されているプラットフォームによって異なります。例に示すように、イメージギャラリーでのエレメントの表示方法や、表示する追加情報は、プロパティを変更することで設定できます。
イメージ:23155.jpg
このコントロールのポイントは、アイテムのコレクションがイメージギャラリーとして表示されていても、リストのように動作する点です。このため、通常のリストと同じように、アイテムの詳細表示を開いたり、既定のリストアクション (アイテムの追加、更新、削除) を実行したり、実行するアクションをカスタマイズしたりすることができます。
イメージ:23156.jpg

コントロールの使用

コントロールを設定するには、先に Work With オブジェクト (WWSD) パターンを Transaction オブジェクトに適用します。次に、 [ Grid ] プロパティを開き、[ Control Type ] プロパティを探します。このプロパティは既定で値が空になっています。
このプロパティに「SD Image Gallery」を選択します。次に、 [ Data Attribute ] プロパティを、イメージギャラリーでグリッド内の各エレメントに表示する画像項目属性に設定します。プロパティの設定例を以下に示します。
イメージ:17593.jpg
この時点でアプリケーションを実行した場合、イメージギャラリーの外観および操作感は既定のものになります。

プロパティ

イメージギャラリーの動作と外観をカスタマイズできるプロパティを次に示します。
Data Attributeこのプロパティでは、イメージギャラリーに表示する項目属性の名前を宣言します。
Grid Behavior次の 3 つのオプションがあります: Show Full Image、Show Detail View、None。Show Full Image の場合、グリッドに大きな画像 (1 つのスライドに 1 つ) が表示されます。Show Detail View の場合、イメージギャラリーが小さな画像のセットとして表示されます (1 つのスライドに複数)。値が None の場合は、プラットフォームの既定値が使用されます。この後に例をいくつか示しています。
Title Attribute画像のタイトルにする項目属性を指定します。このプロパティで設定した項目属性の値が画像の上に表示されます。
Subtitle Attribute画像のサブタイトルにする項目属性を指定します。このプロパティで設定した項目属性の値が画像の下に表示されます。既定では、タイトル項目属性とサブタイトル項目属性の前景色は黒です (背景色と同じ)。これらの属性の [ Forecolor ] プロパティを変更するには、 [ Theme ] の [ Title class ] と [ Subtitle class ] ( [ Attribute class ] の下) を設定します。
Enable Share Actionこのプロパティは、複数の画像を選択してメールで送信できるボタンをユーザーインターフェースに追加します。詳細については、「Image Gallery に共有アクションを使用する方法」を参照してください。

 

[ Grid Behavior ] : Show Detail View
イメージ:17586.jpg
小さな画像をタップすると、そのアイテムの詳細が表示されます。
イメージ:17589.jpg
[ Grid Behavior ] が Show Full Image の場合、すべての画像が詳細表示として表示されますが、1 つをタップすると、大きな画像に移動し、ジェスチャーで次の大きな画像に移動できます。
イメージ:17590.jpg
大きな画像をタップすると、アイテムの詳細表示が表示されます。
イメージ:17591.jpg
Android では、一時的な制限により、 [ Grid Behavior ] プロパティの設定に関係なく、次のような表示になります。
イメージ:17592.jpg
このギャラリーは MyCowBook で確認できます。

Android の場合

このコントロールの背景色を変更するには、Android のテーマで Grid\Background Color クラスを設定する必要があります。

iOS の場合

このコントロールの詳細表示の背景色を変更するには、iOS のテーマで Grid\Background Color クラスを設定する必要があります。

使用可能バージョン

この機能は、GeneXus X Evolution 2 Upgrade 5 以降で利用できます。

動画

イメージ:20668.png Work With for Smart Devices – 全般および List レイアウト
イメージ:20668.png Work With for Smart Devices – Detail レイアウト

 






 

サブページ
Created: 20/12/14 21:39 by Admin Last update: 21/05/21 05:25 by Admin
カテゴリ
Powered by GXwiki 3.0