主/细节（活动/片段）布局，从Android移植到代号一答案

【问题标题】：Master/detail (activity/fragment) layout, porting from Android to Codename One主/细节（活动/片段）布局，从Android移植到代号一
【发布时间】：2020-09-21 08:31:18
【问题描述】：

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

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

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

当应用在平板电脑和手机上处于纵向模式时，会显示列表。

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

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

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

这是正确的路径还是必须遵循类似于 Android 活动/片段代码的内容？

【问题讨论】：

标签： java android codenameone porting master-detail

【解决方案1】：

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

厨房水槽有点简单，仅将菜单作为主要细节的一部分。在您的情况下，您只需使用几个 Containers 来代表 master 和 detail。您可以将它们视为片段，但实际上它们只是 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);
});

这里我删除了一些逻辑，例如用于事件处理/导航，但它的要点是相似的。

也可以在这里查看相关讨论：How to structure the CN1 code for a tablet form layout?

【讨论】：