使用TotalCross快速构建嵌入式系统程序的用户界面。从头开始构建GUI是一个非常耗时的过程,并且以硬编码的方式处理所有定位和对齐对于某些程序员来说确实很困难。所以在这篇文章中,我将演示如何使用XML来加速这个过程。本项目使用TotalCross作为目标框架。TotalCross是一个开源的跨平台软件开发工具包(SDK),旨在更快地为嵌入式设备创建GUI。TotalCross无需在设备上运行Java即可提供Java的开发优势,因为它使用自己的字节码和虚拟机(TC字节码和TCVM)来增强性能。我还使用了Knowcode-XML,它是TotalCross框架的开源XML解析器,可将XML文件转换为TotalCross组件。项目要求要重现此项目,您需要:KnowCode-XMLVSCode或VSCodiumAndroid开发环境VSCode的TotalCross插件适合您Java用于您的开发平台(Linux、Mac或Windows),需要Java11(或更高版本)Git制作一个嵌入式应用程序,它由一个嵌入式GUI组成,其中包含扫描、打印和复印等基本打印功能。打印机初始化屏幕构建此GUI需要几个步骤,包括使用Android-XML生成GUI,然后使用Knowcode-XML解析器在TotalCross框架上运行它。1.生成AndroidXML要创建XML文件,首先要构建一个简单的Android屏幕,然后对其进行自定义。如果您不知道如何编写Android-XML,或者您只是想尝试一下,您可以从这个GitHub项目下载这个应用程序的XML。该项目还包含用于呈现GUI的图像。2.调整XML生成XML文件后,您需要进行一些微调,以确保一切对齐、比例正确以及图像路径正确。将XML布局添加到Layouts文件夹,将所有资源添加到Drawable文件夹。然后您可以开始自定义XML。例如,如果你想改变一个XML对象的背景,你可以改变android:background属性:android:background="@drawable/scan"你也可以使用tools:layout_editor_absoluteX和tools:layout_editor_absoluteY改变位置对象的大小:tools:layout_editor_absoluteX="830dp"tools:layout_editor_absoluteY="511dp"或者使用android:layout_width和android:layout_height改变对象的大小:android:layout_width="70dp"android:layout_height="70dp"如果你想在一个对象上放置文本,你可以使用android:textSize,android:text,android:textStyle和android:textColor:android:textStyle="bold"android:textColor="#000000"android:textSize="20dp"android:text="2:45PM"下面是一个完整的XML对象的示例:3。在TotalCross上运行GUI以完成所有XML调整之后,是时候在TotalCross上运行它了。在TotalCross扩展上新建一个项目(LCTT译注:VSCode内部),将XML和Drawable文件夹添加到Main文件夹中。如果您仍然不确定如何创建TotalCross项目,请参阅我们的入门指南。配置环境后,使用totalcross.knowcode.parse.XmlContainerFactory并导入totalcross.knowcode.parse.XmlContainerLayout以使用XMLGUI在TotalCross框架上。您可以在其GitHub页面上找到有关使用KnowCode-XML的更多信息。4.添加过渡效果本项目的平滑过渡效果由SlidingNavigator类创建,从一个屏幕滑动到另一个屏幕使用TotalCross的ControlAnimation类。在XMLpresenter类上调用SlidingNavigator:newSlidingNavigator(this).present(HomePresenter.class);在SlidingNavigator类上实现present函数:publicvoidpresent(ClasspresenterClass)throwsInstantiationException,IllegalAccessException{finalXMLPresenterpresenter=cache.containsKey(presenterClass)?缓存.get(presenterClass):presenterClass.newInstance();if(!cache.containsKey(presenterClass)){cache.put(presenterClass,presenter);}if(presenters.isEmpty()){window.add(presenter.content,LEFT,TOP,FILL,FILL);}else{XMLPresenterprevious=presenters.lastElement();window.add(presenter.content,AFTER,TOP,SCREENSIZE,SCREENSIZE,previous.content);在动画控件中使用PathAnimation创建从一个屏幕到另一个屏幕的滑动动画:PathAnimation.create(previous.content,-Settings.screenWidth,0,newControlAnimation.AnimationFinished(){@OverridepublicvoidonAnimationFinished(ControlAnimationanim){window.remove(previous.content);}},1000).with(PathAnimation.create(presenter.content,0,0,newControlAnimation.AnimationFinished(){@OverridepublicvoidonAnimationFinished(ControlAnimationanim){presenter.content.setRect(LEFT,TOP,FILL,填充);}},1000)).开始();}主持人。设置导航器(这个);主持人。推(主持人);主持人。绑定2();如果(presenter.isFirstPresent){presenter.onPresent();presenter.isFirstPresent=false;}5.LoadingCircularProgressBar打印机应用程序的另一个不错的功能是加载屏幕动画,显示它包括文本和旋转动画的进度。通过添加定时器和定时器监听来加载循环进度条来更新进度标签,然后调用函数spinner.start()来实现这个功能。所有动画都由TotalCross和KnowCode自动生成:publicvoidstartSpinner(){time=content.addTimer(500);content.addTimerListener((e)->{try{progress();//更新标签}catch(InstantiationException|IllegalAccessExceptione1){//TODO自动生成的catch块e1.printStackTrace();}});旋转器spinner=(Spinner)((XmlContainerLayout)content).getControlByID("@+id/spinner");微调器。开始();此处循环进度条被实例化为对XML文件中描述的XmlContainerLayoutspinner的引用:6.构建应用程序是时候构建应用程序了。您可以在pom.xml中查看和更改目标系统。请确保LinuxArm目标可用。如果您使用的是VSCode,请按键盘上的F1键,选择TotalCross:Package并等待完成。然后就可以在Target文件夹中看到安装文件了。7.在RaspberryPi上部署并运行应用程序要使用SSH协议在RaspberryPi上部署应用程序,请按键盘上的F1。选择TotalCross:Deploy&Run并提供有关您的SSH连接的信息,例如:用户名、IP地址、密码和应用程??序路径。TotalCross:部署和运行配置SSH用户名配置IP地址输入密码配置路径摘要KnowCode使使用Java创建和管理应用程序屏幕变得更加容易。Knowcode-XML将您的XML转换为TotalCrossGUI界面,然后生成二进制文件以在您的RaspberryPi上运行。将KnowCode技术与TotalCross相结合,使您能够更快地创建嵌入式应用程序。您可以访问我们在GitHub上的嵌入式示例并编辑您自己的应用程序,看看您还能做什么。