Master/detail (activity/fragment) 布局，从 Android 移植到代号一

Question

我正在将我的 Android 应用移植到 Codename One 项目，我的近期目标是创建一个 iOS 版本。

我的应用具有 master/detail 结构，并且在手机或平板电脑上使用时具有不同的布局。

确实，当应用程序在平板电脑上以横向模式运行时，可以使用右侧的片段编辑列表的元素，即 activity 列表在左侧，而 activity 列表在左侧编辑发生在片段的右侧。

当应用处于纵向模式时，无论是在平板电脑还是手机上，都会显示该列表。

在手机上，编辑发生在一个单独的 activity 中，但片段是相同的，只是它的布局与 activity 的一样大。

有人建议我看一下 KitchenSink 示例。我看到它的结构是 master/detail 但布局在横向和纵向模式下是相同的，即左侧的列表和 "fragment" 在两个方向上都可见。

我认为通过自定义 KitchenSink 布局并根据方向和控制流以编程方式设置列表和编辑窗格的大小来重现我的应用程序布局并不困难。

这是正确的路径还是必须遵循类似于 Android activity/fragment 代码的内容？

Answer 1

Codename One 没有明确的主从抽象，因为它并不真正需要它。

厨房水槽有点简单，只有菜单是主要细节的一部分。在您的情况下，您只需使用几个容器来表示主容器和细节。您可以将它们视为片段，但实际上它们只是 android 术语中的视图组。

在这里，您可以依靠厨房水槽中的代码来为表单实现此行为。当表单加载时，只需编写您描述的类似于厨房水槽的逻辑，例如：

// I assume form has a BorderLayout and we have a static import of CN.*
if(isTablet() && !isPortrait()) {
   form.add(WEST, master);
   form.add(CENTER, detail);
} else {
   form.add(CENTER, master);
}

form.addOrientationListener(e -> {
   detail.remove();
   master.remove();
   findCommandComponent(
   if(isPortrait()) {
       form.add(CENTER, master);         
   } else {
       form.add(CENTER, detail);
       form.add(WEST, master);
   }
   form.getContentPane().animateLayout(150);
});

我删除了这里的一些逻辑，例如对于事件 handling/navigation 但它的要点是相似的。

另请参阅此处的相关讨论：How to structure the CN1 code for a tablet form layout?

Master/detail (activity/fragment) 布局，从 Android 移植到代号一

Master/detail (activity/fragment) layout, porting from Android to Codename One

java

android

codenameone

porting

master-detail