11

我正在开发一个针对平板电脑和谷歌电视的应用程序。它将像许多标准的 Google TV 应用程序一样,带有一个 LeftNavBar 和一个所有应用程序屏幕通用的顶部搜索栏。它将类似于下图:

主屏幕 在此处输入图像描述

对于所有其他屏幕,红色区域将有所不同。它可能包含以下屏幕模型之类的数据:

活动一加载到主容器中 在此处输入图像描述

活动二加载到主容器中 在此处输入图像描述

所以你可以看到在主区域可以加载完全不同的部分。

在选择屏幕2中的任何列表项目(在片段列表中)中选择任何列表项目时,屏幕3可以作为详细的部分加载,也可以通过选择选项卡(将出现在LeftNavbar中)加载。

这是我尝试实现它的方式。

第 1 步。我使用以下 XML 创建了一个主 Activity:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#9ccc" >

        <!-- Top Bar -->

    </LinearLayout>

    <FrameLayout
        android:id="@+id/mainContainer"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

        <!-- main Red Container that will load other Activities -->

    </FrameLayout>
</LinearLayout>

mainContainer是我要加载活动的 RED 容器。LeftNavBar将作为 All 的父级添加到此 Activity。

第 2 步我分别在其中创建ActivityOneActivityTwo两个和三个片段(如上图第二个和第三个图像所示)。

*第 3 步我正在尝试ActivityOne在主页的mainContainer FrameLayout 中加载...但我无法添加它。

我尝试通过添加ActivityOne如下mainContainer

View v = (new ActivityOne()).getWindow().getDecorView();
FrameLayout mainContainer = (FrameLayout) findViewById(R.id.mainContainer);
mainContainer.addView(v);

getWindow()回报null....

发生其他问题是因为所有数据都来自远程服务..所以还请建议我如何能够mainContainer在某种堆栈中保存对所有已加载活动的引用......所以我可以重新加载已经加载的活动而不是创建它的新实例。这将在按下 BACK 按钮时使用。

或者

与其将活动加载到上述 RED 容器中,我应该创建两个活动,每个活动都有自己的片段和一个 LeftNavBar。这可能比上述方法更容易。或者这可能是唯一的解决方案....但是我觉得为 BACK 按钮保存状态可能会变得混乱..但我会尝试实现这个

如果您必须创建这种类型的应用程序,您会怎么做?您将如何设计 UI 布局以获得最佳性能/实践?

非常感谢您帮助我设置此应用程序布局的建议。

4

2 回答 2

3

免责声明

这是片段可能变得棘手的地方。如果 Activity 1 和 2 具有相同的布局,那么问题将很简单,这样您就可以简单地附加/分离片段并使用片段返回堆栈来展开。

因为你想要 2 个独特的布局来容纳你的片段,所以事情会更复杂一些。如果可能的话,我会尝试使用相同的布局,这样你就可以走捷径。

作为另一种选择,您可以使用上面概述的两个活动,并使用 Intents 来回发送数据。

也就是说,如果我真的必须按照所写的方式实施这个解决方案,这就是我要做的。请注意,我不提倡这种解决方案,但我自己不知道更好的做事方式。

解决方案

创建一个 FragmentActivity,其视图将是您在上面定义的主屏幕。主屏幕的布局将包含:

  • 左侧导航栏
  • 顶栏
  • 2个布局。布局1和布局2。这些将包含在父布局中,即RelativeLayout 或LinearLayout,并将包含片段所需的FrameLayout 元素。

使用您的 XML 的示例(注意,标签有点简短):

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#9ccc" >

        <!-- Top Bar -->

    </LinearLayout>

    <LinearLayout android:id="@+id/layout1">
        <FrameLayout android:id="@+id/listFragment" />
        <FrameLayout android:id="@+id/contentFragment" />
    </LinearLayout>

    <LinearLayout android:id="@+id/layout2">
        <FrameLayout android:id="@+id/imageFragment" />
        <FrameLayout android:id="@+id/boxFragment1" />
        <FrameLayout android:id="@+id/boxFragment2" />
        <FrameLayout android:id="@+id/boxFragment3" />
    </LinearLayout>

</LinearLayout>

主要思想是,然后根据应用程序的状态显示/隐藏 layout1 和 layout2 即设置 android:visibility="gone"。

这种方法的缺点是:

  • 使用片段 backstack 可能是不可能的,相反,您必须跟踪用户在 UI 流中的位置并管理后退按钮以显示/隐藏布局
  • 当您显示/隐藏其父视图时,您可能需要特别注意附加/分离片段,以减少片段不可见时的资源消耗

优点是:

  • 片段和基本活动之间的轻松通信,因为只使用了 1 个活动
于 2012-08-01T23:33:16.383 回答
-1

Re: 嵌套片段问题

为了解决我们的应用程序中的“嵌套片段”问题(正如您正确注意到Fragment的),Fragment我在活动下托管了一个模板片段,其唯一目的是定义一组占位符以供其他片段锚定到。在向活动添加更多片段时,我使用模板片段的视图占位符+@ids 来识别正在添加的片段的“根”或父视图 ID。

    getSupportFragmentManager().beginTransaction().add(#someIdFromTheTemplateFrag, fragment, fragmentTag).commit();

我添加的 Fragment 然后知道在当前布局中将自己锚定在哪里,当然然后开始使用它添加它的视图的快乐方式。这具有将片段附加到另一个片段的效果,从而实现所需的视觉“嵌套”......

于 2012-07-25T13:56:36.293 回答