材料设计固定标签没有工具栏

时间:2015-03-02 09:17:34

标签: tabs android-actionbar toolbar material-design

我有一个小问题,找出一个" bug"在我的代码中。我不确定它是不是一个bug。但是,如图1所示,固定标签'窗帘抽屉后面的位置。我无法找到/理解为什么会这样。我已经按照几个教程,他们似乎没有同样的问题。 我试图谷歌,但我找不到类似的问题。以前有人经历过类似的事吗?

在Android工作室中,设计布局似乎有点关键,但是,编译时并非如此。

我正在使用neokree lib,所以我可以在选择标签时使用图标和涟漪效果。我尝试使用Google的标签布局link here,但只要我尝试删除操作栏并应用图标,就会出现同样的问题。

谢谢!

activity_main

<?xml version="1.0" encoding="utf-8" ?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<it.neokree.materialtabs.MaterialTabHost
    android:id="@+id/materialTabHost"
    android:layout_width="match_parent"
    android:layout_height="48dp"
    app:iconColor="@color/iconColor"
    app:primaryColor="@color/primaryColor"
    app:accentColor="@color/accentColor"
    app:hasIcons="true"/>

<android.support.v4.view.ViewPager
    android:id="@+id/viewPager"
    android:layout_width="match_parent"
    android:layout_height="0px"
    android:layout_weight="1"/>


</LinearLayout>

styles.xml

<resources>  
    <style name="AppTheme" parent="AppTheme.Base"></style>

    <style name="AppTheme.Base" parent="Theme.AppCompat.NoActionBar">

        <item name="colorPrimary">@color/primaryColor</item>
        <item name="colorPrimaryDark">@color/primaryColorDark</item>
        <item name="colorAccent">@color/accentColor</item>
        <item name="colorControlHighlight">@color/colorHighlight</item>

    </style>
</resources>

styles.xml v21

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <!-- Base application theme. -->

    <!--Using same style as in default style.xml file-->
    <style name="AppTheme" parent="AppTheme.Base">
        <item name="android:colorPrimary">@color/primaryColor</item>
        <item name="android:colorPrimaryDark">@color/primaryColorDark</item>
        <item name="android:colorAccent">@color/accentColor</item>
        <item name="android:windowTranslucentStatus">true</item>
        <item name="android:colorControlHighlight">@color/colorHighlight</item>
    </style>

</resources>

MainActivity

import android.graphics.drawable.Drawable;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.app.FragmentStatePagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.ActionBarActivity;
import android.os.Bundle;
import android.text.SpannableString;
import android.text.Spanned;
import android.text.style.ImageSpan;
import android.view.LayoutInflater;
import android.view.Menu;
import android.view.MenuItem;
import android.support.v7.widget.Toolbar;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import it.neokree.materialtabs.MaterialTab;
import it.neokree.materialtabs.MaterialTabHost;
import it.neokree.materialtabs.MaterialTabListener;


public class MainActivity extends ActionBarActivity implements MaterialTabListener
{

    private Toolbar toolbar;
    private ViewPager mPager;
    private SlidingTabLayout mTabs;

    private MaterialTabHost tabHost;
    private ViewPager viewPager;


    @Override
    protected void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        tabHost = (MaterialTabHost) findViewById(R.id.materialTabHost);
        viewPager = (ViewPager) findViewById(R.id.viewPager);

        ViewPagerAdapter adapter = new ViewPagerAdapter(getSupportFragmentManager());
        viewPager.setAdapter(adapter);
        viewPager.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() {
            @Override
            public void onPageSelected(int position) {
                tabHost.setSelectedNavigationItem(position);

            }
        });
        for (int i = 0; i < adapter.getCount(); i++) {
            tabHost.addTab(
                    tabHost.newTab()
                            .setIcon(adapter.getIcon(i))
                            .setTabListener(this));
        }

    }

    @Override
    public boolean onCreateOptionsMenu(Menu menu)
    {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.menu.menu_main, menu);
        return true;
    }

    @Override
    public boolean onOptionsItemSelected(MenuItem item)
    {
        // Handle action bar item clicks here. The action bar will
        // automatically handle clicks on the Home/Up button, so long
        // as you specify a parent activity in AndroidManifest.xml.
        int id = item.getItemId();

        //noinspection SimplifiableIfStatement
        if (id == R.id.action_settings)
        {
            return true;
        }

        return super.onOptionsItemSelected(item);
    }

    @Override
    public void onTabSelected(MaterialTab materialTab) {
        viewPager.setCurrentItem(materialTab.getPosition());
    }

    @Override
    public void onTabReselected(MaterialTab materialTab) {

    }

    @Override
    public void onTabUnselected(MaterialTab materialTab) {

    }

    class ViewPagerAdapter extends FragmentStatePagerAdapter
    {

        int icons[] = {R.drawable.ic_home,
                R.drawable.ic_graph,
                R.drawable.ic_bell_mid,
                R.drawable.ic_settings};

        //String[] tabText = getResources().getStringArray(R.array.tabs);

        public ViewPagerAdapter(FragmentManager fm)
        {
            super(fm);
            //tabText = getResources().getStringArray(R.array.tabs);
        }

        @Override
        public Fragment getItem(int position)
        {
            MyFragment myFragment = MyFragment.getInstance(position);
            return myFragment;
        }

        //Attaching an image to a (spannable) string so we can show the image instead of text.
        @Override
        public CharSequence getPageTitle(int position){
            /*Drawable drawable = getResources().getDrawable(icons[position]);
            //icon bounds/size
            drawable.setBounds(0,0,96,96);
            ImageSpan imageSpan = new ImageSpan(drawable);
            SpannableString spannableString = new SpannableString(" ");
            spannableString.setSpan(imageSpan, 0, spannableString.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);
            return spannableString;*/
            return getResources().getStringArray(R.array.tabs)[position];
        }

        @Override
        public int getCount()
        {
            return 4;
        }

        private Drawable getIcon(int position)
        {
            return getResources().getDrawable(icons[position]);
        }
    }
}

tabLayout activity_main layout

2 个答案:

答案 0 :(得分:0)

在意外地完成了关于制作简单材料设计选项卡的youtube教程后,我创建了一个新项目并开始将我在youtube中找到的项目与旧项目相结合。最后,我发现样式文件中的以下代码行是导致问题的原因。

<item name="android:windowTranslucentStatus">true</item> 

似乎这是我为测试添加的内容,但稍后忘记删除。

答案 1 :(得分:0)

尝试添加一个没有操作栏主题的工具栏。

为了做到这一点,你必须创建一个名为tool_bar.xml的新xml文件,并将以下代码粘贴到其中:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.Toolbar
   android:layout_height="wrap_content"
   android:layout_width="match_parent"
   android:background="@color/ColorPrimary"
   android:elevation="2dp"
   android:theme="@style/Theme.AppCompat.NoActionBar"
   xmlns:android="http://schemas.android.com/apk/res/android" />

然后将其添加到您的activity_main.xml文件中:

<include
    android:id="@+id/tool_bar"
    layout="@layout/tool_bar"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    />