xamarin.forms_重构:从Xamarin Native到Xamarin.Forms

xamarin.forms

介绍 (Introduction)

Before you actually start developing a mobile app, you have to make various decisions. This includes, for example, the choice of the framework. At the time of creating the app which will be transformed, there was a requirement to create an app for Android, iOS and Windows Phone. That is why the decision to use Xamarin Native was made at the time. It was possible to share the business logic between the three apps and only the UI for the different platforms had to be developed separately. Over time, the choice of Xamarin Native was questioned, so that a platform change was recently carried out. The app has now been implemented with the help of Xamarin.Forms. This article documents this procedure.

在实际开始开发移动应用程序之前,您必须做出各种决定。 例如,这包括框架的选择。 在创建将要转换的应用程序时,需要为Android,iOS和Windows Phone创建一个应用程序。 这就是当时决定使用Xamarin Native的原因。 可以在这三个应用程序之间共享业务逻辑,并且只需要分别开发用于不同平台的UI。 随着时间的流逝,Xamarin Native的选择受到质疑,因此最近进行了平台更改。 该应用程序现已在Xamarin.Forms的帮助下实施。 本文介绍了此过程。

Xamarin Native与Xamarin.Forms (Xamarin Native vs. Xamarin.Forms)

At this point I would like to roughly explain the difference between Xamarin Native and Xamarin.Forms in order to make the actual implementation easier to understand. Xamarin Native is suitable for the development of apps that want to share the business logic between different platforms. However, the UI must be written individually for each platform. For example, storyboards can be used for the iOS version or XAML under UWP. The following picture shows the structure of a Xamarin native app:

在这一点上,我想粗略地解释Xamarin Native和Xamarin.Forms之间的区别,以使实际实现更容易理解。 Xamarin Native适用于希望在不同平台之间共享业务逻辑的应用程序的开发。 但是,必须为每个平台分别编写UI。 例如,情节提要可用于iOS版本或UWP下的XAML。 下图显示了Xamarin本机应用程序的结构:

Image for post

In comparison, Xamarin.Forms offers the possibility to share the UI between the individual platforms in addition to the business logic, so that, ideally, everything only has to be written once.

相比之下,除了业务逻辑之外,Xamarin.Forms还提供了在各个平台之间共享UI的可能性,因此,理想情况下,所有内容仅需编写一次。

Image for post

With this approach, depending on the app, you can share up to 95% of the code and only have to develop a very small part for each platform individually. In both cases 100% of the native APIs are available if required. By using Xamarin Native or Xamarin.Forms, there are no performance losses, since everything is compiled natively.

通过这种方法,根据应用程序,您可以共享多达95%的代码,而只需要为每个平台单独开发非常小的一部分。 在这两种情况下,如果需要,都可以使用100%的本机API。 使用Xamarin Native或Xamarin.Forms,不会造成性能损失,因为所有内容都是本地编译的。

起始位置 (Starting position)

The starting point is an app developed with Xamarin Native for Android, iOS and Windows Phone. It enables the customer to add a number of images to various projects that are accessed via an API. In a second step you can add a comment to each of the images. Then everything is sent to the backend via the API, where the images and comments are stored in a database. Here are a few screenshots of the Android version, implemented with Xamarin Native:

起点是使用Xamarin Native开发的适用于Android,iOS和Windows Phone的应用程序。 它使客户可以向通过API访问的各种项目添加大量图像。 在第二步中,您可以为每个图像添加注释。 然后,所有内容都通过API发送到后端,其中图像和注释存储在数据库中。 这是使用Xamarin Native实现的Android版本的一些屏幕截图:

Image for post

改造 (Replatforming)

Fortunately, I already used the MVVM pattern in the original development of the app, which can now be implemented even more easily with the help of Xamarin.Forms and XAML and thus simplifies the switch from Xamarin Native to Xamarin.Forms.

幸运的是,我已经在应用程序的原始开发中使用了MVVM模式,现在可以借助Xamarin.Forms和XAML更加轻松地实现该模式,从而简化了从Xamarin Native到Xamarin.Forms的转换。

MVVM (Model View View Model) is a design pattern, which provides for a strict separation between business logic and the UI.

MVVM(模型视图视图模型)是一种设计模式,它在业务逻辑和UI之间提供了严格的分隔。

I started in Visual Studio with an empty Xamarin.Forms project, which now only supports Android and iOS, since UWP was not important for the customer anymore. In the next step, the NuGet packages used were analyzed in the old app and added according to the different projects in the new project.

我从Visual Studio开始使用一个空的Xamarin.Forms项目,该项目现在仅支持Android和iOS,因为UWP对客户而言不再重要。 下一步,将在旧应用程序中分析使用的NuGet软件包,并根据新项目中的不同项目将其添加。

The business logic was then transferred step by step and adjustments were made directly. For example, I had implemented the determination of device information on each platform individually, but with the help of Xamarin.Essentials, this logic could be implemented platform-independently in the .NET Standard project. In this context, I also looked more closely at the implementation of the MVVM pattern and made minor adjustments to ViewModels and services. Thanks to the good preparatory work, this process did not take much time.

然后逐步转移业务逻辑,并直接进行调整。 例如,我已经在每个平台上单独实现了设备信息的确定,但是借助Xamarin.Essentials ,可以在.NET Standard项目中独立于平台实现此逻辑。 在这种情况下,我还更加仔细地研究了MVVM模式的实现,并对ViewModels和服务进行了较小的调整。 由于进行了良好的准备工作,因此此过程无需花费很多时间。

The next step focused on the UI. As you can see from the screenshots above, the app did not have an overly complex UI because the functionality was always in the foreground. Due to the fact that the XAML dialect differs between UWP with Windows Phone and Xamarin.Forms, almost nothing could be used from the old app. I took advantage of this opportunity and made adjustments to the UI, which makes the app look more contemporary.

下一步集中在UI上。 从上面的屏幕截图中可以看到,该应用程序没有过于复杂的UI,因为该功能始终处于前台。 由于XAML的方言在带有Windows Phone的UWP和Xamarin.Forms之间有所不同,因此旧应用程序几乎无法使用任何东西。 我抓住了这个机会,对UI进行了调整,从而使该应用看起来更加现代。

While a lot of logic was still implemented in the activities under Android and under iOS in the ViewControllers, I have now implemented the complete UI with the help of DataBinding. Here it helped me that the Xamarin Native implementation was also implemented for Windows Phone, since the DataBinding model was already used and the ViewModels were prepared Ibaccordingly.

尽管在Android和iOS的ViewControllers中的活动中仍然实现了很多逻辑,但是现在我已经在DataBinding的帮助下实现了完整的UI。 在这里,对Xamarin Native的实现也为Windows Phone实现了帮助,因为已经使用了DataBinding模型,并且ViewModels都是经过精心准备的。

Overall, the development of the UI took a little more time because almost nothing could be used. Of course, I was able to orientate myself on the existing structures, so that I didn’t have to start from scratch.

总体而言,UI的开发花费了更多时间,因为几乎无法使用任何东西。 当然,我能够使自己适应现有的结构,因此不必从头开始。

At this point I would like to show you some pictures of the new Xamarin.Forms version of the app on Android:

现在,我想向您展示一些新的Xamarin.Forms版本的Android应用程序图片:

Image for post

摘要 (Summary)

For this project, I can summarize that the replatforming was worth it. Legacy implementation have been replaced by new implementations. At the same time, future adjustments to the app can now be implemented more quickly, since there is only one UI for both platforms. By implementing the Xamarin Native App with the MVVM pattern, much of the business logic could also be used nearly one to one. On the other hand, a little more time had to be invested in building the new UI, since almost nothing could be used here. However, this significantly improved the user experience.

对于这个项目,我可以总结出重新进行是值得的。 旧版实现已被新实现取代。 同时,由于两个平台只有一个用户界面,因此现在可以更快地对应用程序进行将来的调整。 通过使用MVVM模式实现Xamarin Native App,许多业务逻辑也可以一对一地使用。 另一方面,由于新的用户界面几乎无法使用,因此需要花费更多的时间来构建新的用户界面。 但是,这大大改善了用户体验。

To replatform a Xamarin Native to a Xamarin.Forms app, time must be invested until the platform change is completed, but there are numerous advantages through this change, which will definitely pay off in retrospect. We’ve used Xamarin.Forms 4.7 while replatforming the app.

要将Xamarin本机重新平台化为Xamarin.Forms应用程序,必须花费时间直到平台更改完成,但是通过此更改有很多优势,这无疑会得到回报。 我们在重新平台化应用程序时使用了Xamarin.Forms 4.7。

翻译自: https://medium.com/medialesson/replatforming-from-xamarin-native-to-xamarin-forms-f4b92499d9b

xamarin.forms

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值