appcompat v21 Material Design 的问题：片段覆盖内容和工具栏答案

【问题标题】：Issue with appcompat v21 Material Design: Fragment overlay content and toolbarappcompat v21 Material Design 的问题：片段覆盖内容和工具栏
【发布时间】：2015-01-12 20:24:37
【问题描述】：

我跟着http://android-developers.blogspot.de/2014/10/appcompat-v21-material-design-for-pre.html使用了toolbar，没有fragment，效果很好，但是使用fragment时，fragment总是覆盖内容，显示fragment时看不到toolbar。

屏幕：

当我从当前活动开始另一个活动时，新活动中的工具栏图标不会显示。屏幕：

我使用 Android 支持库 21.0.3。

以及MainActivity类中的代码：

protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_my);

    mLeftDrawerList = (ListView) findViewById(R.id.left_drawer);
    mToolbar = (Toolbar) findViewById(R.id.toolbar);
    mDrawerLayout = (DrawerLayout) findViewById(R.id.drawerLayout);
    mNavigationDrawerAdapter=new ArrayAdapter<String>( MyActivity.this, android.R.layout.simple_list_item_1, data);
    mLeftDrawerList.setAdapter(mNavigationDrawerAdapter);

    if (mToolbar != null) {
        mToolbar.setTitle("Home");
        setSupportActionBar(mToolbar);
    }
    initDrawer();


    final FragmentManager fragementMgr = getSupportFragmentManager();
    FragmentTransaction transaction = fragementMgr.beginTransaction();
    transaction.add(R.id.fragment_container, new MyFragment());
    transaction.commit();
}

布局xml：

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"     
    tools:context=".MainActivity"
    android:layout_width="match_parent"
    android:id="@+id/drawerLayout"
    android:layout_height="match_parent">

    <!-- activity view -->
    <LinearLayout
        android:layout_width="match_parent"
        android:background="#fff"
        android:layout_height="match_parent">

        <include layout="@layout/toolbar" />
        <FrameLayout android:id="@+id/fragment_container"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

    </LinearLayout>

    <!-- navigation drawer -->
    <RelativeLayout
        android:layout_gravity="left|start"
        android:layout_width="match_parent"
        android:background="#fff"
        android:layout_height="match_parent">

        <ListView
            android:id="@+id/left_drawer"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:divider="#eee"
            android:background="#fff"
            android:dividerHeight="1dp" />
    </RelativeLayout>

</android.support.v4.widget.DrawerLayout>

MyFragment 中的代码：

public class MyFragment extends Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
        Bundle savedInstanceState) {

        View view = inflater.inflate(R.layout.fragment, container, false);
        final Button button = (Button) view.findViewById(R.id.button);
        button.setOnClickListener(new View.OnClickListener() {
            public void onClick(View v) {
                // Perform action on click
                Intent intent = new Intent(getActivity(), DetailActivity.class);
                startActivity(intent);
            }
        });

        // Inflate the layout for this fragment
        return view;
    }

}

片段的布局xml：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">

    <TextView android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:text="@string/hello_fragment"
                    android:textStyle="bold"
                    android:gravity="center"
                    android:layout_gravity="top"
                    android:textSize="18sp"
                    android:id="@+id/text"/>
    <Button
     android:layout_height="wrap_content"
     android:layout_width="wrap_content"
     android:layout_below="@+id/text"
     android:text="@string/open"
     android:id="@+id/button"/>
</RelativeLayout>

DetailActivity 类中的代码：公共类 DetailActivity 扩展 ActionBarActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.detail_activity);
        Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
        toolbar.setTitle("Detail");
        setSupportActionBar(toolbar);
    }
}

详细活动的布局：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:orientation="vertical"
    android:layout_height="match_parent"
    tools:context=".DetailActivity">

    <include layout="@layout/toolbar" />
    <TextView
                android:layout_width="wrap_content"
                android:textColor="#000"
                android:text="Detail Activity Content"
                android:layout_height="wrap_content" />

</LinearLayout>

谁能帮帮我？非常感谢！

更新：我根据m iav的回复更新了主Activity的代码和布局。

新屏幕现在是空白的，有以下变化：

【问题讨论】：

标签： android android-fragments android-appcompat android-toolbar

【解决方案1】：

工具栏是你布局中的一个视图，你可以像 textview 一样看到它，现在它是一个覆盖你的片段的 textview，你使用 attrbibu 到它下面

【讨论】：

谢谢！是的，解决方案非常接近这个。

【解决方案2】：

所以最后在检查了示例之后：MaterialEverywhere，我提供了更新布局的解决方案：

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"     
    tools:context=".MainActivity"
    android:layout_width="match_parent"
    android:id="@+id/drawerLayout"
    android:layout_height="match_parent">

    <!-- activity view -->
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <include 
            android:id="@+id/toolbar" 
            layout="@layout/toolbar" />
        <FrameLayout android:id="@+id/fragment_container"
            android:layout_below="@id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

    </RelativeLayout>

    <!-- navigation drawer -->
    <RelativeLayout
        android:layout_gravity="left|start"
        android:layout_width="match_parent"
        android:background="#fff"
        android:layout_height="match_parent">

        <ListView
            android:id="@+id/left_drawer"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:divider="#eee"
            android:background="#fff"
            android:dividerHeight="1dp" />
    </RelativeLayout>

</android.support.v4.widget.DrawerLayout>

诀窍在于工具栏和内容框架的父布局。我使用的是相对布局，而不是 LinearLayout。它现在按预期工作。

无论如何，我发现从 SDK 进行的这种更改过于复杂，有很多更改，而且每个都可能导致问题。对于开发人员来说，拥有更少这些调整的干净 API 会更好。

【讨论】：

【解决方案3】：

这应该是您的主要布局。

<android.support.v4.widget.DrawerLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"     
    tools:context=".MainActivity"
    android:layout_width="match_parent"
    android:id="@+id/drawerLayout"
    android:layout_height="match_parent">

    <!-- activity view -->
    <LinearLayout
        android:layout_width="match_parent"
        android:background="#fff"
        android:layout_height="match_parent">

        <include layout="@layout/toolbar" />

        <FrameLayout android:id="@+id/fragment_container"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </LinearLayout>

    <!-- navigation drawer -->
    <RelativeLayout
        android:layout_gravity="left|start"
        android:layout_width="match_parent"
        android:background="#fff"
        android:layout_height="match_parent">

        <ListView
            android:id="@+id/left_drawer"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:divider="#eee"
            android:background="#fff"
            android:dividerHeight="1dp" />
    </RelativeLayout>

</android.support.v4.widget.DrawerLayout>

这应该是您对新片段的调用：

transaction.add(R.id.fragment_container, new MyFragment())
transaction.commit();

关于您的第二个问题，导航抽屉不能在不同的活动之间共享。您必须使用新的 Fragment 并保持您现在正在使用的 Activity。

【讨论】：

感谢米亚夫！我尝试了您的解决方案，但没有显示该片段。文本和按钮不显示。似乎很奇怪。我在活动中的代码是：transaction.add(R.id.fragment_container, new MyFragment()); transaction.commit();
确保上面的FrameLayout中有android:id="@+id/fragment_container"。
请更新原始问题中的代码以反映您的更改。
我看不出你的代码有什么问题。我唯一的猜测是您使用的是 android.app.FragmentManager 而不是 android.support.v4.app.FragmentManager 。尝试嵌套所有四行，例如：getSupportFragmentManager().beginTransaction().add(...).commit();
HI m iav，实际上我确实使用了android.support.v4.app.FragmentManager，否则会出现编译错误。你也可以看到上面MyActivity的代码，这是主要的活动。可能是因为布局？在主activity的布局中，LinearLayout内的FrameLayout有match_parent为layout_height？