linux arm平台_为Linux ARM设备构建跨平台UI的新方法

linux arm平台

为应用程序创建出色的用户体验（UX）是一项艰巨的任务，尤其是在开发嵌入式应用程序时。 如今，通常有两种类型的图形用户界面（GUI）工具可用于开发嵌入式软件：它们涉及复杂的技术，或者价格昂贵。

但是，我们已经创建了一种概念验证（PoC），以一种新方法来使用现有的，行之有效的工具为在台式机，移动设备，嵌入式设备和低功耗Linux ARM设备上运行的应用程序构建用户界面（UI）。 。 我们的方法使用Android Studio绘制UI； TotalCross在设备上呈现Android XML； 一个新的TotalCross API，称为KnowCode ; 和Raspberry Pi 4来执行应用程序。

选择Android Studio

可以使用TotalCross API为应用程序构建响应良好的精美UX，但是在Android Studio中创建UI可以缩短原型开发和实际应用之间的时间。

有很多工具可用于为应用程序构建UI，但是Android Studio是全世界开发人员最常使用的工具。 除了被广泛采用之外，该工具的使用也非常直观，并且对于创建简单和复杂的应用程序确实非常强大。 在我看来，唯一的缺点是使用该工具所需的计算能力，这比其他集成开发环境（IDE）（如VSCode或其开源替代方案VSCodium ）要重得多。

通过考虑这些问题，我们使用Android Studio绘制UI并使用TotalCross创建了概念验证，以直接在设备上运行Android XML。

建立使用者介面

对于PoC，我们想创建一个家用设备应用程序来控制温度和其他事物，并且该应用程序可以在Linux ARM设备上运行。

^{（Bruno Muniz， CC BY-SA 4.0 ）}

我们想为Raspberry Pi开发应用程序，因此我们使用Android的ConstraintLayout构建了848x480（Raspberry Pi的分辨率）的固定屏幕尺寸的UI，但是您可以使用其他布局构建响应式UI。

Android XML为UI创建增加了很多灵活性，从而可以轻松为应用程序构建丰富的用户体验。 在下面的XML中，我们使用了两个主要组件： ImageView和TextView 。

   
   

    
    
 
     
     <ImageView 
     
     


     
     android:id = "@+id/imageView6" 
     
     


     
     android:layout_width = "273dp" 
     
     


     
     android:layout_height = "291dp" 
     
     


     
     android:background = "@drawable/Casa" 
     
     


     
     tools:layout_editor_absoluteX = "109dp" 
     
     


     
     tools:layout_editor_absoluteY = "95dp" /> 
     
     


     
     <TextView 
     
     


     
     android:id = "@+id/insideTempEdit" 
     
     


     
     android:layout_width = "94dp" 
     
     


     
     android:layout_height = "92dp" 
     
     


     
     android:background = "#F5F5F5" 
     
     


     
     android:text = "20" 
     
     


     
     android:textAlignment = "center" 
     
     


     
     android:gravity = "center" 
     
     


     
     android:textColor = "#000000" 
     
     


     
     android:textSize = "67dp" 
     
     


     
     android:textStyle = "bold" 
     
     


     
     tools:layout_editor_absoluteX = "196dp" 
     
     


     
     tools:layout_editor_absoluteY = "246dp" /> 
    
    
   
   

TextView元素用于向用户显示一些数据，例如建筑物内的温度。 大多数ImageView都用作用户与UI交互的按钮，但是也需要它们来实现屏幕上组件提供的事件。

与TotalCross集成

此PoC中的第二项技术是TotalCross。 我们不希望在设备上使用Android提供的任何功能，因为：

1. 我们的目标是为Linux ARM提供出色的UI。
2. 我们希望在设备上实现低占用空间。
3. 我们希望应用程序在具有低计算能力的低端硬件设备上运行（例如，没有GPU，低RAM等）。

首先，我们使用VSCode插件创建了一个空的TotalCross项目。 接下来，我们将图像的副本保存在drawable文件夹中，将Android XML文件的副本保存在XML文件夹中，两者都位于Resources文件夹中：

^{（Bruno Muniz， CC BY-SA 4.0 ）}

为了使用TotalCross Simulator运行XML文件，我们添加了一个名为KnowCode的新TotalCross API和一个MainWindow来加载XML。 下面的代码使用API​​加载和呈现XML：

   
   

    
    
 
     
     public 
     
     void initUI 
     
     ( 
     
     ) 
     
     { 
     
     

    XmlScreenAbstractLayout xmlCont 
     
     = XmlScreenFactory. 
     
     create 
     
     ( “xml 
     
     / homeApplianceXML. 
     
     xml ” 
     
     ) 
     
     ; 
     
     

    swap 
     
     ( xmlCont 
     
     ) 
     
     ; 
     
     


     
     } 
    
    
   
   

而已！ 仅需两个命令，我们就可以使用TotalCross运行一个Android XML文件。 这是XML在TotalCross的模拟器上的执行方式：

^{（Bruno Muniz， CC BY-SA 4.0 ）}

完成此PoC还剩下两件事：添加一些事件以提供用户交互，并在Raspberry Pi上运行它。

添加事件

KnowCode API提供了一种通过其ID（getControlByID）获取XML元素并更改其行为以执行诸如添加事件，更改可见性等操作的方法。

例如，为了使用户能够更改其房屋或其他建筑物中的温度，我们在用户界面的底部放置了加号和减号按钮，并在每次单击按钮时将“ click”事件增加或降低了温度一度：

   
   

    
    
 
     
     Button plus 
     
     = 
     
     ( 
     
     Button 
     
     ) xmlCont. 
     
     getControlByID 
     
     ( 
     
     "@+id/plus" 
     
     ) 
     
     ; 
     
     


     
     Label insideTempLabel 
     
     = 
     
     ( 
     
     Label 
     
     ) xmlCont. 
     
     getControlByID 
     
     ( 
     
     "@+id/insideTempLabel" 
     
     ) 
     
     ; 
     
     

plus. 
     
     addPressListener 
     
     ( 
     
     new PressListener 
     
     ( 
     
     ) 
     
     { 
     
     

    @Override
     
     

    
     
     public 
     
     void controlPressed 
     
     ( ControlEvent e 
     
     ) 
     
     { 
     
     

        
     
     try 
     
     { 
     
     

            
     
     String tempString 
     
     = insideTempLabel. 
     
     getText 
     
     ( 
     
     ) 
     
     ; 
     
     

            
     
     int temp 
     
     ; 
     
     

            temp 
     
     = Convert. 
     
     toInt 
     
     ( tempString 
     
     ) 
     
     ; 
     
     

            insideTempLabel. 
     
     setText 
     
     ( Convert. 
     
     toString 
     
     ( 
     
     ++ temp 
     
     ) 
     
     ) 
     
     ; 
     
     

        
     
     } 
     
     catch 
     
     ( InvalidNumberException e1 
     
     ) 
     
     { 
     
     

            e1. 
     
     printStackTrace 
     
     ( 
     
     ) 
     
     ; 
     
     

        
     
     } 
     
     

    
     
     } 
     
     


     
     } 
     
     ) 
     
     ; 
    
    
   
   

在Raspberry Pi 4上测试

最后，最后一步！ 我们在设备上运行该应用程序并检查了结果。 我们只需要打包应用程序，然后在目标设备上部署和运行它。 VNC也可以用来检查设备上的应用程序。

在Linux ARM上，整个应用程序（包括资产（图像等），Android XML，TotalCross和KnowCode API）约为8MB。

这是该应用程序的演示：

^{（Bruno Muniz， CC BY-SA 4.0 ）}

所有示例源代码和项目都可以在HomeApplianceXML GitHub存储库中找到。

现有工具的新可能性

为嵌入式应用程序创建GUI不需要像现在这样困难。 这一概念证明为如何轻松地完成此任务提供了新的视角-不仅适用于嵌入式系统，而且适用于所有使用相同代码库的所有主要操作系统。

我们的目标不是为设计人员或开发人员创建用于构建UI应用程序的新工具。 我们的目标是为使用现有最佳工具提供新的可能性。

您对这种构建应用程序的新方式有何看法？ 在下面的评论中分享您的想法。

翻译自: https://opensource.com/article/20/5/linux-arm-ui

linux arm平台