Play Honeycomb GMail UI with Fragments

Question

I am trying to reproduce Honeycomb GMail UI with fragments and cannot. That's what i want

The initial state:

+--------+---------------+ | | | |Accounts| Folders | | | | +--------+---------------+ 

after selecting a folder:

 +--------+---------------+ | | | |Folders | Items | | | | +--------+---------------+ 

where Accounts, Folders and Items are fragments. (Obviously, the return button should go back to its original state)

I tried the following layout:

 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="horizontal" android:id="@+id/root"> <FrameLayout android:id="@+id/left_pane" android:layout_weight="1" android:layout_width="0px" android:layout_height="match_parent" /> <FrameLayout android:id="@+id/right_pane" android:layout_weight="1.6" android:layout_width="0px" android:layout_height="match_parent" /> </LinearLayout> 

Unfortunately, this does not work, because I cannot transfer the Folders fragment from the right panel to the left panel (the fragment can be added only once). Instead, I can create new folders, but this is a rather resource-intensive process, requires careful state management (especially when you click the "Back" button) and does not look the way I want it to look.

I tried using 3 FrameLayouts (left, middle, right with weights 1, 1.6, 2.56), but I can not get FrameLayout to collapse when the fragment is not displayed. Any help really appreciated

Answer 1

Using the three framework suggested by Nicholas's post works great in my application. To maintain the right relationship, you may need to dynamically change the weight of the layout (although, I suppose, this could be avoided). I use this helper method to handle all this logic. Note that he needs a pair of helpers; as a rule, it should be clear what needs to be done on their behalf, so I did not publish them here. One thing, however, is that I have a member array that contains all the frame holders, so this method can automatically hide everything that is not required.

  final private void showFrames(View leftFrame, View rightFrame) { // Hide frames that should be gone for (View frame : mContentFrames) { if (frame != leftFrame && frame != rightFrame) { frame.setVisibility(View.GONE); Fragment frag = getFragmentManager().findFragmentById(frame.getId()); if (frag != null) { getFragmentTransaction().remove(frag); } } } // Set up the left frame if (leftFrame != null) { leftFrame.setVisibility(View.VISIBLE); leftFrame.setLayoutParams(new LayoutParams(0, LayoutParams.FILL_PARENT, 3)); } // Set up the right frame if (rightFrame != null) { rightFrame.setVisibility(View.VISIBLE); rightFrame.setLayoutParams(new LayoutParams(0, LayoutParams.FILL_PARENT, 7)); } // TODO: set up animation // Start the transition commitTransition(); } 

Hope this helps! --randy

Answer 2

I think you could use 3 FrameLayouts and hide an unused frame. Therefore, initially the Items frame is hidden. When an item is selected in the "Folders" frame, the "Accounts" frame is hidden, and the "Elements" fame becomes visible. The frame of the folder (or main activity) would have to intercept the "Back" button so that it could hide the "Elements" frame and make the account frame visible.

Answer 3

I think you can get some idea from StackScrollView for Android ..

https://github.com/raweng/Android-StackScrollview