好消息,MPF计划2017年11月份全部开源关注【QQ群:206378966】。

1.   MPF文件格式

        MPF主要包含三种类型的文件:

        Application文件、ResourceDictionary文件、布局描述文件。

1.1.  Application文件

        此文件描述应用程序的属性信息,其格式如下:

        <Application  StartupUri="">

                 <Application.Resources>

                </Application.Resources>

        </ Application>

        此文件必须以Application为根节点,此文件定义整个应用系统的公共资源,主窗口资源描述,Application里定义的资源在整个应用程序中优先级最低。

1.2.  ResourceDictionary文件

        MPF资源文件里分为实体资源和样式资源,事实上,样式资源里通常引用实体资源;而样式应用于具体的控件元素, 资源采用x:Key进行定义,而且必须唯一。

实体资源在MPF里是最小不可分割的资源单元,独立描述特定的资源类型,目前MPF包含如下资源:

1.2.1.      ImageBrush

        图像刷子,属性值如下:

        Source图像路径;

        ViewCorner四个边角,九宫格绘制四个边角将按照实际大小绘制。

        ViewBox图像实际绘制区域,分别为左、上、宽、高。

        Opacity图像绘制透明度,取值0至1。

        Stretch图像拉伸模式,Uniform:原始大小;UniformFill:原始大小填充;Fill:自动拉伸。

        <ImageBrush  x:Key="name "  Source=" image.png"  Stretch="Uniform"  ViewBox="0,0,17,17" />

1.2.2.      SolidColorBrush

        纯色刷子,格式如下:

        <SolidColorBrush  x:Key="name"Color="0xFFFFFF" >

1.2.3.      LinearGradientBrush

        线性渐变刷子,格式如下:

        <LinearGradientBrush  x:Key="name"  StartPoint="0.5,0"  EndPoint="0.5,1" >

                <GradientStop  Offset="0.0"  Color="#00FFFFFF" />

                <GradientStop  Offset="0.5"  Color="#FFFFFFFF" />

                <GradientStop  Offset="1.0"  Color="#00FFFFFF" />

        </LinearGradientBrush>

        StartPoint开始渐变点;

        EndPoint结束渐变点;

1.2.4.      RadialGradientBrush

        径向渐变刷子,格式如下:

        <RadialGradientBrush  x:Key="name "  GradientOrigin="0.5,0"  RadiusX="0.5"  RadiusY="0.5">

                <GradientStop  Offset="0.0"  Color="#00FFFFFF" />

                <GradientStop  Offset="0.5"  Color="#FFFFFFFF" />

                <GradientStop  Offset="1.0"  Color="#00FFFFFF" />

        </RadialGradientBrush>

1.2.5.      CursorBrush

        <Cursor  x:Key="split"Source="d:/split.cur" />

1.2.6.      ControlTemplate

        定义控件外观,后面会详细介绍;

1.2.7.      DataTemplate

        定义数据的呈现外观,后面会详细介绍;

1.2.8.      Bitmap

        图像资源,用于定义独立的图像,格式如下:

        <Bitmap  x:Key="Head"  Source="Images/login/1_100.gif" />

1.2.9.      String、Rect、Point、Integer、Float

        此类资源定义基本数据类型资源,格式如下:

        <String  x:Key="name"  Value="Sharpui" />

        <Rect  x:Key="name"  Value="0,0,1,1" />

        <Point  x:Key="name"  Value="2,2" />

        <Integer  x:Key="name"  Value="50" />

        <Floa  tx:Key="name"  Value="50.25" />

 

        数据类型资源包括系统和用户定义的数据类型,用户定义的数据类型资源前面需用local:作为前缀表明。

        资源可以单独放在独立的文件里,也可以放在界面元素的资源描述节里;两者的描述格式是完全一致的,资源是可以继承,就是说子元素可以继承父元素的资源,以此类推,Application作为所有界面元素的根而存在,因此其定义的资源在整个应用系统中优先级最低。

        一个标准的ResourceDictionary文件格式如下:

        <ResourceDictionary   Name="Window1"   Width="500"  Height="500" >

            <!–定义资源–>

            <ImageBrush  x:Key="Brush1"   Source="res/image.png" />

            <SolidColorBrush  x:Key="Brush2"   Color="Blue" />

 

            <!–定义样式–>

            <Style   TargetType="Button">

                <!–定义属性–>

                <Setter   Property="Background"  Value="Green" />

                <!–定义样式触发器–>

                <Style.Triggers>

                    <Trigger   Property="IsMouseOver"   Value="True">

                        <!–鼠标移到控件上时背景色变为蓝色–>

                        <Setter   Property="Background"  Value="Blue" />

                    </Trigger>

                    <Trigger   Property="IsPressed"  Value="True">

                        <!–鼠标按下控件背景色变为黄色–>

                        <Setter   Property="Background"   Value="Yellow" />

                    </Trigger>

                </Style.Triggers>

            </Style>

        </ResourceDictionary>

 

当然,这里的Trigger还支持多条件触发,这里后面会具体讲解。

具体资源的格式、属性下面做具体描述。

1.3.  布局文件

        此文件主要描述一个窗口的布局、布局引用的控件、控件的属性以及引用的资源等信息,界面引擎统一解析此文件,然后对窗口进行渲染,一个布局描述文件只能对应一个渲染窗口,其根节点被定义为Window(也可以是其它控件),格式描述如下:

        <Window   Name="Window1"  Width="500"  Height="500" >

            <!–定义窗口资源–>

            <Window.Resources>

            </Window.Resources>

            <!–窗口子控件–>

            <Button  Name="Button1">

                <!–子控件资源–>

                <Button.Resources>

                </Button.Resources>

            </Button>

        </Window>

 

        上面是一个标准的布局文件格式,布局文件包含资源描述和子控件描述。

 

1.4.  布局原理说明

        系统布局是MPF关键部分,所有元素的布局都是相对于其父界面元素进行计算的,一般界面元素分为垂直和水平方向上的布局,水平方向包括Left、Center、Right、Stretch四个属性;垂直方向包括Top、Center、Bottom、Stretch四个属性,系统对水平和垂直上的这四个属性进行默认实现。

        布局结合了元素的Width、Height和Margin以及Padding进行计算得到最终结果。

        除了Stretch属性外,其余属性都需要元素的Width和Height支持,就是说必须设置Width和Height值,否则元素将不可见。

        对于Left和Top,其布局原理如下:

        MPF企业版-文件格式【02】 【QQ群:206378966】-编程知识网

         

        对于Right和Bottom布局原理如下:

        MPF企业版-文件格式【02】 【QQ群:206378966】-编程知识网

        对于Center布局原理如下:

        MPF企业版-文件格式【02】 【QQ群:206378966】-编程知识网

        对于Stretch布局原理如下:

        MPF企业版-文件格式【02】 【QQ群:206378966】-编程知识网

        Stretch自动填充满父界面元素整个空间,然后四个边减掉Margin设定的值。

        对于元素大小的测量仅仅在元素准备载入时初始化一次,系统运行过程中,具体元素可以根据需要重新调用进行测量。