title: OverLay Two Layouts in One Fragment
body: <p>I'd like to have <code>layout B</code> on top of layout A. I want to join or merge the two layouts. In the image below, the round green, and blue views shares the same layout but they are created as different fragments. The <code>RoundedColourFragment</code> class extends <code>SherlockFragment</code> and is responsible in customizing the fragment <code>layout</code> size and shape. My problem is I can't put the <code>two_fragment</code> layout at the top of <code>twoFragments</code> layout. I been trying to join them in the <code>onCreateView</code> of <code>RoundedColourFragment</code>. It's like overlaying the layouts.</p>
  
  <p><img src="https://i.stack.imgur.com/Lnuv1.png" alt="enter image description here"></p>
  
  <hr>
  
  <pre><code>         leftFrag = new RoundedColourFragment(getActivity().getResources().getColor(
                  R.color.trans), 1f, MARGIN, MARGIN / 2, MARGIN, MARGIN);
  
           rightFrag = new RoundedColourFragment(getActivity().getResources().getColor(
                   R.color.honeycombish_blue), 2f, MARGIN / 2, MARGIN, MARGIN,
                   MARGIN);
  
  
           FragmentTransaction ft = getChildFragmentManager().beginTransaction();
           ft.add(R.id.twoFragments, leftFrag, "left");
           ft.add(R.id.twoFragments, rightFrag, "right");
           ft.addToBackStack(null);
           ft.commit();
  </code></pre>
  
  <p><strong>twoFragments.xml</strong></p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:orientation="horizontal"
      android:layout_width="fill_parent"
      android:layout_height="fill_parent"
      android:id="@+id/twoFragments"&gt;
  &lt;/LinearLayout&gt;
  </code></pre>
  
  <p><strong>RoundedColourFragment.java</strong></p>
  
  <pre><code>public class RoundedColourFragment extends SherlockFragment {
  
      private View mView;
      private int mColour;
      private float mWeight;
      private int marginLeft, marginRight, marginTop, marginBottom;
  
  ...
  
      @Override
      public void onCreate(Bundle savedInstanceState) {
          super.onCreate(savedInstanceState);
          mView = new View(getActivity());
  
          GradientDrawable background = (GradientDrawable) getResources()
                  .getDrawable(R.drawable.rounded_rect);
          background.setColor(mColour);
  
          mView.setBackgroundDrawable(background);
          LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(0,
                  LayoutParams.FILL_PARENT, mWeight);
          lp.setMargins(marginLeft, marginTop, marginRight, marginBottom);
          mView.setLayoutParams(lp);
      }
  
      @Override
      public View onCreateView(LayoutInflater inflater, ViewGroup container,
              Bundle savedInstanceState) {
  
           LayoutInflater vi = (LayoutInflater) getActivity().getSystemService(Context.LAYOUT_INFLATER_SERVICE);
           View rootView = vi .inflate(R.layout.two_fragment, container, false);
  
           ((ViewGroup) rootView).addView(mView, 0, new ViewGroup.LayoutParams(
                   ViewGroup.LayoutParams.FILL_PARENT, ViewGroup.LayoutParams.FILL_PARENT));
  
          return rootView;
      }
  
  }
  </code></pre>
  
  <p><strong>two_fragment.xml</strong></p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:orientation="vertical"
      android:id="@+id/two_fragment" &gt;
      &lt;Button
          android:id="@+id/bbtnn"
          style="?android:attr/buttonStyleSmall"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:text="Button" /&gt;
  &lt;/LinearLayout&gt;
  </code></pre>