一、XAML(MAUI的XAML)和HTML

  1. 两者相似,都是标签语言(也叫标记)组成的树形文档。每个标签元素,可视为一个对象,通过“键=值”形式的标签属性(Attribute),为对象的属性(Property)、事件等成员赋值。注,此处特别将Attribute和Proterty区别开来,两者虽都叫属性,但Attribute属于标签,Property属于对象,一部分Attribute与Proterty一一对应,但另一部分Attribute可能对应着对象的事件、命令等。
  2. 区别①,HTML的标签语言通过浏览器渲染为UI控件,而XAML先要通过编译器转为中间代码,并与后台C#代码合并,然后通过MAUI映射为Native对象,再由本机渲染为UI控件。ps:如果MAUI编译为安卓平台,Native对象就指安卓平台的原生对象,本机就指安桌平台。
  3. 区别②,XAML有后台的cs文件,除了使用XAML标签,还可以通过等效C#代码来创建对象,可以看到文档对象的本质。
  4. PS:元素是语言层面的概念,控件是UI层面的概念,大多数时候,可以认为是在指代同一个东西。以下案例中出现的元素/控件分别为:Button-按钮,Lable-单行或多行文本,StackLayout-水平或垂直排列布局,Grid-行列布局,ContentPage-内容页面

二、XAML的元素和属性

三、属性的赋值方式

1、字符串赋值:值类型属性可以直接通过字符串赋值。部分复杂类型,也能通过内置转换器,将字符串自动转换为对象类型

2、元素属性:属性为复杂的对象类型时,可以通过元素属性的方式赋值(也叫属性元素),即以元素的形式来表达属性

3、扩展标记:通过扩展标记(大括号),属性的值可以引用其它源的值或对象。其中数据绑定Binding是扩展标记之一。

四、内容属性和子元素

1、ContentPage属于页面类控件,其内容属性为Content,只能有一个子元素,所以一般页面类控件的子元素使用布局类控件。

2、StackLayout属于布局类控件,其内容属性为Children,是一个集合类型,可以放置多个子元素。

 五、附加属性

1、上例中属性Grid.Row和Grid.Column,在Label元素上使用,但它们属于Grid。

2、在等效的c#代码中,设置子元素所在行列,表现为调用Grid的两个静态方法,参数为子元素和行列

3、附加属性属于可绑定属性,将在后续章节中深入学习其实现原理。

六、根元素和多页面

1、MAUI是传统的多页面应用,区别于目前流行的单页面应用(如React、Vue等),页面的组织、导航、状态管理等,都更加直白简单。

2、每个页面,都必须要有一个根元素,代表当前页面的类型,目前有ContentPage、FlyoutPage、NavigationPage、TabbedPage等几种页面类型。

3、每个页面,在C#层面,本质是由开发者定义的类,由xaml定义的部分类和后台代码定义的部分类组成。根元素指定了这个类的父类类型,x:Class指定了这个类的名称。

4、属性xmlns和xmlns:x,引用命名空间,相当于using。属性值像一个网址,但和网址没有关系,可以认为是多个命名空间的集合。每个页面可以有一个默认的xmlns,这个命名空间下的类型可以直接引用,如上例中的xmlns属性,引用了maui的所有控件类型,所以可以直接使用控件,而不需要前缀。而xmlns:x,引用了xaml命名空间,使用了别命x,使用时需要加前缀x:使用,如x:Class。

5、上例中的两个命名空间默认引入,其中xmlns:x称之为x命名空间,这个命名空间比较特殊,与XAML编译器相关,规定了编译器在将XAML标签语言编译为C#中间语言时的一些特定行为。比如上例中的x:Class,就指示编译器在编译这个类时,编译为类名为MainPage的部分类。(MauiApp6.MainPage为类的全路径名称)。

七、事件和命令

1、事件和命令,均提供了用户与UI的交互功能。

2、事件为传统的事件响应机制,响应事件的方法,写在当前页面的后台代码文件中。如当前面页为MainPage.xmal,后台文件为MainPage.xaml.cs。

3、命令属于MVVM模式,我们使用MVVM开发模式后,基本就很少在后台文件中写代码,后续详述。

MAUI新生-XAML语法基础:语法入门Element&Property&Event&Command的更多相关文章

  1. Lua脚本之语法基础快速入门

    要 1.基本数据类型 2.Lua中的常用语句结构以及函数 3.Lua中的常用语句结构介绍 4.Lua中的库函数 目录[-] 一.基本数据类型 二.Lua中的常用语句结构以及函数 1.Lua中的常用语句 ...

  2. jQuery安装和基础语法

    1.安装 从 jquery.com 下载 jQuery 库 <script src="jquery-1.10.2.min.js"></script> 从 C ...

  3. js进阶 10-2 JQuery基础语法是什么

    js进阶 10-2 JQuery基础语法是什么 一.总结 一句话总结: 1.jquery语法超级简单:基础语法是:$(selector).action() 2.jquery选择的时候是带了引号的,肯定 ...

  4. Python入门篇-基础语法

    Python入门篇-基础语法 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.编程基础 1>.程序 一组能让计算机识别和执行的指令. 程序 >.算法+ 数据结构= 程 ...

  5. Objective-C基础语法快速入门

    Objective-C基础语法快速入门 2010-11-04 16:32 折酷吧 zheku8 字号:T | T 假如我们对面向对象的思维已经C语言都很熟悉的话,对于我们学习Objective-C将会 ...

  6. Swift语法基础入门三(函数, 闭包)

    Swift语法基础入门三(函数, 闭包) 函数: 函数是用来完成特定任务的独立的代码块.你给一个函数起一个合适的名字,用来标识函数做什么,并且当函数需要执行的时候,这个名字会被用于“调用”函数 格式: ...

  7. Swift语法基础入门四(构造函数, 懒加载)

    Swift语法基础入门四(构造函数, 懒加载) 存储属性 具备存储功能, 和OC中普通属性一样 // Swfit要求我们在创建对象时必须给所有的属性初始化 // 如果没办法保证在构造方法中初始化属性, ...

  8. Swift语法基础入门二(数组, 字典, 字符串)

    Swift语法基础入门二(数组, 字典, 字符串) 数组(有序数据的集) *格式 : [] / Int / Array() let 不可变数组 var 可变数组 注意: 不需要改变集合的时候创建不可变 ...

  9. Java基础语法入门01

    Java基础语法入门01 学习java你要先进行去了解JDK,JRE,JVM JDK Java开发工具包 JRE Java语言开发的运行环境 JVM Java虚拟机,用于Java语言的跨平台所用. 当 ...

随机推荐

  1. 「题解报告」P7301 【[USACO21JAN] Spaced Out S】

    原题传送门 神奇的5分算法:直接输出样例. 20分算法 直接把每个点是否有牛的状态DFS一遍同时判断是否合法,时间复杂度约为\(O(2^{n^2})\)(因为有判断合法的剪枝所以会比这个低).而在前四 ...

  2. 从0到1写一款自动为Markdown标题添加序号的Jetbrains插件

    1. markdown-index 最近做了一个Jetbrains的插件,叫markdown-index,它的作用是为Markdown文档的标题自动添加序号,效果如下: 目前已经可以在Jetbrain ...

  3. 简单创建一个SpringCloud2021.0.3项目(四)

    目录 1. 项目说明 1. 版本 2. 用到组件 3. 功能 2. 上三篇教程 3. 日志处理 1. 创建日志公共模块 2. Eureka引入日志模块 4. 到此的功能代码 5. 注册中心换成naco ...

  4. Tablesaw——Java统计、机器学习库

    资源 java二维数组处理可可视化库 https://github.com/jtablesaw/tablesaw plotly JS库的Java封装 https://github.com/jtable ...

  5. 第八篇:用css写一个登录界面

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  6. SpringMVC前置复习以及扩展

    SpringMVC ssm:mybatis+Spring+SpringMVC javaSE javaweb 框架 理解的DAO层和Service层 先简单来讲下Dao层,和Service层的概念: S ...

  7. KingbaseES 时间类型数据和oracle时间类型的区别

    Oracle日期时间类型有两类,一类是日期时间类型,包括Date, Timestamp with time zone, Timestamp with local time zone.另一类是Inter ...

  8. K8S_CNI

    CNI 插件 定义: Container Network Interface 容器通用接口 K8S 中可选的 CNI 插件如下: Flannel 较流行 Calico 性能棒,比Flannel快1% ...

  9. Spark 写 Hbase

    package com.grady import org.apache.hadoop.hbase.HBaseConfiguration import org.apache.hadoop.hbase.c ...

  10. ELK套件部署

    前言 经过两周的不断碰壁,版本的选择 最终选择ELK的7.6.1套餐 因为我所需要的的警报插件sentinl也才跟新到7.6.1 运行环境:centos7 需要开放的端口:5601,9200,514( ...