MAUI新生-XAML语法基础:语法入门Element&Property&Event&Command
一、XAML(MAUI的XAML)和HTML
- 两者相似,都是标签语言(也叫标记)组成的树形文档。每个标签元素,可视为一个对象,通过“键=值”形式的标签属性(Attribute),为对象的属性(Property)、事件等成员赋值。注,此处特别将Attribute和Proterty区别开来,两者虽都叫属性,但Attribute属于标签,Property属于对象,一部分Attribute与Proterty一一对应,但另一部分Attribute可能对应着对象的事件、命令等。
- 区别①,HTML的标签语言通过浏览器渲染为UI控件,而XAML先要通过编译器转为中间代码,并与后台C#代码合并,然后通过MAUI映射为Native对象,再由本机渲染为UI控件。ps:如果MAUI编译为安卓平台,Native对象就指安卓平台的原生对象,本机就指安桌平台。
- 区别②,XAML有后台的cs文件,除了使用XAML标签,还可以通过等效C#代码来创建对象,可以看到文档对象的本质。
- 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的更多相关文章
- Lua脚本之语法基础快速入门
要 1.基本数据类型 2.Lua中的常用语句结构以及函数 3.Lua中的常用语句结构介绍 4.Lua中的库函数 目录[-] 一.基本数据类型 二.Lua中的常用语句结构以及函数 1.Lua中的常用语句 ...
- jQuery安装和基础语法
1.安装 从 jquery.com 下载 jQuery 库 <script src="jquery-1.10.2.min.js"></script> 从 C ...
- js进阶 10-2 JQuery基础语法是什么
js进阶 10-2 JQuery基础语法是什么 一.总结 一句话总结: 1.jquery语法超级简单:基础语法是:$(selector).action() 2.jquery选择的时候是带了引号的,肯定 ...
- Python入门篇-基础语法
Python入门篇-基础语法 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.编程基础 1>.程序 一组能让计算机识别和执行的指令. 程序 >.算法+ 数据结构= 程 ...
- Objective-C基础语法快速入门
Objective-C基础语法快速入门 2010-11-04 16:32 折酷吧 zheku8 字号:T | T 假如我们对面向对象的思维已经C语言都很熟悉的话,对于我们学习Objective-C将会 ...
- Swift语法基础入门三(函数, 闭包)
Swift语法基础入门三(函数, 闭包) 函数: 函数是用来完成特定任务的独立的代码块.你给一个函数起一个合适的名字,用来标识函数做什么,并且当函数需要执行的时候,这个名字会被用于“调用”函数 格式: ...
- Swift语法基础入门四(构造函数, 懒加载)
Swift语法基础入门四(构造函数, 懒加载) 存储属性 具备存储功能, 和OC中普通属性一样 // Swfit要求我们在创建对象时必须给所有的属性初始化 // 如果没办法保证在构造方法中初始化属性, ...
- Swift语法基础入门二(数组, 字典, 字符串)
Swift语法基础入门二(数组, 字典, 字符串) 数组(有序数据的集) *格式 : [] / Int / Array() let 不可变数组 var 可变数组 注意: 不需要改变集合的时候创建不可变 ...
- Java基础语法入门01
Java基础语法入门01 学习java你要先进行去了解JDK,JRE,JVM JDK Java开发工具包 JRE Java语言开发的运行环境 JVM Java虚拟机,用于Java语言的跨平台所用. 当 ...
随机推荐
- vue2和vue3的区别?
vue2和vue3的主要区别在于以下几点: 1.生命周期函数钩子不同 2.数据双向绑定原理不同 3.定义变量和方法不同 4.指令和插槽的使用不同 5.API类型不同 6.是否支持碎片 7.父子组件之间 ...
- API设计中性能提升的10种解决方法
api的设计涉及到的方面很多, 分类是一个基本的思考方式.如果可以形成一个系列性的文字,那就从性能开始吧. 就像任何性能一样,API 性能主要取决于如何响应不同类型的请求.例如:典型的电商场景,显示用 ...
- vue中处理过内存泄露处理方法
1>意外的全局变量函数中意外的定义了全局变量,每次执行该函数都会生成该变量,且不会随着函数执行结束而释放. 2>未清除的定时器定时器没有清除,它内部引用的变量,不会被释放. 3>脱离 ...
- KingbaseES 客户端工具安装
关键字: KingbaseES.Java.ClientTools 一.安装前准备 1.1 软件环境要求 金仓数据库管理系统KingbaseES V8.0支持微软Windows 7.Windows XP ...
- Kubernetes 监控--Grafana
前面我们使用 Prometheus 采集了 Kubernetes 集群中的一些监控数据指标,我们也尝试使用 promQL 语句查询出了一些数据,并且在 Prometheus 的 Dashboard 中 ...
- Elasticsearch:如何把Elasticsearch中的数据导出为CSV格式的文件
本教程向您展示如何将数据从Elasticsearch导出到CSV文件. 想象一下,您想要在Excel中打开一些Elasticsearch中的数据,并根据这些数据创建数据透视表. 这只是一个用例,其中将 ...
- Rook Toolbox
官方文档:https://rook.io/docs/rook/v1.8/ceph-toolbox.html Rook工具箱是一个包含用于Rook调试和测试的常用工具的容器.工具箱基于CentOS,因此 ...
- 通过Thread Pool Executor类解析线程池执行任务的核心流程
摘要:ThreadPoolExecutor是Java线程池中最核心的类之一,它能够保证线程池按照正常的业务逻辑执行任务,并通过原子方式更新线程池每个阶段的状态. 本文分享自华为云社区<[高并发] ...
- 【nginx】使用 nginx 时,使用 sub_filter 注入 js 代码,例如 google analysis 等
目录 1. 创建 GA 1 2. 注入代码2 结果 网站 F12 GA 控制台 Reference 在一项工作中,已经将内网的一个网站通过 二级域名 + nginx + frp 的方式映射到公网.网站 ...
- 🔥支持 Java 19 的轻量级应用开发框架,Solon v1.10.4 发布
Java 轻量级应用开发框架.可用来快速开发 Java 应用项目,主框架仅 0.1 MB. 相对于 Spring Boot 和 Spring Cloud 的项目: 启动快 5 - 10 倍. (更快) ...