Avalonia是基于.NET的跨平台UI框架,能够支持在Windows、Linux、MacOS等操作系统中运行客户端。在官方的MAUI没有发布最新稳定版,对于客户端程序的跨平台开发仍然是不错的选择,尤其是已经有WPF基础的,能够很快上手。
0.开发环境
开发工具:VisualStudio 2019
处理架构:x86架构(AMD系列)
操作系统:Windows10,统信UOS家庭版
1.安装VS插件
打开VS“扩展>管理扩展”,搜索“Avalonia”,安装“Avalonia for Visual Studio 2019,2017”。
插件安装完成时,在创建新项目界面,可以看到Avalonia的模板,有常规模式应用和MVVM模式应用。有些WPF基础的可以选择MVVM模式应用。选择“Avalonia MVVM Application”。
3.代码项目结构如果VS刚刚更新过NET6,可能会提示错误,不能正常编译。将项目文件中的目标框架从NET6.0改为NET5.0。如果能够正常编译则忽略。
这是典型的MVVM模式结构,主要代码文件及目录用途如下:
Program.cs:系统入口
App.axaml:应用样式及初始化等
ViewLocator:View层与ViewModel层的映射
实现一个简单功能,从文件中读取气象数据,包括观测站点、时间、温度、湿度、降水量、气压、风速等,以列表形式进行展示。
原始数据是从国家气象数据中心下载的公开数据,用于做示例。由于只是简单示例,只考虑了txt文件的读取,没有Excel表格操作,也不涉及到数据库和ORM。
气象数据为txt文件,数据间以空格间隔。
另外还有一份观测站点的数据,与气象数据中的站点编号能够进行对应。
4.2界面布局观测站点的原始文件是PDF,导出成Excel后又导出成txt
Avaloina的axaml文件与WPF的xaml文件规则一致,切换起来没有什么困难。
DataGrid控件需要单独安装,默认的控件库中是没有的。打开NuGet管理器,搜索“Avalonia.Controls.DataGrid”进行安装
页面布局代码如下:
4.3数据对象
创建气象数据类
////// 原始气象数据模型 /// public partial class ClimateModel { ////// 区站号/观测平台标识 /// public string Station_Id_C { get; set; } ////// 站名 /// public string StationName { get; set; } ////// 年 /// public int Year { get; set; } ////// 月 /// public int Mon { get; set; } ////// 日 /// public int Day { get; set; } ////// 时次 /// public int Hour { get; set; } ////// 气压(百帕) /// public double PRS { get; set; } ////// 海平面气压(百帕) /// public double PRS_Sea { get; set; } ////// 最大风速(米/秒) /// public double WIN_S_Max { get; set; } ////// 温度(摄氏度) /// public double TEM { get; set; } ////// 相对湿度(%) /// public double RHU { get; set; } ////// 降水量(毫米) /// public double PRE_1h { get; set; } ////// 风力 /// public int windpower { get; set; } ////// 体感温度(摄氏度) /// public double tigan { get; set; } ////// 地理位置信息 /// public string GeoLocation { get; set; } }
增加了站点名称和地理位置信息两个字段
创建观测站点类
////// 原始站点数据模型 /// public partial class StationModel { ////// 省份 /// public string Province { get; set; } ////// 区站号/观测平台标识 /// public string Station_Id_C { get; set; } ////// 站名 /// public string StationName { get; set; } ////// 纬度(度分) /// public int LatitudeDF { get; set; } ////// 经度(度分) /// public int LongitudeDF { get; set; } ////// 气压传感器海拔高度(米) /// public double MonitorHeight { get; set; } ////// 观测场海拔高度(米) /// public double StationHeight { get; set; } ////// 地理位置信息 /// public string GeoLocation { get; set; } }
4.4视图绑定原始数据中的经纬度为度分秒格式,增加一个字段用来表示十进制的经纬度,同时与气象数据中的站点位置对应。
在MainWindowViewModel中创建属性对象和绑定命令
#region Data
//气象数据集合
private ObservableCollection _climateModels;
public ObservableCollection ClimateModels
{
get => _climateModels;
set => this.RaiseAndSetIfChanged(ref _climateModels, value);
}
//站点数据集合
private ObservableCollection _stationModels;
public ObservableCollection StationModels
{
get => _stationModels;
set => this.RaiseAndSetIfChanged(ref _stationModels, value);
}
//气象数据文件路径
private string _climateSourcePath ;
public string ClimateSourcePath
{
get => _climateSourcePath;
set => this.RaiseAndSetIfChanged(ref _climateSourcePath, value);
}
//站点数据文件路径
private string _stationSourcePath;
public string StationSourcePath
{
get => _stationSourcePath;
set => this.RaiseAndSetIfChanged(ref _stationSourcePath, value);
}
#endregion
#region Command
public ReactiveCommand SelectClimateFileCommand { get; }//选择气象数据文件
public ReactiveCommand GetClimateCommand { get; }//获取气象数据
public ReactiveCommand SelectStationFileCommand { get; }//选择站点数据文件
public ReactiveCommand GetStationCommand { get; }//获取站点数据
#endregion
4.5数据处理
在MainWindowViewModel中初始化数据并定义处理数据的函数。
public MainWindowViewModel()
{
_climateModels = new ObservableCollection();
_climateSourcePath = string.Empty;
SelectClimateFileCommand = ReactiveCommand.Create(SelectClimateFile);
GetClimateCommand = ReactiveCommand.Create(GetClimateData);
_stationModels = new ObservableCollection();
_stationSourcePath = string.Empty;
SelectStationFileCommand = ReactiveCommand.Create(SelectStationFile);
GetStationCommand = ReactiveCommand.Create(GetStationData);
}
//选择气象数据文件
private void SelectClimateFile()
{
var dialog = new OpenFileDialog
{
Title = "请选择文件"
};
var result= dialog.ShowAsync(Views.MainWindow.Instance);
if (result.Result != null)
{
_climateSourcePath = result.Result[0];
}
}
//获取气象数据
private void GetClimateData()
{
if (!string.IsNullOrEmpty(_climateSourcePath))
{
_climateModels.Clear();
using (StreamReader reader = new StreamReader(_climateSourcePath))
{
string line;
while ((line=reader.ReadLine())!=null)
{
string[] arrys = line.TrimEnd().Split();
ClimateModel item = new ClimateModel();
item.Station_Id_C = arrys[0];
item.Year = Int32.Parse(arrys[1]);
item.Mon = Int32.Parse(arrys[2]);
item.Day = Int32.Parse(arrys[3]);
item.Hour = Int32.Parse(arrys[4]);
item.PRS = Double.Parse(arrys[5]);
item.PRS_Sea = Double.Parse(arrys[6]);
item.WIN_S_Max = Double.Parse(arrys[7]);
item.TEM = Double.Parse(arrys[8]);
item.RHU = Double.Parse(arrys[9]);
item.PRE_1h = Double.Parse(arrys[10]);
item.windpower = Int32.Parse(arrys[11]);
item.tigan = Double.Parse(arrys[12]);
if (_stationModels.Any(t=>t.Station_Id_C==item.Station_Id_C))
{
var station = _stationModels.First(t => t.Station_Id_C == item.Station_Id_C);
item.StationName = station.StationName;
item.GeoLocation = station.GeoLocation;
}
_climateModels.Add(item);
}
}
}
else
{
var message = MessageBox.Avalonia.MessageBoxManager.GetMessageBoxStandardWindow("提示", "No File Selected");
message.Show();
}
}
//选择站点数据文件
private void SelectStationFile()
{
var dialog = new OpenFileDialog
{
Title = "请选择文件"
};
var result = dialog.ShowAsync(Views.MainWindow.Instance);
if (result.Result != null)
{
_stationSourcePath = result.Result[0];
}
}
//获取站点数据
private void GetStationData()
{
if (!string.IsNullOrEmpty(_stationSourcePath))
{
_stationModels.Clear();
using (StreamReader reader=new StreamReader(_stationSourcePath,Encoding.UTF8))
{
string line;
while ((line=reader.ReadLine())!=null)
{
string[] arrys = line.TrimEnd().Split();
StationModel item = new StationModel();
item.Province = arrys[0];
item.Station_Id_C = arrys[1];
item.StationName = arrys[2];
item.LatitudeDF = Int32.Parse(arrys[3]);
item.LongitudeDF = Int32.Parse(arrys[4]);
item.MonitorHeight = double.Parse(arrys[5]);
item.StationHeight = double.Parse(arrys[6]);
item.GeoLocation = ConvertGeoLocation(arrys[3], arrys[4]);
_stationModels.Add(item);
}
}
}
else
{
var message = MessageBox.Avalonia.MessageBoxManager.GetMessageBoxStandardWindow("提示", "No File Selected");
message.Show();
}
}
#region 经纬度转换
///
/// 经纬度转换-度分转换为数字
///
/// 纬度(度分)
/// 经度(度分)
///
private string ConvertGeoLocation(string latitude, string longitude)
{
string result = "";
string dgreeW = latitude.Substring(0, latitude.Length - 2);
string minW = latitude.Substring(latitude.Length - 2, 2);
double digtalW = double.Parse(dgreeW) + double.Parse(minW) / 60;
string dgreeJ = longitude.Substring(0, longitude.Length - 2);
string minJ = longitude.Substring(longitude.Length - 2, 2);
double digtalJ = double.Parse(dgreeJ) + double.Parse(minJ) / 60;
result = string.Format("{0},{1}", digtalW, digtalJ);
return result;
}
#endregion
4.6成果示例1.Avalonia默认是不包含的MessageBox的,需要单独安装,可以从Nuget中安装第三方库MessageBox.Avalonia
2.Avalonia自带了打开文件选择对话框OpenFileDialog和保存文件对话框SaveFileDialog等,但可能是使用Task任务调用的原因,与主UI线程不在一个线程内,选择文件后绑定文件路径的控件并没有更新,数据是确实已经改变了。
3.使用Avalonia自带的对话框时需要指定父窗体,如果参照App.axaml.cs中的方法通过应用生命周期ApplicationLifeTime获取当前窗体的示例,在Windows下可以正常弹出对话框,但在Linux环境下程序直接卡死。
坑坑不息,多学有益



