Smobiler實現手機彈窗

前言

在實際項目中有很多場景需要用到彈窗，如圖1

那么這些彈窗在Smobiler中如何實現呢？

正文

Smobiler實現彈窗有兩種方式：1.MessageBox.Show 2.ShowDialog和ShowContextDialog。前者適合簡易彈窗，后者適合自定義彈窗。

MessageBox

實現代碼?

MessageBox.Show("這是個彈窗", "彈窗標題", MessageBoxButtons.YesNo, (obj, args) =>
???????????? {
???????????????? if (args.Result == ShowResult.No) { }
???????????? });
效果圖

MessageBox的屬性方法具體說明參照（https://www.smobiler.com/Help/html/T_Smobiler_Core_Controls_MobileMessageBox.htm）? MessageBoxButtons用于指定 MessageBox 上將顯示的按鈕，這種彈窗適合作為提示框或者二次確認框。

ShowDialog和ShowContextDialog

ShowDialog和ShowContextDialog具體方法詳見文檔（https://www.smobiler.com/Help/html/Methods_T_Smobiler_Core_Controls_MobileLayoutControl.htm） 該方法彈窗樣式是新建UserControl類，在UserControl類實現樣式并通過ShowDialog或者ShowDialog彈出UserControl，ShowDialog與ShowContextDialog用法相同，區別在與ShowContextDialog是用在戶點擊處彈出彈窗，而ShowDialog彈出的位置則是固定的。
接下來實現圖1(b),帶輸入框的彈窗。首先新建一個SmobilerUserControl類，命名為EditPwd，布局如下
??
?? 在Button的press事件中寫入如下代碼

???? ShowDialog(new EditPwd());// ShowContextDialog(new EditPwd());
效果圖
?????

圖1(c)的彈窗是從底部彈出，首先新建一個SmobilerUserControl類，命名為TipLayout，布局仿照圖1(c)，此處省略，具體代碼

/* DialogOptions參數說明
? * justifyAlign: LayoutJustifyAlign.FlexEnd 布局顯示在最下面
? * backColor: System.Drawing.Color.FromArgb(128, 128, 128, 128) 整個Dialog的背景色
? * padding: Padding.Empty 設置內邊框為空，就是全屏顯示
? * touchClosed: true 是否點擊空白處關閉
????????????????????????? */
? DialogOptions footerDialogOptions;
???????????? footerDialogOptions = new DialogOptions(LayoutJustifyAlign.FlexEnd, 128), Padding.Empty, true);
???????????? ShowDialog(new TipLayout(), footerDialogOptions);
效果圖
??
?? 默認的DialogOptions為： JustifyAlign = Center, Padding = 20, BackColor = 200,128,128,128, AnimationType = None, TouchClosed = true，所以ShowDialog(new EditPwd())的彈窗是在中間。