Pull request #11837: REPORT-90316 移动端控件翻新----更新部分配置界面

Merge in DESIGN/design from ~CORAL.CHEN/design:feature/x to feature/x

* commit '4579044b06afea3f65a45cf18ecc1959124b826d':
  REPORT-90316 移动端控件翻新----更新部分配置界面
  REPORT-90316 移动端控件翻新----更新部分配置界面

designer-form/src/main/java/com/fr/design/designer/creator/XNumberEditor.java

@@ -6,7 +6,9 @@ package com.fr.design.designer.creator;
 import com.fr.base.BaseUtils;
 import com.fr.base.ScreenResolution;
 import com.fr.base.Style;
+import com.fr.design.designer.properties.mobile.NumberEditorMobilePropertyUI;
 import com.fr.design.form.util.XCreatorConstants;
+import com.fr.design.fun.WidgetPropertyUIProvider;
 import com.fr.design.mainframe.widget.editors.InChangeBooleanEditor;
 import com.fr.design.mainframe.widget.editors.SpinnerMaxNumberEditor;
 import com.fr.design.mainframe.widget.editors.SpinnerMinNumberEditor;
@@ -91,15 +93,19 @@ public class XNumberEditor extends XWrapperedFieldEditor {
 		}
 	}
 
-    @Override
+	@Override
 	protected JComponent initEditor() {
 		setBorder(FIELDBORDER);
 		return this;
 	}
 
-    @Override
+	@Override
-    protected String getIconName() {
+	protected String getIconName() {
-        return "number_field_16.png";
+		return "number_field_16.png";
-    }
+	}
 
+	@Override
+	public WidgetPropertyUIProvider[] getWidgetPropertyUIProviders() {
+		return new WidgetPropertyUIProvider[]{new NumberEditorMobilePropertyUI(this)};
+	}
 }

designer-form/src/main/java/com/fr/design/designer/creator/XPassword.java

@@ -3,7 +3,9 @@
  */
 package com.fr.design.designer.creator;
 
+import com.fr.design.designer.properties.mobile.PasswordMobilePropertyUI;
 import com.fr.design.form.util.XCreatorConstants;
+import com.fr.design.fun.WidgetPropertyUIProvider;
 import com.fr.design.gui.ibutton.UIPasswordField;
 import com.fr.design.mainframe.widget.editors.RegexEditor;
 import com.fr.design.mainframe.widget.editors.WidgetValueEditor;
@@ -68,4 +70,8 @@ public class XPassword extends XWrapperedFieldEditor {
                 (CRPropertyDescriptor[]) ArrayUtils.addAll(sup, new CRPropertyDescriptor[]{regex, waterMark});
     }
 
+    @Override
+    public WidgetPropertyUIProvider[] getWidgetPropertyUIProviders() {
+        return new WidgetPropertyUIProvider[]{new PasswordMobilePropertyUI(this)};
+    }
 }

designer-form/src/main/java/com/fr/design/designer/creator/XTextArea.java

@@ -6,7 +6,9 @@ package com.fr.design.designer.creator;
 import com.fr.base.BaseUtils;
 import com.fr.base.ScreenResolution;
 import com.fr.base.Style;
+import com.fr.design.designer.properties.mobile.TextAreaMobilePropertyUI;
 import com.fr.design.form.util.XCreatorConstants;
+import com.fr.design.fun.WidgetPropertyUIProvider;
 import com.fr.design.mainframe.widget.editors.RegexEditor;
 import com.fr.design.mainframe.widget.editors.WidgetValueEditor;
 import com.fr.design.mainframe.widget.renderer.RegexCellRencerer;
@@ -25,8 +27,9 @@ import java.beans.IntrospectionException;
 /**
  * @author richer
  * @since 6.5.3
+ * Created on 2016/3/29
  */
-public class XTextArea extends XFieldEditor {
+public class XTextArea extends XWrapperedFieldEditor {
 
     public XTextArea(TextArea widget, Dimension initSize) {
         super(widget, initSize);
@@ -81,4 +84,10 @@ public class XTextArea extends XFieldEditor {
     protected String getIconName() {
         return "text_area_16.png";
     }
+
+    @Override
+    public WidgetPropertyUIProvider[] getWidgetPropertyUIProviders() {
+        return new WidgetPropertyUIProvider[]{new TextAreaMobilePropertyUI(this)};
+    }
+
 }

designer-form/src/main/java/com/fr/design/designer/properties/mobile/NumberEditorMobilePropertyUI.java

@@ -0,0 +1,37 @@
+package com.fr.design.designer.properties.mobile;
+
+import com.fr.design.designer.creator.XCreator;
+import com.fr.design.dialog.BasicPane;
+import com.fr.design.fun.impl.AbstractWidgetPropertyUIProvider;
+import com.fr.design.gui.itable.AbstractPropertyTable;
+import com.fr.design.widget.ui.designer.mobile.NumberEditorMobileDefinePane;
+
+/**
+ * 数字控件属性面板注册
+ *
+ * @author Coral.Chen
+ * @since 11.0
+ * Created on 2023/3/30
+ */
+public class NumberEditorMobilePropertyUI extends AbstractWidgetPropertyUIProvider {
+    private XCreator xCreator;
+
+    public NumberEditorMobilePropertyUI(XCreator xCreator) {
+        this.xCreator = xCreator;
+    }
+
+    @Override
+    public AbstractPropertyTable createWidgetAttrTable() {
+        return null;
+    }
+
+    @Override
+    public BasicPane createWidgetAttrPane() {
+        return new NumberEditorMobileDefinePane(xCreator);
+    }
+
+    @Override
+    public String tableTitle() {
+        return com.fr.design.i18n.Toolkit.i18nText("Fine-Design_Report_Mobile_Attr");
+    }
+}

designer-form/src/main/java/com/fr/design/designer/properties/mobile/PasswordMobilePropertyUI.java

@@ -0,0 +1,37 @@
+package com.fr.design.designer.properties.mobile;
+
+import com.fr.design.designer.creator.XCreator;
+import com.fr.design.dialog.BasicPane;
+import com.fr.design.fun.impl.AbstractWidgetPropertyUIProvider;
+import com.fr.design.gui.itable.AbstractPropertyTable;
+import com.fr.design.widget.ui.designer.mobile.PasswordMobileDefinePane;
+
+/**
+ * 密码控件移动端属性注册
+ *
+ * @author Coral.Chen
+ * @since 11.0
+ * Created on 2023/3/30
+ */
+public class PasswordMobilePropertyUI extends AbstractWidgetPropertyUIProvider {
+    private XCreator xCreator;
+
+    public PasswordMobilePropertyUI(XCreator xCreator) {
+        this.xCreator = xCreator;
+    }
+
+    @Override
+    public AbstractPropertyTable createWidgetAttrTable() {
+        return null;
+    }
+
+    @Override
+    public BasicPane createWidgetAttrPane() {
+        return new PasswordMobileDefinePane(xCreator);
+    }
+
+    @Override
+    public String tableTitle() {
+        return com.fr.design.i18n.Toolkit.i18nText("Fine-Design_Report_Mobile_Attr");
+    }
+}

designer-form/src/main/java/com/fr/design/designer/properties/mobile/TextAreaMobilePropertyUI.java

@@ -0,0 +1,37 @@
+package com.fr.design.designer.properties.mobile;
+
+import com.fr.design.designer.creator.XCreator;
+import com.fr.design.dialog.BasicPane;
+import com.fr.design.fun.impl.AbstractWidgetPropertyUIProvider;
+import com.fr.design.gui.itable.AbstractPropertyTable;
+import com.fr.design.widget.ui.designer.mobile.TextAreaAdvancedDefinePane;
+
+/**
+ * 文本域控件移动端属性
+ *
+ * @author Coral.Chen
+ * @since 11.0
+ * Created on 2023/3/29
+ */
+public class TextAreaMobilePropertyUI extends AbstractWidgetPropertyUIProvider {
+    private XCreator xCreator;
+
+    public TextAreaMobilePropertyUI(XCreator xCreator) {
+        this.xCreator = xCreator;
+    }
+
+    @Override
+    public AbstractPropertyTable createWidgetAttrTable() {
+        return null;
+    }
+
+    @Override
+    public BasicPane createWidgetAttrPane() {
+        return new TextAreaAdvancedDefinePane(xCreator);
+    }
+
+    @Override
+    public String tableTitle() {
+        return com.fr.design.i18n.Toolkit.i18nText("Fine-Design_Report_Mobile_Attr");
+    }
+}

designer-form/src/main/java/com/fr/design/widget/ui/designer/mobile/BaseTextEditorMobileDefinePane.java

@@ -0,0 +1,94 @@
+package com.fr.design.widget.ui.designer.mobile;
+
+import com.fr.design.designer.creator.XCreator;
+import com.fr.design.foldablepane.UIExpandablePane;
+import com.fr.design.gui.frpane.AttributeChangeListener;
+import com.fr.design.i18n.Toolkit;
+import com.fr.design.layout.FRGUIPaneFactory;
+import com.fr.design.mainframe.DesignerContext;
+import com.fr.design.mainframe.FormDesigner;
+import com.fr.design.widget.ui.designer.mobile.component.MobileTextEditSettingPane;
+import com.fr.form.ui.TextEditor;
+
+import javax.swing.JPanel;
+import java.awt.BorderLayout;
+import java.awt.FlowLayout;
+
+/**
+ * <p> 文本类组件移动端高级属性的定义面板，基础扩展可以直接继承此面板
+ * <p> 往内部添加其他配置
+ *
+ * @author Coral.Chen
+ * @since 11.0
+ * Created on 2023/3/30
+ */
+public class BaseTextEditorMobileDefinePane extends MobileWidgetDefinePane {
+
+    private XCreator xCreator;
+    protected MobileTextEditSettingPane textSettingPane;
+
+    public BaseTextEditorMobileDefinePane(XCreator xCreator) {
+        this.xCreator = xCreator;
+    }
+
+    @Override
+    public void initPropertyGroups(Object source) {
+        this.setLayout(FRGUIPaneFactory.createBorderLayout());
+        JPanel container = FRGUIPaneFactory.createVerticalFlowLayout_Pane(true, FlowLayout.LEADING, 0, 5);
+        addPropertyPanesToContainer(container);
+        this.add(new UIExpandablePane(Toolkit.i18nText("Fine-Design_Report_Advanced"), 280, 20, container), BorderLayout.NORTH);
+        this.repaint();
+    }
+
+    /**
+     * 添加其他属性面板
+     *
+     * @param container 展开容器
+     */
+    protected void addPropertyPanesToContainer(JPanel container) {
+        initSettingPane(container);
+    }
+
+    /**
+     * 初始化文本类基础面板
+     *
+     * @param container
+     */
+    protected void initSettingPane(JPanel container) {
+        textSettingPane = new MobileTextEditSettingPane();
+        container.add(textSettingPane);
+    }
+
+    @Override
+    public void populate(FormDesigner designer) {
+        TextEditor textEditor = (TextEditor) xCreator.toData();
+        textSettingPane.populateBean(textEditor.getMobileTextEditAttr());
+        this.bindListeners2Widgets();
+    }
+
+    protected void bindListeners2Widgets() {
+        reInitAllListeners();
+        AttributeChangeListener changeListener = new AttributeChangeListener() {
+            @Override
+            public void attributeChange() {
+                update();
+            }
+        };
+        this.addAttributeChangeListener(changeListener);
+    }
+
+    private void reInitAllListeners() {
+        initListener(this);
+    }
+
+    @Override
+    public void update() {
+        TextEditor textEditor = (TextEditor) xCreator.toData();
+        textSettingPane.updateBean(textEditor.getMobileTextEditAttr());
+        DesignerContext.getDesignerFrame().getSelectedJTemplate().fireTargetModified();
+    }
+
+    public XCreator getxCreator() {
+        return xCreator;
+    }
+}

designer-form/src/main/java/com/fr/design/widget/ui/designer/mobile/NumberEditorMobileDefinePane.java

@@ -0,0 +1,33 @@
+package com.fr.design.widget.ui.designer.mobile;
+
+import com.fr.design.designer.creator.XCreator;
+import com.fr.design.mainframe.DesignerContext;
+import com.fr.design.mainframe.FormDesigner;
+import com.fr.form.ui.NumberEditor;
+
+/**
+ * 数字控件
+ *
+ * @author Coral.Chen
+ * @since 11.0
+ * Created on 2023/3/30
+ */
+public class NumberEditorMobileDefinePane extends BaseTextEditorMobileDefinePane {
+    public NumberEditorMobileDefinePane(XCreator xCreator) {
+        super(xCreator);
+    }
+
+    @Override
+    public void populate(FormDesigner designer) {
+        NumberEditor numberEditor = (NumberEditor) getxCreator().toData();
+        textSettingPane.populateBean(numberEditor.getMobileTextEditAttr());
+        this.bindListeners2Widgets();
+    }
+
+    @Override
+    public void update() {
+        NumberEditor numberEditor = (NumberEditor) getxCreator().toData();
+        textSettingPane.updateBean(numberEditor.getMobileTextEditAttr());
+        DesignerContext.getDesignerFrame().getSelectedJTemplate().fireTargetModified();
+    }
+}

designer-form/src/main/java/com/fr/design/widget/ui/designer/mobile/PasswordMobileDefinePane.java

@@ -0,0 +1,25 @@
+package com.fr.design.widget.ui.designer.mobile;
+
+import com.fr.design.designer.creator.XCreator;
+import com.fr.design.widget.ui.designer.mobile.component.MobilePasswordEditSettingPane;
+
+import javax.swing.JPanel;
+
+/**
+ * 密码控件移动端高级属性
+ *
+ * @author Coral.Chen
+ * @since 11.0
+ * Created on 2023/3/30
+ */
+public class PasswordMobileDefinePane extends BaseTextEditorMobileDefinePane {
+    public PasswordMobileDefinePane(XCreator xCreator) {
+        super(xCreator);
+    }
+
+    @Override
+    protected void initSettingPane(JPanel container) {
+        textSettingPane = new MobilePasswordEditSettingPane();
+        container.add(textSettingPane);
+    }
+}

designer-form/src/main/java/com/fr/design/widget/ui/designer/mobile/ScanCodeMobileDefinePane.java

@@ -1,61 +1,50 @@
 package com.fr.design.widget.ui.designer.mobile;
 
-import com.fr.base.mobile.MobileScanCodeAttr;
 import com.fr.design.designer.creator.XCreator;
-import com.fr.design.foldablepane.UIExpandablePane;
-import com.fr.design.gui.frpane.AttributeChangeListener;
-import com.fr.design.i18n.Toolkit;
-import com.fr.design.layout.FRGUIPaneFactory;
 import com.fr.design.mainframe.DesignerContext;
 import com.fr.design.mainframe.FormDesigner;
+import com.fr.design.widget.ui.designer.mobile.component.MobileTextEditSettingPane;
 import com.fr.design.widget.ui.designer.mobile.component.MobileTextFieldInputSettingPane;
 import com.fr.form.ui.TextEditor;
-import java.awt.BorderLayout;
 
+import javax.swing.JPanel;
 
-public class ScanCodeMobileDefinePane extends MobileWidgetDefinePane {
+/**
+ * 输入方式：
+ *
+ * @author hades
+ * @since 11.0
+ * Created on 2018/11/27
+ */
+public class ScanCodeMobileDefinePane extends BaseTextEditorMobileDefinePane {
 
-    private XCreator xCreator;
+    private MobileTextFieldInputSettingPane inputSettingPane;
-    private MobileTextFieldInputSettingPane settingPane;
 
     public ScanCodeMobileDefinePane(XCreator xCreator) {
-        this.xCreator = xCreator;
+        super(xCreator);
     }
 
     @Override
-    public void initPropertyGroups(Object source) {
+    protected void initSettingPane(JPanel container) {
-        this.setLayout(FRGUIPaneFactory.createBorderLayout());
+        inputSettingPane = new MobileTextFieldInputSettingPane();
-        settingPane = new MobileTextFieldInputSettingPane();
+        textSettingPane = new MobileTextEditSettingPane();
-        this.add(new UIExpandablePane(Toolkit.i18nText("Fine-Design_Report_Advanced"), 280, 20, settingPane), BorderLayout.NORTH);
+        container.add(inputSettingPane);
-        this.repaint();
+        container.add(textSettingPane);
     }
 
-    private void bindListeners2Widgets() {
-        reInitAllListeners();
-        AttributeChangeListener changeListener = new AttributeChangeListener() {
-            @Override
-            public void attributeChange() {
-                update();
-            }
-        };
-        this.addAttributeChangeListener(changeListener);
-    }
-
-    private void reInitAllListeners() {
-        initListener(this);
-    }
 
     @Override
     public void populate(FormDesigner designer) {
-        MobileScanCodeAttr mobileScanCodeAttr = ((TextEditor) xCreator.toData()).getMobileScanCodeAttr();
+        super.populate(designer);
-        settingPane.populateBean(mobileScanCodeAttr);
+        TextEditor textEditor = (TextEditor) getxCreator().toData();
+        inputSettingPane.populateBean(textEditor.getMobileScanCodeAttr());
         this.bindListeners2Widgets();
     }
-
     @Override
     public void update() {
-        MobileScanCodeAttr mobileScanCodeAttr = ((TextEditor) xCreator.toData()).getMobileScanCodeAttr();
+        super.update();
-        settingPane.updateBean(mobileScanCodeAttr);
+        TextEditor textEditor = (TextEditor) getxCreator().toData();
+        inputSettingPane.updateBean(textEditor.getMobileScanCodeAttr());
         DesignerContext.getDesignerFrame().getSelectedJTemplate().fireTargetModified();
     }
 

designer-form/src/main/java/com/fr/design/widget/ui/designer/mobile/TextAreaAdvancedDefinePane.java

@@ -0,0 +1,25 @@
+package com.fr.design.widget.ui.designer.mobile;
+
+import com.fr.design.designer.creator.XCreator;
+import com.fr.design.widget.ui.designer.mobile.component.MobileTextAreaSettingPane;
+
+import javax.swing.JPanel;
+
+/**
+ * 文本域控件
+ *
+ * @author Coral.Chen
+ * @since 11.0
+ * Created on 2023/3/29
+ */
+public class TextAreaAdvancedDefinePane extends BaseTextEditorMobileDefinePane {
+    public TextAreaAdvancedDefinePane(XCreator xCreator) {
+        super(xCreator);
+    }
+
+    @Override
+    protected void initSettingPane(JPanel container) {
+        textSettingPane = new MobileTextAreaSettingPane();
+        container.add(textSettingPane);
+    }
+}

designer-form/src/main/java/com/fr/design/widget/ui/designer/mobile/component/MobilePasswordEditSettingPane.java

@@ -0,0 +1,43 @@
+package com.fr.design.widget.ui.designer.mobile.component;
+
+import com.fr.base.mobile.MobileTextEditAttr;
+import com.fr.design.gui.icheckbox.UICheckBox;
+import com.fr.design.i18n.Toolkit;
+
+import java.awt.BorderLayout;
+
+/**
+ * 密码控件编辑属性设置面板
+ *
+ * @author Coral.Chen
+ * @since 11.0
+ * Created on 2023/3/30
+ */
+public class MobilePasswordEditSettingPane extends MobileTextEditSettingPane {
+    // 显示字数统计
+    private UICheckBox showPassword;
+
+    public MobilePasswordEditSettingPane() {
+        super();
+        showPassword = new UICheckBox(Toolkit.i18nText("Fine-Design_Mobile_Show_Password"), false);
+        this.add(showPassword, BorderLayout.NORTH);
+    }
+
+    @Override
+    protected boolean getClearDefaultState() {
+        return true;
+    }
+
+    @Override
+    public void populateBean(MobileTextEditAttr ob) {
+        super.populateBean(ob);
+        // 要兼容处理一下，为null 的话赋默认值，默认开启
+        this.showPassword.setSelected(ob.isShowPassword() == null || ob.isShowPassword());
+    }
+
+    @Override
+    public void updateBean(MobileTextEditAttr ob) {
+        super.updateBean(ob);
+        ob.setShowPassword(showPassword.isSelected());
+    }
+}

designer-form/src/main/java/com/fr/design/widget/ui/designer/mobile/component/MobileTextAreaSettingPane.java

@@ -0,0 +1,38 @@
+package com.fr.design.widget.ui.designer.mobile.component;
+
+import com.fr.base.mobile.MobileTextEditAttr;
+import com.fr.design.gui.icheckbox.UICheckBox;
+import com.fr.design.i18n.Toolkit;
+
+import java.awt.BorderLayout;
+
+/**
+ * 文本域控件
+ *
+ * @author Coral.Chen
+ * @since 11.0
+ * Created on 2023/3/29
+ */
+public class MobileTextAreaSettingPane extends MobileTextEditSettingPane {
+    // 显示字数统计
+    private UICheckBox showWordCount;
+
+    public MobileTextAreaSettingPane() {
+        super();
+        showWordCount = new UICheckBox(Toolkit.i18nText("Fine-Design_Mobile_Show_Word_Count"), false);
+        this.add(showWordCount, BorderLayout.NORTH);
+    }
+
+    @Override
+    public void populateBean(MobileTextEditAttr ob) {
+        super.populateBean(ob);
+        // 要兼容处理一下，为null 的话赋默认值，默认不开启
+        this.showWordCount.setSelected(ob.isShowWordCount() != null && ob.isShowWordCount());
+    }
+
+    @Override
+    public void updateBean(MobileTextEditAttr ob) {
+        super.updateBean(ob);
+        ob.setShowWordCount(showWordCount.isSelected());
+    }
+}

designer-form/src/main/java/com/fr/design/widget/ui/designer/mobile/component/MobileTextEditSettingPane.java

@@ -0,0 +1,59 @@
+package com.fr.design.widget.ui.designer.mobile.component;
+
+import com.fr.base.mobile.MobileTextEditAttr;
+import com.fr.design.beans.BasicBeanPane;
+import com.fr.design.gui.icheckbox.UICheckBox;
+import com.fr.design.i18n.Toolkit;
+import com.fr.design.layout.VerticalFlowLayout;
+
+import java.awt.BorderLayout;
+import java.awt.FlowLayout;
+
+/**
+ * 文本类基础设置
+ *
+ * @author Coral.Chen
+ * @since 11.0
+ * Created on 2023/3/29
+ */
+public class MobileTextEditSettingPane extends BasicBeanPane<MobileTextEditAttr> {
+    // 允许一键清空
+    protected UICheckBox allowOneClickClear;
+
+    public MobileTextEditSettingPane() {
+        initLayout();
+        allowOneClickClear = new UICheckBox(Toolkit.i18nText("Fine-Design_Mobile_Allow_One_Click_Clear"), getClearDefaultState());
+        this.add(allowOneClickClear, BorderLayout.NORTH);
+    }
+
+    protected boolean getClearDefaultState() {
+        return false;
+    }
+
+    protected void initLayout() {
+        VerticalFlowLayout verticalFlowLayout = new VerticalFlowLayout(FlowLayout.LEADING, 0, 5);
+        verticalFlowLayout.setAlignLeft(true);
+        this.setLayout(verticalFlowLayout);
+    }
+
+    @Override
+    public void populateBean(MobileTextEditAttr ob) {
+        allowOneClickClear.setSelected(ob.isAllowOneClickClear() != null && ob.isAllowOneClickClear());
+    }
+
+    @Override
+    public MobileTextEditAttr updateBean() {
+        // do nothing
+        return null;
+    }
+
+    @Override
+    public void updateBean(MobileTextEditAttr ob) {
+        ob.setAllowOneClickClear(allowOneClickClear.isSelected());
+    }
+
+    @Override
+    protected String title4PopupWindow() {
+        return null;
+    }
+}

designer-form/src/main/java/com/fr/design/widget/ui/designer/mobile/component/MobileTextFieldInputSettingPane.java

@@ -2,12 +2,17 @@ package com.fr.design.widget.ui.designer.mobile.component;
 
 import com.fr.base.mobile.MobileScanCodeAttr;
 import com.fr.design.beans.BasicBeanPane;
+import com.fr.design.constants.LayoutConstants;
 import com.fr.design.gui.icheckbox.UICheckBox;
+import com.fr.design.gui.ilable.UILabel;
 import com.fr.design.i18n.Toolkit;
 import com.fr.design.layout.FRGUIPaneFactory;
-import java.awt.BorderLayout;
+import com.fr.design.layout.TableLayout;
-import java.awt.FlowLayout;
+import com.fr.design.layout.TableLayoutHelper;
+
 import javax.swing.JPanel;
+import java.awt.BorderLayout;
+import java.awt.Component;
 
 /**
  * @author hades
@@ -22,13 +27,24 @@ public class MobileTextFieldInputSettingPane extends BasicBeanPane<MobileScanCod
 
     public MobileTextFieldInputSettingPane() {
         this.setLayout(FRGUIPaneFactory.createBorderLayout());
-        JPanel settingPane = FRGUIPaneFactory.createVerticalFlowLayout_Pane(true, FlowLayout.LEADING, 0, 5);
         manualInputCheckBox = new UICheckBox(Toolkit.i18nText("Fine-Design_Mobile_Manual_Input"), true);
         scanCodeCheckBox = new UICheckBox(Toolkit.i18nText("Fine-Design_Mobile_Scan_Code_Input"), true);
         nfcInputCheckBox = new UICheckBox(Toolkit.i18nText("Fine-Design_Mobile_NFC_Input"), false);
-        settingPane.add(manualInputCheckBox);
+        initComponents();
-        settingPane.add(scanCodeCheckBox);
+    }
-        settingPane.add(nfcInputCheckBox);
+
+    private void initComponents() {
+        Component[][] components = new Component[][]{
+                new Component[]{new UILabel(Toolkit.i18nText("Fine-Design_Mobile_Input_Way")), manualInputCheckBox},
+                new Component[]{null, scanCodeCheckBox},
+                new Component[]{null, nfcInputCheckBox}
+        };
+        double p = TableLayout.PREFERRED;
+        double f = TableLayout.FILL;
+        double[] rowSize = {p, p, p};
+        double[] columnSize = {p, f};
+        int[][] rowCount = {{1, 1}, {1, 1}, {1, 1}};
+        JPanel settingPane = TableLayoutHelper.createGapTableLayoutPane(components, rowSize, columnSize, rowCount, LayoutConstants.HGAP_LARGE, LayoutConstants.VGAP_LARGE);
         this.add(settingPane, BorderLayout.NORTH);
     }