Menu Tabs Don't Respond

Question

Currently I'm making UI for my app. I use Sliding Up Panel and Sliding Tabs (tutorial with implementation explanation) features. Both work fine. I even managed to implement them in one project, but that's where problem comes in - Home and Event's tabs are unresponsive when I touch them(should open the page it's representing), but they change when I slide between tabs.

Here's my layout code. This is where the problem is. I'm sure of it.

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

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

 <com.sothree.slidinguppanel.SlidingUpPanelLayout
    xmlns:sothree="http://schemas.android.com/apk/res-auto"
    android:id="@+id/sliding_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="bottom"
    sothree:umanoPanelHeight="68dp"
    sothree:umanoShadowHeight="4dp"
    sothree:umanoParalaxOffset="100dp"
    sothree:umanoDragView="@+id/dragView">

      <!-- MAIN CONTENT -->
    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:background="#ff0000">
        <com.ui.test.SlidingTabLayout
    android:id="@+id/tabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"

    android:background="@color/ColorPrimary"/>

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

      <!-- SLIDING LAYOUT -->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#55eeeeee"
        android:orientation="vertical"
        android:clickable="true"
        android:focusable="false"
        android:id="@+id/dragView">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="68dp"
            android:orientation="horizontal">

            <TextView
                android:id="@+id/name"
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:layout_weight="1"
                android:textSize="14sp"
                android:gravity="center_vertical"
                android:paddingLeft="10dp"/>

            <Button
                android:id="@+id/follow"
                android:layout_width="wrap_content"
                android:layout_height="match_parent"
                android:textSize="14sp"
                android:gravity="center_vertical|right"
                android:paddingRight="10dp"
                android:paddingLeft="10dp"/>

        </LinearLayout>

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:layout_weight="1"
            android:scaleType="fitStart"
            android:src="@drawable/daimage" >
        </ImageView>
    </LinearLayout>
</com.sothree.slidinguppanel.SlidingUpPanelLayout>

If I remove part that adds Sliding Up Panel features, clicking function enables.

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

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


        <com.ui.test.SlidingTabLayout
    android:id="@+id/tabs"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"

    android:background="@color/ColorPrimary"/>

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

MainActivity.java

public class MainActivity extends ActionBarActivity implements OnTouchListener{

    // Declaring Your View and Variables

    Toolbar toolbar;
    ViewPager pager;
    ViewPagerAdapter adapter;
    SlidingTabLayout tabs;
    CharSequence Titles[]={"Side","Front", "Result"};
    int Numboftabs =3;

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

        setContentView(R.layout.activity_main);


        // Creating The Toolbar and setting it as the Toolbar for the activity

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


        // Creating The ViewPagerAdapter and Passing Fragment Manager, Titles fot the Tabs and Number Of Tabs.
        adapter =  new ViewPagerAdapter(getSupportFragmentManager(),Titles,Numboftabs);

        // Assigning ViewPager View and setting the adapter
        pager = (ViewPager) findViewById(R.id.pager);
        pager.setAdapter(adapter);

        // Assiging the Sliding Tab Layout View
        tabs = (SlidingTabLayout) findViewById(R.id.tabs);
        tabs.setDistributeEvenly(true); // To make the Tabs Fixed set this true, This makes the tabs Space Evenly in Available width



        // Setting Custom Color for the Scroll bar indicator of the Tab View
        tabs.setCustomTabColorizer(new SlidingTabLayout.TabColorizer() {
            @Override
            public int getIndicatorColor(int position) {
                return getResources().getColor(R.color.tabsScrollColor);
            }
        });



        // Setting the ViewPager For the SlidingTabsLayout
        tabs.setViewPager(pager);

        tabs.setOnTouchListener(new View.OnTouchListener() {
            @Override
            public boolean onTouch(View v, MotionEvent event) {
                v.getParent().requestDisallowInterceptTouchEvent(false);
                return false;
            }   
        });




    }




    @Override
    public boolean onCreateOptionsMenu(Menu menu) {
        // Inflate the menu; this adds items to the action bar if it is present.
        getMenuInflater().inflate(R.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 boolean onTouch(View v, MotionEvent event) {
    // TODO Auto-generated method stub
    return false;
}


}

Answer 1

Building up on Amy's answer here, assuming the slidingUpPanel is blocking the onTouch for the tab buttons, then you can use the onTouch eventlistener to disallow parent layout to intercept any touch events like this

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


    // Creating The Toolbar and setting it as the Toolbar for the activity

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


    // Creating The ViewPagerAdapter and Passing Fragment Manager, Titles fot the Tabs and Number Of Tabs.
    adapter =  new ViewPagerAdapter(getSupportFragmentManager(),Titles,Numboftabs);

    // Assigning ViewPager View and setting the adapter
    pager = (ViewPager) findViewById(R.id.pager);
    pager.setAdapter(adapter);

    // Assiging the Sliding Tab Layout View
    tabs = (SlidingTabLayout) findViewById(R.id.tabs);
    tabs.setDistributeEvenly(true); // To make the Tabs Fixed set this true, This makes the tabs Space Evenly in Available width



    // Setting Custom Color for the Scroll bar indicator of the Tab View
    tabs.setCustomTabColorizer(new SlidingTabLayout.TabColorizer() {
        @Override
        public int getIndicatorColor(int position) {
            return getResources().getColor(R.color.tabsScrollColor);
        }
    });



    // Setting the ViewPager For the SlidingTabsLayout
    tabs.setViewPager(pager);

    // THIS PART, ADD CODE HERE !
    tabs.setOnTouchListener(new View.OnTouchListener() {
        @Override
        public boolean onTouch(View v, MotionEvent event) {
        v.getParent().requestDisallowInterceptTouchEvent(false);
        return false;
        }
    });

}

EDIT 1:

the sliding up panel is like an overlay on top of its children, so if you keep the tab layout in the children, the sliding up panel's strip view will come right on top of your tab strip, and this sliding up panel's strip will stop the tab strip from recieving any click or touch events, so when you are actually trying to touch or click the tabs you are not actually touching/clicking on the tabs because sliding up panel is on top of it. what you need to do is put the slidingtablayout outside the slidinguppanel layout

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

    <include
        android:id="@+id/tool_bar"
        layout="@layout/tool_bar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        />
    <!--this is outside sliding up panel layout-->
    <com.example.www.slidinguppanelapp.SlidingTabLayout
        android:id="@+id/tabs"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"

        android:background="#f0f0f0"/>
    <com.sothree.slidinguppanel.SlidingUpPanelLayout
        android:id="@+id/sliding_layout"
        xmlns:sothree="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="bottom"
        sothree:umanoDragView="@+id/dragView"
        sothree:umanoPanelHeight="68dp"
        sothree:umanoShadowHeight="4dp">

        <!-- MAIN CONTENT -->
        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#ff0000"
            android:orientation="vertical">

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

        <!-- SLIDING LAYOUT -->
        <LinearLayout
            android:id="@+id/dragView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#55eeeeee"
            android:clickable="true"
            android:focusable="false"
            android:orientation="vertical">

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="68dp"
                android:orientation="horizontal">

                <TextView
                    android:id="@+id/name"
                    android:layout_width="0dp"
                    android:layout_height="match_parent"
                    android:layout_weight="1"
                    android:gravity="center_vertical"
                    android:paddingLeft="10dp"
                    android:textSize="14sp"/>

                <Button
                    android:id="@+id/follow"
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:gravity="center_vertical|right"
                    android:paddingLeft="10dp"
                    android:paddingRight="10dp"
                    android:textSize="14sp"/>

            </LinearLayout>

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="0dp"
                android:layout_weight="1"
                android:scaleType="fitStart"
                android:src="@drawable/blur_bg">
            </ImageView>
        </LinearLayout>
    </com.sothree.slidinguppanel.SlidingUpPanelLayout>
</LinearLayout>

Answer 2

From the documentation:

By default, the whole panel will act as a drag region and will intercept clicks and drag events. You can restrict the drag area to a specific view by using the setDragView method or umanoDragView attribute.

So I assume, that the Sliding Up Panel consumes your onClick on your Tabs - simply set the attributes as the documentation suggests.