概要
Mac 上の AIR 標準のアラートは、ひと昔前のものに見えます。KlugDialog は本物を表示します:アプリウィンドウに取り付けられたネイティブの macOS アラートシートで、アプリアイコン、システムフォント、おなじみのボタンスタイルを備えています。
単純なアラートにとどまらず、デスクトップアプリが日常的に必要とするものをカバーします:テキストフィールド付きダイアログ(たとえばユーザー名とパスワード。セキュアフィールドにも対応)、独自のスタイルを持つ複数のボタン、そして処理が終わるとコードから更新・閉じられる進行状況シート(「接続中…」)。
すべて非同期です。show() は即座に返り、コールバックが選択されたボタンを受け取ります。KlugDialog は、実証の場である当社のアプリの Mac 版で使われています。
Android に新対応:同じダイアログを Android のネイティブダイアログとして提供します。テキストフィールドはどの画面でも、タブレットの横向きでも、キーボードの上に表示されます(以前はボタンがキーボードの後ろに隠れていました)。パスワード、ユーザー名、メールアドレスは自動で大文字化されず、メールフィールドにはメール用キーボードが表示されます。Android 版は、長いボタンリストの縦積みやシンプルなスピナーにも対応し、当社アプリの Android 版で稼働しています。
iOS にも対応:バージョン 1.2 以降、同じ API でネイティブの iOS アラート、テキストフィールド付きダイアログ、進行状況ダイアログを表示できるため、ひとつのコードパスで Android、iOS、macOS に対応できます。
機能
- 自己完結型:ANE 1つで完結し、コアライブラリや依存 ANE の追加は不要
- 最大3つのボタンを持つネイティブの macOS アラートシート
- 情報、警告、重大のスタイル
- 任意の数のボタンとテキストフィールド(セキュアフィールドを含む)を持つダイアログ
- コードから更新・クローズできる進行状況シート
- ダイアログをコードから閉じることが可能
- 選択されたボタンと入力値を受け取るコールバック
- Android:キーボードの上に表示されるフィールド、パスワードの自動大文字化なし、メール / 数字キーボード、ライトテーマとダークテーマ
対応プラットフォーム
他のプラットフォームでは isSupported が false を返すため、アプリはそこで通常のダイアログにフォールバックできます。
はじめに
アプリケーション記述子に拡張機能を追加します:
<extensions>
<extensionID>com.klug.dialog.Dialog</extensionID>
</extensions>
コード例
5つの完全なフローです。すべての呼び出しは即座に返り、結果は後からコールバックに届くため、ダイアログの表示中もアプリがブロックされることはありません。完全なドキュメント →
import com.klug.dialog.Dialog; var dialog:Dialog = Dialog.getInstance(); if ( dialog.isSupported ) { dialog.show( "Saved", "The recording is in your library." ); // one "OK" button } else { showAppAlert( "Saved" ); // your app's own fallback dialog, e.g. on Windows }
dialog.show( "Delete recording?", "This cannot be undone.", [ "Delete", "Keep" ], function( index:int ):void { // index = position in the buttons array; // -1 = closed without a button, e.g. the Android back key if ( index == 0 ) deleteRecording(); // your app }, Dialog.STYLE_WARNING ); // alert style of the macOS sheet
var buttons:Array = [ { label:"Cancel", style:4, tag:0 }, // style 4 = cancel, 3 = destructive { label:"Sign in", style:0, tag:1 } ]; var fields:Array = [ { placeholder:"E-mail", text:lastEmail, keyboardType:7 }, // 7 = e-mail keyboard { placeholder:"Password", secure:true } // never auto-capitalised ]; dialog.present( "Sign in", "Please enter your account.", true, buttons, fields, function( tag:int, values:Array, cancelled:Boolean = false ):void { if ( cancelled ) return; // closed without a button (tag -1) if ( tag == 1 ) signIn( values[0], values[1] ); // values in field order }, null, "dark" ); // theme on Android and iOS; macOS follows the system
// your own id: the same dialog is updated and closed with it dialog.progressShow( "connect", "Connecting", "Contacting the server…", false, function():void { trace( "progress dialog closed" ); } ); // fires once dialog.progressUpdate( "connect", "Signing in…" ); // when the work is done, or has failed dialog.progressDismiss( "connect" );
// pass your own id as the 7th parameter to close the dialog later dialog.present( "Waiting for the camera", "Tap Cancel to stop waiting.", false, [ { label:"Cancel", style:4, tag:0 } ], null, function( tag:int, values:Array ):void { stopWaiting(); }, // your app "waitCamera" ); // the camera has answered: close the dialog, no callback fires dialog.presentDismiss( "waitCamera" );
API 概要
| Dialog.getInstance() | 唯一のインスタンスを返します。 |
| isSupported | Android、iOS、macOS では true、それ以外(たとえば Windows)では false です。 |
| show(title, message, buttons, callback, style) | 最大3つのボタンを持つアラート(既定は "OK")。callback(index) が呼ばれ、ボタンを押さずに閉じられた場合は -1。非対応の場合は false を返します。 |
| present(title, message, cancelable, buttons, fields, callback, id, theme) | 任意の数のボタンとテキストフィールドを持つダイアログ。callback(tag, values, cancelled)。後で閉じるために独自の id を渡せます。theme は Android と iOS で "light" または "dark"。 |
| presentDismiss(id) | present() のダイアログをコードから閉じます。コールバックは呼び出されません。 |
| progressShow(id, title, message, cancelable, closeCallback, theme) | スピナー付きの進行状況ダイアログ。閉じられた時点で closeCallback が一度だけ呼ばれます。 |
| progressUpdate(id, message) / progressDismiss(id) | 進行状況ダイアログのテキストを変更 / ダイアログを閉じます。 |
| STYLE_INFO, STYLE_WARNING, STYLE_CRITICAL | show() のアラートスタイル。macOS のアラートシートで使用されます。 |
| Button {label, style, tag} | style:0 既定、1 肯定、2 否定、3 破壊的、4 キャンセル、5 中立。Android はすべてを使用し、iOS は 3 と 4 を使用し、macOS はすべてのボタンを同じ見た目で表示します。 |
| Field {placeholder, secure, text, keyboardType, autocorrect, autocap} | keyboardType:0 既定、3 URL、4 数字、5 電話、7 メール、8 小数。autocap:0 なし(既定)、1 文、2 単語、3 すべて。後ろの3つは Android と iOS で有効です。 |
KlugDialog を購入
AIR アプリケーション1つ分の年間ライセンスで、12か月間のすべてのアップデートが含まれます。お支払い後、拡張機能、ActionScript ライブラリ、ドキュメントをメールでお送りします(通常は1営業日以内)。ライセンスと条件
動作要件
| AIR SDK | 51.x(HARMAN) |
| Android | Android 6 以降 |
| iOS | iOS 13 以降 |
| macOS | macOS 11 以降 |