【Ionic】ActionSheet(BottomSheet)の作成

IonicでActionSheet(BottomSheet)を作成する方法についてまとめました。

【Ionic】ActionSheet(BottomSheet)の作成

ActionSheet(BottomSheet)は、「機能選択」「起動する他のアプリ選択」に使われる画面下部に表示されるダイアログです。
Ionicでは、ActionSheetモジュールのActionSheetControllerで実装できます。

showActionSheet() {
  // ActionSheetの作成
  let sheet = this.actionSheetCtrl.create({
    title: 'Choice',
    buttons: [
      {
        text: '機能1',
        handler: () => {
          console.log('機能1が選択されました');
        }
      },
      {
        text: '機能2',
        handler: () => {
          console.log(''機能2が選択されました');
        }
      },
      {
        text: '機能3',
        role:'cancel',
        handler: () => {
          console.log('機能3が選択されました');
        }
      }
    ]
  });
 
  sheet.present();
}
参考文献・関連記事
関連 【Ionic入門】Android・iOSアプリ開発編
関連記事