如何在Android中的TabLayout上叠加视图?

时间:2016-07-04 09:05:41

标签: android android-view

说明:               我有两个标签。我在工具栏中添加了一个textview。当我点击工具栏上的文本视图时,我打开像Whatsapp这样的视图。当我们通过actionBar点击whatsapp中的剪辑时,它会为用户打开多个选项。这里的想法是一样的。我在我的应用程序中使用了textview而不是clip。

首先,我在我的活动中设置标签。它工作正常。现在我使用自定义库打开视图,如whatsapp ..

  

activity_main.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:fitsSystemWindows="true"
    tools:context="com.millu.whatsappdemo.MainActivity">

    <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" >

            <TextView
                android:id="@+id/action_text"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:gravity="center"
                android:layout_marginLeft="25dp"
                android:layout_marginRight="25dp"
                android:textSize="20sp"
                android:clickable="true"
                android:textColor="#FFFFFF"
                android:text="Text view"
                android:drawableRight="@drawable/ic_up_arrow">
            </TextView>
        </android.support.v7.widget.Toolbar>
        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <android.support.design.widget.TabLayout
                android:id="@+id/tabs"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:tabMode="fixed"
                app:tabGravity="fill"/>
        </FrameLayout>
    </android.support.design.widget.AppBarLayout>
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
        <io.codetail.widget.RevealFrameLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_marginTop="?attr/actionBarSize">

            <LinearLayout
                android:id="@+id/reveal_items"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">

                <org.lucasr.twowayview.TwoWayView
                    android:id="@+id/twoWayView"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:drawSelectorOnTop="false"
                    style="@style/TwoWayView"/>

            </LinearLayout>
        </io.codetail.widget.RevealFrameLayout>
    </FrameLayout>
    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"  />


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

MainActivity.java

public class MainActivity extends AppCompatActivity {

    public TextView action_text;
    public Toolbar toolbar;

    TabLayout tabs;
    ViewPager viewPager;

    List<Fragment> fragmentList;
    List<String> tab_title;

    LinearLayout mRevealView;
    boolean hidden = true;
    TwoWayView twoWayView;

    DayAdapter adapter;
    List<Days> data;

    int[] img_arr = {R.drawable.ic_camera, R.drawable.ic_clip, R.drawable.ic_contact, R.drawable.ic_camera, R.drawable.ic_contact, R.drawable.ic_clip};
    String[] name_Arr = {"Gallery", "Clip", "Contact", "Gallery", "Contact", "Clip"};

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        toolbar = (Toolbar) findViewById(R.id.toolbar);
        setSupportActionBar(toolbar);

        tabs = (TabLayout) findViewById(R.id.tabs);
        viewPager = (ViewPager) findViewById(R.id.viewpager);
        action_text = (TextView) toolbar.findViewById(R.id.action_text);

        fragmentList = new ArrayList<>();
        tab_title = new ArrayList<>();

        tab_title.add("ONE");
        tab_title.add("TWO");
        fragmentList.add(new OneFragment());
        fragmentList.add(new TwoFragment());

        ViewPagerAdapter viewPagerAdapter = new ViewPagerAdapter(getSupportFragmentManager(), fragmentList, tab_title);
        viewPager.setAdapter(viewPagerAdapter);
        viewPager.setCurrentItem(0);
        tabs.setupWithViewPager(viewPager);

        mRevealView = (LinearLayout) findViewById(R.id.reveal_items);
        mRevealView.setVisibility(View.INVISIBLE);
        twoWayView = (TwoWayView) findViewById(R.id.twoWayView);
        data = new ArrayList<>();

        for (int i = 0; i < name_Arr.length; i++) {
            Days d = new Days(img_arr[i], name_Arr[i]);
            data.add(d);
        }
        adapter = new DayAdapter(getApplicationContext(), data);
        twoWayView.setAdapter(adapter);

        action_text.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                Toast.makeText(MainActivity.this, "CLICKED", Toast.LENGTH_SHORT).show();
                adapter.notifyDataSetChanged();
                int cx = (mRevealView.getLeft() + mRevealView.getRight());
//                int cy = (mRevealView.getTop() + mRevealView.getBottom())/2;
                int cy = mRevealView.getTop();

                int radius = Math.max(mRevealView.getWidth(), mRevealView.getHeight());

                if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {
                    SupportAnimator animator =
                            ViewAnimationUtils.createCircularReveal(mRevealView, cx, cy, 0, radius);
                    animator.setInterpolator(new AccelerateDecelerateInterpolator());
                    animator.setDuration(800);

                    SupportAnimator animator_reverse = animator.reverse();

                    if (hidden) {
                        mRevealView.setVisibility(View.VISIBLE);
                        animator.start();
                        hidden = false;
                    } else {
                        animator_reverse.addListener(new SupportAnimator.AnimatorListener() {
                            @Override
                            public void onAnimationStart() {

                            }

                            @Override
                            public void onAnimationEnd() {
                                mRevealView.setVisibility(View.INVISIBLE);
                                hidden = true;

                            }

                            @Override
                            public void onAnimationCancel() {

                            }

                            @Override
                            public void onAnimationRepeat() {

                            }
                        });
                        animator_reverse.start();

                    }
                } else {
                    if (hidden) {
                        Animator anim = android.view.ViewAnimationUtils.createCircularReveal(mRevealView, cx, cy, 0, radius);
                        mRevealView.setVisibility(View.VISIBLE);
                        anim.start();
                        hidden = false;

                    } else {
                        Animator anim = android.view.ViewAnimationUtils.createCircularReveal(mRevealView, cx, cy, radius, 0);
                        anim.addListener(new AnimatorListenerAdapter() {
                            @Override
                            public void onAnimationEnd(Animator animation) {
                                super.onAnimationEnd(animation);
                                mRevealView.setVisibility(View.INVISIBLE);
                                hidden = true;
                            }
                        });
                        anim.start();

                    }
                }

            }
        });


        twoWayView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> adapterView, View view, int i, long l) {
                if (getSupportActionBar() != null) {
                    action_text.setText(data.get(i).getName());
                }
            }
        });
    }

}

在build.gradle中添加这两个依赖项

compile 'com.github.ozodrukh:CircularReveal:1.1.0'
compile 'org.lucasr.twowayview:twowayview:0.1.4'

以上自定义库用于某些动画并打开视图并隐藏视图。

  

截图

enter image description here

在上面的屏幕中,我的画廊,剪辑,联系人等是不可见的,因为它隐藏在标签后面。这就是问题所在。

我想要什么?

当我点击文本视图时,它会在标签上打开。我怎么能这样做。????

提前完成

0 个答案:

没有答案