系统默认下的Android自定义应用栏 [英] Android custom app bar underneath system default

查看:54
本文介绍了系统默认下的Android自定义应用栏的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的MainActivity.xml如下:

 <?xml version ="1.0" encoding ="utf-8"?>< android.support.v4.widget.DrawerLayoutxmlns:android ="http://schemas.android.com/apk/res/android"xmlns:app ="http://schemas.android.com/apk/res-auto"xmlns:tools ="http://schemas.android.com/tools"android:id ="@ + id/drawer_layout"android:layout_width ="match_parent"android:layout_height ="match_parent"android:fitsSystemWindows ="true"工具:openDrawer ="start"><包括layout ="@ layout/app_bar_appbar"android:layout_width ="match_parent"android:layout_height ="match_parent"/>< android.support.design.widget.NavigationViewandroid:id ="@ + id/nav_view"android:layout_width ="wrap_content"android:layout_height ="match_parent"android:layout_gravity ="start"android:fitsSystemWindows ="true"app:headerLayout ="@ layout/nav_header_appbar"app:menu ="@ menu/activity_appbar_drawer"/>< android.support.design.widget.CoordinatorLayoutxmlns:app ="http://schemas.android.com/apk/res-auto"android:layout_width ="match_parent"android:layout_height ="match_parent">< android.support.design.widget.AppBarLayoutandroid:layout_width ="match_parent"android:layout_height ="wrap_content"android:paddingTop ="@ dimen/appbar_padding_top"android:theme ="@ style/AppTheme.AppBarOverlay">< android.support.v7.widget.Toolbarandroid:id ="@ + id/toolbar"android:layout_width ="match_parent"android:layout_height =?attr/actionBarSize"android:layout_weight ="1"android:background =?attr/colorPrimary"app:layout_scrollFlags ="scroll | enterAlways"app:popupTheme ="@ style/AppTheme.PopupOverlay"app:title ="@ string/app_name"></android.support.v7.widget.Toolbar>< android.support.design.widget.TabLayoutandroid:id ="@ + id/tabs"android:layout_width ="match_parent"android:layout_height ="wrap_content"app:layout_scrollFlags ="scroll | exitUntilCollapsed">< android.support.design.widget.TabItemandroid:layout_width ="wrap_content"android:layout_height ="wrap_content"android:text ="@ string/tab_text_1"/>< android.support.design.widget.TabItemandroid:layout_width ="wrap_content"android:layout_height ="wrap_content"android:text ="@ string/tab_text_2"/>< android.support.design.widget.TabItemandroid:layout_width ="wrap_content"android:layout_height ="wrap_content"android:text ="@ string/tab_text_3"/></android.support.design.widget.TabLayout></android.support.design.widget.AppBarLayout>< android.support.v4.view.ViewPagerandroid:id ="@ + id/container"android:layout_width ="match_parent"android:layout_height ="match_parent"app:layout_behavior ="@ string/appbar_scrolling_view_behavior"></android.support.v4.view.ViewPager></android.support.design.widget.CoordinatorLayout></android.support.v4.widget.DrawerLayout> 

我的意图是创建一个带有导航抽屉(左侧图标)和选项菜单(右侧图标)的应用栏.但是,它似乎卡在了系统默认值之下.这是显示其预览的图像:

此外,我的styles.xml是:

 < resources>< ;!-基本应用程序主题.->< style name ="AppTheme" parent ="Theme.AppCompat.Light.DarkActionBar"><!-在这里自定义主题.->< item name ="colorPrimary"> @ color/colorPrimary</item>< item name ="colorPrimaryDark"> @ color/colorPrimaryDark</item>< item name ="colorAccent"> @ color/colorAccent</item></style>< style name ="AppTheme.NoActionBar" parent ="AppTheme">< item name ="windowActionBar"> false</item>< item name ="windowNoTitle"> true</item></style>< style name ="AppTheme.AppBarOverlay" parent ="ThemeOverlay.AppCompat.Dark.ActionBar"/>< style name ="AppTheme.PopupOverlay" parent ="ThemeOverlay.AppCompat.Light"/></resources> 

将AppCompat.Light.DarkActionBar更改为NoActionBar无效.带有"AppName"的应用栏仅保留在另一个应用栏的上方(除了导航栏和选项菜单的两个图标外,该应用栏还应显示"BEEP"为文本)-在活动清单中也定义了NoActionBar:

 <活动android:name =.MainActivity"android:label ="BEEP"android:theme ="@ style/AppTheme.NoActionBar"><意图过滤器>< action android:name ="android.intent.action.MAIN"/>< category android:name ="android.intent.category.LAUNCHER"/></intent-filter></activity> 

如果需要,这是MainActivity.java的相关部分:

  @Override受保护的void onCreate(Bundle savedInstanceState){super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);工具栏工具栏=(工具栏)findViewById(R.id.toolbar);setSupportActionBar(toolbar);//创建适配器,该适配器将为三个适配器分别返回一个片段//活动的主要部分.mSectionsPagerAdapter =新的SectionsPagerAdapter(getSupportFragmentManager());//使用部分适配器设置ViewPager.mViewPager =(ViewPager)findViewById(R.id.container);mViewPager.setAdapter(mSectionsPagerAdapter);TabLayout tabLayout =(TabLayout)findViewById(R.id.tabs);mViewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));tabLayout.addOnTabSelectedListener(新的TabLayout.ViewPagerOnTabSelectedListener(mViewPager));DrawerLayout抽屉=(DrawerLayout)findViewById(R.id.drawer_layout);ActionBarDrawerToggle切换=新的ActionBarDrawerToggle(抽屉,工具栏,R.string.navigation_drawer_open,R.string.navigation_drawer_close);cabinet.addDrawerListener(toggle);toggle.syncState();NavigationView navigationView =(NavigationView)findViewById(R.id.nav_view);navigationView.setNavigationItemSelectedListener(this);... 

那么,如何显示工具栏(ID为"toolbar")而不是上面图像中当前包含文本"AppName"的默认应用栏?我还遵循了

 <?xml version ="1.0" encoding ="utf-8"?>< android.support.design.widget.CoordinatorLayoutxmlns:android ="http://schemas.android.com/apk/res/android"xmlns:app ="http://schemas.android.com/apk/res-auto"xmlns:tools ="http://schemas.android.com/tools"android:layout_width ="match_parent"android:layout_height ="match_parent">< android.support.design.widget.AppBarLayoutandroid:layout_width ="match_parent"android:layout_height ="wrap_content"android:theme ="@ style/AppTheme.AppBarOverlay">< android.support.v7.widget.Toolbarandroid:id ="@ + id/toolbar"android:layout_width ="match_parent"android:layout_height =?attr/actionBarSize"android:background =?attr/colorPrimary"app:popupTheme ="@ style/AppTheme.PopupOverlay"/></android.support.design.widget.AppBarLayout>< include layout ="@ layout/content_appbar"/></android.support.design.widget.CoordinatorLayout> 

解决方案

当您将 Theme.AppCompat.Light.DarkActionBar 放入AndroidManifest的 Application 标记中时,所有活动将包含默认操作栏.

使用 NoActionBar 在您的styles.xml中再创建一个主题,并将其应用于您的 NavigationDrawerActivity .

 < style name ="navigation_theme" parent ="Theme.AppCompat.Light.NoActionBar"/> 

将其设置为您的导航活动

 <活动android:name =.NavigationDrawerActivity"android:label ="@ string/title_activity_navigation_drawer"android:theme ="@ style/navigationtheme"/> 

具有ActionBar的默认主题和具有NoActionBar主题的NavigationDrawerActivity的示例

编辑

正如@Talisman所说,这是TabLayout和ViewPager的问题DrawerLayout的

 <?xml version ="1.0" encoding ="utf-8"?>< android.support.v4.widget.DrawerLayout xmlns:android ="http://schemas.android.com/apk/res/android"xmlns:app ="http://schemas.android.com/apk/res-auto"xmlns:tools ="http://schemas.android.com/tools"android:id ="@ + id/drawer_layout"android:layout_width ="match_parent"android:layout_height ="match_parent"android:fitsSystemWindows ="true"工具:openDrawer ="start">< android.support.design.widget.CoordinatorLayoutandroid:layout_width ="match_parent"android:layout_height ="match_parent"工具:context ="com.and.NavigationDrawerActivity">< android.support.design.widget.AppBarLayoutandroid:layout_width ="match_parent"android:layout_height ="wrap_content"android:theme ="@ style/AppTheme.AppBarOverlay">< android.support.v7.widget.Toolbarandroid:id ="@ + id/toolbar"android:layout_width ="match_parent"android:layout_height =?attr/actionBarSize"android:background ="@ android:color/holo_blue_light"app:popupTheme ="@ style/AppTheme.PopupOverlay"/></android.support.design.widget.AppBarLayout><!-您在此FrameLayout中的内容->< FrameLayoutandroid:id ="@ + id/container"android:layout_width ="match_parent"android:layout_height ="match_parent"app:layout_behavior ="@ string/appbar_scrolling_view_behavior"工具:context ="com.and.NavigationDrawerActivity"></FrameLayout>< android.support.design.widget.FloatingActionButtonandroid:id ="@ + id/fab"android:layout_width ="wrap_content"android:layout_height ="wrap_content"android:layout_gravity ="bottom | end"android:layout_margin ="@ dimen/fab_margin"app:srcCompat ="@ android:drawable/ic_dialog_email"/></android.support.design.widget.CoordinatorLayout>< android.support.design.widget.NavigationViewandroid:id ="@ + id/nav_view"android:layout_width ="wrap_content"android:layout_height ="match_parent"android:layout_gravity ="start"android:fitsSystemWindows ="true"app:headerLayout ="@ layout/nav_header_navigation_drawer"app:menu ="@ menu/activity_navigation_drawer_drawer"/></android.support.v4.widget.DrawerLayout> 

现在在其他片段中设置 TabLayout ViewPager ,然后在 onCreate 方法的此 FrameLayout 中加载该片段 NavigationDrawerActivity

  FragmentManager fm = getSupportFragmentManager();FragmentTransaction tr = fm.beginTransaction();tr.replace(R.id.frame_container,片段);tr.commitAllowingStateLoss(); 

,其中fragment是另一个包含TabLayout和ViewPager的片段.

My MainActivity.xml is as below:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">

<include
    layout="@layout/app_bar_appbar"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<android.support.design.widget.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:fitsSystemWindows="true"
    app:headerLayout="@layout/nav_header_appbar"
    app:menu="@menu/activity_appbar_drawer" />

<android.support.design.widget.CoordinatorLayout 
xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="@dimen/appbar_padding_top"
        android:theme="@style/AppTheme.AppBarOverlay">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:layout_weight="1"
            android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/AppTheme.PopupOverlay"
            app:title="@string/app_name">

        </android.support.v7.widget.Toolbar>

        <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <android.support.design.widget.TabItem
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/tab_text_1" />

            <android.support.design.widget.TabItem
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/tab_text_2" />

            <android.support.design.widget.TabItem
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/tab_text_3" />

        </android.support.design.widget.TabLayout>

   </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" >

    </android.support.v4.view.ViewPager>


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

My intention is to have an appbar with navigation drawer (icon on left), and options menu (icon on right). However, it appears to be stuck underneath the system default. Here is an image showing its preview:

Additionally, my styles.xml is:

<resources>

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>

<style name="AppTheme.NoActionBar" parent="AppTheme">
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
</style>

<style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.AppCompat.Dark.ActionBar" />

<style name="AppTheme.PopupOverlay" parent="ThemeOverlay.AppCompat.Light" />

</resources>

Changing AppCompat.Light.DarkActionBar to NoActionBar has no effect. The appbar with "AppName" just remains above the other appbar (which should show "BEEP" as text, in addition to the two icons for navbar and options menu) - NoActionBar is also defined in the manifest for the activity:

    <activity
        android:name=".MainActivity"
        android:label="BEEP"
        android:theme="@style/AppTheme.NoActionBar">
        <intent-filter>
            <action android:name="android.intent.action.MAIN" />

            <category android:name="android.intent.category.LAUNCHER" />
        </intent-filter>
    </activity>

Here is the relevant part of the MainActivity.java, if needed:

 @Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(R.layout.activity_main);

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);

    // Create the adapter that will return a fragment for each of the three
    // primary sections of the activity.
    mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());

    // Set up the ViewPager with the sections adapter.
    mViewPager = (ViewPager) findViewById(R.id.container);
    mViewPager.setAdapter(mSectionsPagerAdapter);

    TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);

    mViewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
    tabLayout.addOnTabSelectedListener(new TabLayout.ViewPagerOnTabSelectedListener(mViewPager));

    DrawerLayout drawer = (DrawerLayout) findViewById(R.id.drawer_layout);
   ActionBarDrawerToggle toggle = new ActionBarDrawerToggle(
            this, drawer, toolbar, R.string.navigation_drawer_open, R.string.navigation_drawer_close);
    drawer.addDrawerListener(toggle);
    toggle.syncState();

    NavigationView navigationView = (NavigationView) findViewById(R.id.nav_view);
    navigationView.setNavigationItemSelectedListener(this);
...

So, how can I get the toolbar (ID is "toolbar") to display instead of the default appbar that currently contains the text "AppName" in the above image? I also followed this, however there is no change in the result.

EDIT 1: The following screenshot shows my user-defined appbar appearing underneath the default, for some reason. I have also included my app_bar_appbar.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.design.widget.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:popupTheme="@style/AppTheme.PopupOverlay" />

</android.support.design.widget.AppBarLayout>

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

</android.support.design.widget.CoordinatorLayout>

解决方案

As you are having Theme.AppCompat.Light.DarkActionBar to your Application tag of AndroidManifest all activity will include default actionbar.

Create one more theme in your styles.xml with NoActionBar and apply this to your NavigationDrawerActivity.

i.e.

<style name="navigation_theme" parent="Theme.AppCompat.Light.NoActionBar"/>

Set it to your Navigation Activity

<activity
            android:name=".NavigationDrawerActivity"
            android:label="@string/title_activity_navigation_drawer"
            android:theme="@style/navigationtheme" />

Example of default theme with ActionBar and NavigationDrawerActivity with NoActionBar theme

EDIT

As @Talisman said, it was the issue with the TabLayout and ViewPager of DrawerLayout

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">

    <android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context="com.and.NavigationDrawerActivity">

        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:theme="@style/AppTheme.AppBarOverlay">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="@android:color/holo_blue_light"
                app:popupTheme="@style/AppTheme.PopupOverlay" />

        </android.support.design.widget.AppBarLayout>

        <!--Your content in this FrameLayout-->
        <FrameLayout
            android:id="@+id/container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            tools:context="com.and.NavigationDrawerActivity">

        </FrameLayout>

        <android.support.design.widget.FloatingActionButton
            android:id="@+id/fab"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="bottom|end"
            android:layout_margin="@dimen/fab_margin"
            app:srcCompat="@android:drawable/ic_dialog_email" />

    </android.support.design.widget.CoordinatorLayout>

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header_navigation_drawer"
        app:menu="@menu/activity_navigation_drawer_drawer" />

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

Now Set the TabLayout and ViewPager in other Fragment and Load that fragment in this FrameLayout on onCreate method of NavigationDrawerActivity

 FragmentManager fm = getSupportFragmentManager();
        FragmentTransaction tr = fm.beginTransaction();
        tr.replace(R.id.frame_container, fragment);
        tr.commitAllowingStateLoss();

where fragment is other fragment which contains your TabLayout and ViewPager.

这篇关于系统默认下的Android自定义应用栏的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆