正文 

当前位置： 首页 > 程序 > java教程

"xaml+cs"桌面客户端跨平台初体验(代码片段)

big-head big-head     2023-04-06     759

关键词：

"Xaml+C#"桌面客户端跨平台初体验

前言

??随着 .Net 5的到来，微软在 .Net 跨平台路上又开始了一个更高的起点。回顾.Net Core近几年的成果，可谓是让.Net重生了一次.

??Asp .Net Core跨平台解决了Windows服务器昂贵的费用和不能长时间待机的问题，让Asp程序能够跑在Linux甚至Mac上。从博客园里.Net分类可以看到，每天都可以涌现大批Asp .Net Core的技术文章，越来越多的开发者或者公司开始尝试这个船新的跨平台框架。
技术图片

??然鹅，Asp的跨平台是能够使用html作为UI，C#作为后台代码完成的，html本来就是原生支持跨平台的语言。如果要到达在客户端方面的跨平台，仍需要走很长一段路。

??早些年的时候。微软使用钞能力收购了移动客户端跨平台开发的大佬Mono，并组建了新的Xamarin，一次开发就可以生成Android，iOS，UWP平台的App，但也仅仅停留在移动客户端跨平台。同样在民间一些大佬的努力下，也创造出了很多PC跨平台的轮子，比如：Electron.Net,GTK#,Qt#等等，这些框架都是使用Html或者Mono平台的内容达到UI跨平台的，而今天我则要推荐一款新的跨平台方案AvaloniaUI。

技术图片

准备

  • 一个Linux的机器
    ??这里推荐使用windows 10下的linux子系统，可以快速的在windows上操作linux子系统的文件目录，用来快速上传编译的程序到linux。详细操作可以看这篇文章启用Windows10的Linux子系统并安装图形界面。
    ??当然使用实体机，或者服务器都可以。总之最终目的就是有一个可以连接带图形化界面的Linux系统。

  • 安装.Net Core Runtime
    ??微软官方给出了在Ubutnu安装.Net Core的方法，这里我以Ubuntu为例,其他发行版本使用对应的包管理命令

1.注册 Microsoft 密钥和源

wget https://packages.microsoft.com/config/ubuntu/19.04/packages-microsoft-prod.deb -O packages-microsoft-prod.deb
sudo dpkg -i packages-microsoft-prod.deb

2.安装.Net Core 3.1 Runtmime

sudo apt-get update
sudo apt-get install apt-transport-https
sudo apt-get update
sudo apt-get install dotnet-runtime-3.1

????更多详情可参考Microsoft Docs ：Ubuntu 19.04 包管理器 - 安装 .NET Core。

  • 安装VS拓展
    技术图片
    如果VS拓展下载太慢，可以使用下面的网盘链接下载。

链接: https://pan.baidu.com/s/1sYnpC37IcH2VKQKjmqBALw 提取码: wyqn

  • WPF/UWP的经验
  1. Xaml的语法
  2. C#
  3. 最好了解MVVM模式或者ReactiveUI

Code

  • 创建一个AvaloniaUI的项目
    技术图片

了解WPF/UWP通知模式的童鞋可以使用MVVM

  • 项目结构
    技术图片

和WPF/UWP很相似的结构，但是不同的是Program.cs被重写了

class Program 
        // Initialization code. Don‘t use any Avalonia, third-party APIs or any
        // SynchronizationContext-reliant code before AppMain is called: things aren‘t initialized
        // yet and stuff might break.
        public static void Main(string[] args) => BuildAvaloniaApp()
            .StartWithClassicDesktopLifetime(args);

        // Avalonia configuration, don‘t remove; also used by visual designer.
        public static AppBuilder BuildAvaloniaApp()
            => AppBuilder.Configure<App>()
                .UsePlatformDetect()
                .LogToDebug()
                .UseReactiveUI();
  • MainWindow.Xaml
    技术图片

可以说和WPF/Xaml大致一模一样了，但是体验不太好地就是在Xaml标签页的智能提示和显示内容体验，以及右侧的实时渲染窗口是一帧一帧地刷新整个页面。

  • ViewModel
    技术图片

Avalonia UI使用地是ReactiveUI来做的界面绑定和响应。和以往使用MVVMLight不同，绑定命令不用RelayCommand，而是直接在xaml绑定一个后台的方法名。

技术图片
技术图片

  • 发布
    编码完成在windows上测试通过之后，就可以把程序打包发到其他平台上测试了。这里以Linux为例：
    Alt+B-->选择发布
    技术图片
    技术图片

根据目标平台选择配置保存。
点击发布，稍等片刻。。。。。。

  • 跨平台运行
    以linux为例：
  1. 将Publish的文件夹上传到Linux上
  2. 找到对应的程序名（没有任何后缀），更改权限为”允许此文件作为程序运行“
    技术图片
  3. 双击运行，即可看到和Windows上一模一样的效果。

问题

由于AvaloniaUI不是微软官方出品，而是民间团队开发，且目前仍处于预览。我罗列一些自己遇到问题时的解决方案

1.尝试Nuget把AvaloniaUI的包更新到最新
2.保证开发的.netcore配置比运行环境的.net core版本低
技术图片

技术图片

3.*字体渲染问题
这个问题是我遇到的最严重的问题，直接导致程序都不能渲染出来。如果有遇到这个问题的同学，可以首先在Program.cs下的Main函数里面加两行代码：

Console.WriteLine(SKTypeface.Default.FamilyName);
Console.WriteLine(SKTypeface.FromFamilyName("Sans").FamilyName);

然后在linux里使用控制台来运行程序，定位到程序目录，更改程序权限为可执行程序

chmod -x 程序名

运行程序

./程序名

如果出现权限不足的可以使用如下

chmod 777 程序名

如果运行程序后，控制台打印了NullRefrence的错误，那就是缺少默认字体。估计是AvaloniaUI的团队设置了程序的默认字体”Sans“。

只需要替换软件默认字体就可以了，这里我使用微软雅黑

<Application
    x:Class="AvaloniaTest.App"
    xmlns="https://github.com/avaloniaui"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:AvaloniaTest">
    <Application.DataTemplates>
        <local:ViewLocator />
    </Application.DataTemplates>
    <Application.Resources>
        <FontFamily x:Key="yh">微软雅黑</FontFamily>
    </Application.Resources>
    <Application.Styles>
        <StyleInclude Source="avares://Avalonia.Themes.Default/DefaultTheme.xaml" />
        <StyleInclude Source="avares://Avalonia.Themes.Default/Accents/BaseLight.xaml" />
        <Style Selector="Window">
            <Setter Property="FontFamily" Value="StaticResource yh" />
        </Style>
    </Application.Styles>
</Application>

并且需要在linux安装微软雅黑的字体

sudo apt-get install ttf-mscorefonts-installer

博客园之前也有一位大佬体验AvaloniaUI时候遇到字体的问题，可是他的树莓派是可以渲染出窗体只是没有文字，但是我测试了好几个发行版本都是窗体都不渲染。大家可以参考一下他的文章树莓派 Raspberry Pi 4，.net core 3.0 ,Avalonia UI 开发

运行效果

  • 我尝试使用Face++的 API接口，测试写了一个有网络请求的抠图程序

Windows:
技术图片
技术图片
技术图片

Linux:
技术图片
技术图片
技术图片

其他

贴出一些参考网站给大家

【文章为大头BigHead原创，转载请注明出处】

xaml与代码隐藏文件之间的关系

...MainWindow的类。在MainWindow.xaml代码中：<Window x:Class="MyApp.MainWindow"        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"        xmlns:x="http://schemas... 查看详情

c#wpf相对路径问题

using(ExcelHelperexcelHelper=newExcelHelper(@"D:\studentcourse.xls"))一开始我把studentcourse.xls放在d盘读取现在我把它放在文件名为abc的文件夹内，怎么把地址改为相对地址参考技术Axaml调用cs一般是在cs里面定义属性，然后xaml的属性绑... 查看详情

小白求教，wpf中如何让xaml控件在其他.cs文件中使用

具体的说就是我在xaml中定义了<GridName="ABC"></Grid>,但是我不在其对应的.xmal.cs中使用ABC，而是想在同一工程的其他.cs文件中使用ABC，但是直接用ABC.Height之类的不行，ABC用不起来，求教各位大神有什么方法吗？是不... 查看详情

cs地图制作问题

...pyFile**Parameters:"C:\DocumentsandSettings\Administrator\桌面\新建文件夹\dff.map""C:\DocumentsandSettings\Administrator\桌面\valvehammereditor3.6中国高级版\tools\dff.map"**Executing...**Command:C:\DOCUME~1\ADMINI~... 查看详情

wpf中.xaml文件如何读取资源文件？

...Resources.resx中的字符串参考技术A增加命名空间：xmlns:resx="clr-namespace:你的Resources.Designer.cs打开以后的命名空间"使用例子Title="x:Staticresx:Resources.你资源名字"注意：Resources.resx的访问修饰符必须是public 查看详情

silverlight与aspx直接交互

...erlight的方法大概就是属于传值silverlight里面一个textx:name="sltb"cs:stringabc="abc";把abc赋值给sl里面的x:name="sltb"初看，认为你是想用sessioncookies这样的传值，但看了问题补充，感觉就是简单的页面控制，不是传值... 查看详情

wpf如何更改xaml代码里listbox的数据绑定

...urce绑定到了一个Access数据库的表上，像这样<ListBoxName="lb1"Width="160"ItemsSource="BindingPath=myClientTable"DisplayMemberPath="Client_Name"/>现在我想在后台的C#代码里修改绑定，可以做到吗？怎么弄？谢谢1:新建... 查看详情

有没有会oauth客户端认证的，一直返回401错误，帮忙看下，基类用的是oauthbase.cs

返回401错误。只有这么多分了，全给了。privatestringDoRequest1212()stringid="UB7XDF";//Request.Form["Id"].ToString();stringcode="U2D2N1G621";//Request.Form["Code"].ToString();stringip=Request.ServerVariables["REMOTE_ADDR"].ToString();/... 查看详情

header设置跨域问题

...-With");//  允许携带用户认证凭据（也就是允许客户端发送的请求携带Cookie）     header("Access-Control-Allow-Credentials:true");写到方法内部 查看详情

数据绑定xaml

<ListViewName="m_entryList"SelectionMode="Single"><ListView.View><GridView><GridViewColumnHeader="#"Width="50"DisplayMemberBinding="BindingPath=SerialNo"></GridViewColumn><GridViewColumnHeader="Date"Width=&q... 查看详情

怎样把c#程序的源文件，转换成。cs文件！！

...制到左边的"用户的'程序'菜单"和"用户桌面"中.这样安装程序安装安装完成后会在"开始->所有程序"和"桌面"上生成程序的快捷方式.然后右击左边的"应用程序文件夹"打开属性对话框:将... 查看详情

jqueryajax怎样跨域获取json数据

...withpadding的缩写。它允许在服务器端生成scripttags至返回至客户端，也就是动态生成javascript标签，通过javascriptcallback的形式实现数据读取。html页面端示例代码：复制代码代码如下://首先要引入jquery的js包jQuery(document).ready(function()$.... 查看详情

后端配置跨域

...实现跨域(CORS)判定的原理，这里不多赘述。1、主要就是客户端向发送了服务端请求，服务器已经能返回数据，但是浏览器不接收2、在接口里面加上：(因为request是处理请求，response是返回结果)response.setHeader("Access-Control-Allow-O... 查看详情

隐藏vmware用户虚拟桌面中"安全删除硬件"图标

...全删除硬件"图标可以用下面两种方法：1、使用vSphere客户端连接ESX主机或者vCenter.   关闭要更改的虚拟机.                      鼠标右... 查看详情

xaml 啥是“本地：”？

】xaml啥是“本地：”？【英文标题】：xamlwhatis"local:"?xaml什么是“本地：”？【发布时间】：2011-07-2023:26:33【问题描述】：什么是本地：在XAML中，C#类中哪些参数可以调用local:？在我正在查看的一些代码中，我看到了xmlns... 查看详情

wpfc#实现鼠标穿透窗体

...点击窗体时，可以响应窗体后面的应用程序。也就是整个桌面被这个WPF应用程序覆盖，这个应用程序是透明的，最顶层的。当在这个应用程序上点击鼠标的时候，把这个鼠标事件传递给下面一层的应用程序。参考技术A如果要作... 查看详情

前端之http(代码片段)

...代码) 不直接跟用户打交道"""软件开发架构cs客户端服务端bs浏览器服务端ps:bs本质也是cs浏览器窗口输入网址回车发生了几件事"""1浏览器朝服务端发送请求2服 查看详情

springmvc用@crossorigin解决跨域ajax怎么写

...，对方希望提供一个api让其能够更新数据。由于该同学是客户端开发，于是有了类似以下代码。2.@RequestMapping(method=RequestMethod.POST,value="/update.json",produces=MediaType.APPLICATION_JSON_VALUE).3.public@ResponseBodyContacterupdate(@RequestBodyContact... 查看详情