Avalonia 初学笔记(2):简单了解与WPF的区别
文章目录
- 相关链接
- 前言
- Avalonia相对于WPF的新特性简单介绍
- ChatGPT推荐
- Avalonia Demo案例
- Avalonia 开始使用
- Avalonia 文件扩展名
- Avalonia Toolkit 扩展安装
- 修改.net core版本
- Avalonia对WPF的修改
- 类CSS选择器
- Style的定义
- 简单代码
- 数据绑定
- 直接绑定
- UserControl.DataContext和Design.DataContext的区别
- 数据模板
- 数据源准备
- 实体类
- 数据源
- 普通模板
- 改成样式Styles
- 总结
相关链接
Avalonia UI 官网
Avalonia 官方文档
Avalonia学习笔记 ****博客专栏
前言
C# 上位机技术的终点有两个技术,Avalonia和Unity。Godot目前3D还是太拉了,MAUI目前也只是玩具。Avalonia是跨平台版本的WPF,而Unity是实现3D预览效果的选择。Avalonia算是上位机的终点了,我目前打算学习Avalonia+ReactiveUI
Avalonia相对于WPF的新特性简单介绍
B站_十月的寒流:Avalonia中的那些让WPF开发者相见恨晚的特性
ChatGPT推荐
因为Avalonia的中文资料实在是太少了,这里我们得用ChatGpt,而且最好是纯英文文档去学习。
免费的ChatGPT网址
比如我要搜一下【UserControl.DataContext and Design.DataContext 】在Avalonia里面使用的区别。为了顺便学一下英文,我这里也将使用纯英文的官方文档
Avalonia Demo案例
Avalonia.Samples Github仓库地址
下载好了要进行编译,文件挺多的,我本地编译了10分钟左右。
Avalonia 开始使用
Avalonia 开始使用
启动成功
Avalonia 文件扩展名
Avalonia Toolkit 扩展安装
修改.net core版本
当前日期2024年2月21日,现在新建的Avalonia的项目是.net core 7.0框架。我们将这个修改为.net core 8.0
Avalonia对WPF的修改
Avalonia Get Started
类CSS选择器
WPF 是没有CSS选择器的,但是Avalonia有。因为CSS有点吃性能而且容易出错样式混乱,但是CSS写起来是真的方便。
Avalonia Styling
我们这里简单介绍一下Avalonia的Style,因为Avalonia的Style是像前端的CSS选择器一样的语法,这里不展开说明
Style的定义
简单代码
<UserControl xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:vm="clr-namespace:AvaloniaReactiveUI_Demo.ViewModels"
mc:Ignorable="d"
d:DesignWidth="800"
d:DesignHeight="450"
x:Class="AvaloniaReactiveUI_Demo.Views.MainView"
x:DataType="vm:MainViewModel">
<UserControl.DataContext>
<vm:MainViewModel />
</UserControl.DataContext>
<UserControl.Styles>
<Style Selector="TextBlock.test" >
<Setter Property="Background"
Value="Red"/>
</Style>
</UserControl.Styles>
<StackPanel>
<TextBlock Text="{Binding Greeting}"
HorizontalAlignment="Center"
VerticalAlignment="Center"/>
<Button Content="Calculate"/>
<TextBlock Classes="test add" >Header</TextBlock>
<TextBlock >Header</TextBlock>
<Grid ShowGridLines="True">
</Grid>
</StackPanel>
</UserControl>
数据绑定
Avalonia的数据绑定和WPF的数据绑定差不多。首先和和默认的分层一致
直接绑定
UserControl.DataContext和Design.DataContext的区别
这里我就直接上ChatGPT了
额,没怎么看懂。好像差不多吧。到时候用的时候感受一下。我这里还是保持这个UserControl.DataContext好了
数据模板
官方的数据模板我没看明白,主要他的代码不全,没有把ViewModel写出来。
Avalonia Data Templates
数据源准备
实体类
public class Person
{
public int Id { get; set; }
public string? Name { get; set; }
public string? Title { get; set; }
public string? Description { get; set; }
}
数据源
public List<Person> People => new List<Person>() {
new Person()
{
Name = "小王",
Id = 1,
Description="王哥",
Title = "大王"
},
new Person()
{
Name = "小美",
Id = 2,
Description = "美美的",
Title = "美姐"
},
new Person()
{
Name = "大帅",
Id = 3,
Description = "帅帅",
Title = "大帅逼"
}
};
普通模板
这个是最标准的数据源绑定
<ListBox ItemsSource="{Binding People}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Id:" />
<TextBlock Text="{Binding Id}" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Name:" />
<TextBlock Text="{Binding Name}" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Description:" />
<TextBlock Text="{Binding Description}" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Title:" />
<TextBlock Text="{Binding Title}" />
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
改成样式Styles
<UserControl.Styles>
<Style Selector="ListBox.Test">
<Setter Property="ItemTemplate" >
<Setter.Value>
<DataTemplate>
<StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Id:" />
<TextBlock Text="{Binding Id}" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Name:" />
<TextBlock Text="{Binding Name}" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Description:" />
<TextBlock Text="{Binding Description}" />
</StackPanel>
<StackPanel Orientation="Horizontal">
<TextBlock Text="Title:" />
<TextBlock Text="{Binding Title}" />
</StackPanel>
</StackPanel>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
</UserControl.Styles>
<ListBox ItemsSource="{Binding People}" Classes="Test">
</ListBox>
但是我看官方案例的方法不是这样的,是这么写的。我目前也不是很了解
总结
Avalonia对WPF最大的两个问题进行了解决,Style的CSS写法和Binding的方法。WPF的Style是纯样式继承的方法。两个各有利弊。而且Avalonia的代码提示还是比较弱的,微软啥时候能把Avalonia给收购了啊。
推荐阅读
-
Avalonia 初学笔记(2):简单了解与WPF的区别
-
三分钟带你了解手机内部硬件-主要影响手机性能的有以下几点 CPU - *处理器(手机中的大脑) CPU 是计算思考以及处理事物的。 比如:我们日常玩手机,什么最重要?毫无疑问是手机打开软件很流畅,使用各种功能不卡。 这就是CPU的性能,那什么影响 CPU 的因素有哪些? 架构 架构是 CPU 的基础,对于处理器的整体性能起到了决定性的作用,不同架构的处理器同主频下,性能差距可以达到2-5倍。可见架构的重要性。 那么什么是架构呢? 打个比方,架构就是一栋楼的框架。至于最终楼什么样子,就由处理器的厂商决定了,但是有一点,如果说这栋楼房的结构设计出来容纳多少人,那么最后建好的房子也要在这个范围内。同理,如果使用相同架构的处理器,那么本质上不会有太大的区别。 看一下主流手机的架构 处理器对比.jpg 从上图可见:高通 和 苹果都是自主设计,所以说它们牛还是有一定的道理的。不同的架构, 性能和功耗也是不同的。架构决定了 主频、核心数、带宽等和运算量直接相关的东西。目前很多手机打广告都是说 多少核的机器。但是并不是说核越多性能就越强,你没看见,苹果双核就能吊打高通和联发科吗? 制程 制程 专指:事物运作程序的处理过程。常指手机芯片框架的运算速度量。 简单的说就是电路板中电路与电路之间的距离,目前已经发展到纳米级别。 制程越小,可以向芯片中塞入更多的晶体管,随之而来的好处还有:降低电量和成本、散热。 制程数的确定 这里有人要问,为什么制程的数字是这些,而不是别的数字,比如有28nm,为什么没有29nm? 这其实是有一定规律的。根据早期国际半导体蓝图规划,由五个在相关领域较为发达的国家共同制定,约定下一代制程要在上一代基础上做到晶体管数量不变,芯片面积缩小一半。由这一关系可以算出前一代制程要比后一代大√2倍,所以能算出后一代大概数值。纵观整个处理器制程变化,除了少部分特殊的外,都遵循着这一规则。 近代制程的发展 2014 年底,三星宣布了世界首个 14nm FinFET 3D 晶体管进入量产,标志着半导体晶体管进入 3D 时代。发展到今天,三星拥有了四代 14nm 工艺,第一代是苹果 A9 上面的 FinFET LPE(Low Power Early),第二代则是用在猎户座 骁龙 820 和骁龙 625 上面的 FinFET LPP(Low Power Plus)。第三代是 FinFET LPC,第四代则是目前的 FinFET LPU。至于 10nm 工艺,三星则更新到了第三代(LPE/LPP/LPC)。 目前为止,三星已经将 70000 多颗第一代 LPE(低功耗早期)硅晶片交付给客户。三星自家的猎户座 8895,以及高通的骁龙 835,都采用这种工艺制造,而 10nm 第二代 LPP 版和第三代 LPU 版将分别在年底和明年进入批量生产。 手机芯片市场上已经进入了 10nm、7nm 处理器的白热化竞争阶段,而 14/16nm 制程的争夺也不过是一两年前的事。 总线位宽 总线位宽决定输入/输出设备之间一次数据传输的信息量,用位(bit)表示,如总线宽度为8位、16位、32位和64位。