SunnyUI/docs/started.md
2024-09-22 21:18:27 +08:00

3.4 KiB
Raw Blame History

快速开始


  • SunnyUI多页面框架由框架和页面构成。
    最基本的实现是框架IFrame由UIForm实现页面由UIPage实现。
    在UIForm放置一个UITabControl将多个UIPage放置于UIForm的UITabControl的TabPage内。
    通过PageIndex正整数唯一进行页面的关联和切换。
    听起来有点复杂其实主要就IFrame接口的三个函数AddPageExistPageSelectPage。

  • 最简单的Demo实现见窗体 - Frames - 自定义模板
    输入图片说明

  • 新建项目安装SunnyUI Nuget安装是Visual Studio引用控件包最方便快捷的方法。

    安装方法一通过PM命令安装 PM>Install-Package SunnyUI

    安装方法二通过Nuget包管理器搜索SunnyUI安装 输入图片说明

  • 新建框架:
    输入图片说明

    修改把Form修改成UIForm并且 using Sunny.UI;
    输入图片说明

    这时切换到窗体窗体已经变为UIForm
    输入图片说明

    下一步的操作非常重要:
    把窗体的AutoScaleMode从Font设置为None否则可能出现因为屏幕分辨率而导致的窗体变形。
    输入图片说明

    更改窗体名称为FCustomMain并在窗体上放一个UITabControl控件设置窗体的MainTabControl属性进行关联。
    输入图片说明

  • 新建页面:
    输入图片说明

    修改把Form修改成UIPage并且 using Sunny.UI;
    输入图片说明

    同样把页面的AutoScaleMode从Font设置为None否则可能出现因为屏幕分辨率而导致的窗体变形。 依次建立三个页面:
    FPage1其属性PageIndex为1001切记要设置PageIndex就靠这个做关联的正整数唯一
    输入图片说明

    FPage2其属性PageIndex为1002
    FPage3其属性PageIndex为1003

  • 框架页面关联 FCustomMain上放置三个UIButton命名为uiButton1uiButton2uiButton3按钮事件如下

private void uiButton1_Click(object sender, System.EventArgs e)
        {
            if (!ExistPage(1001))
            {
                AddPage(new FPage1());
            }

            SelectPage(1001);
        }

        private void uiButton2_Click(object sender, System.EventArgs e)
        {
            if (!ExistPage(1002))
            {
                AddPage(new FPage2());
            }

            SelectPage(1002);
        }

        private void uiButton3_Click(object sender, System.EventArgs e)
        {
            if (!ExistPage(1003))
            {
                AddPage(new FPage3());
            }

            SelectPage(1003);
        }

这样,一个多页面框架就实现了,点击三个按钮可以切换页面显示。

  • 其他示例
    可以参照:窗体 - Frames - 内置模板
    参考七种内置模板的示例以及SunnyUI.Demo.exe的FMain的示例。
    输入图片说明

    相对而言,内置模板方便,但只能按模板样式使用,而自定义模板的灵活性更高,参考代码示例。