Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Creating custom tabhost like in chrome browser for Android

I want to create custom tabhost for browser like tabs. I am confused about how to apply it for a layout like in chrome browser tab as in the image.

enter image description here

Here is what I have tried. I want to know how to create that edges with slope as in the image.

tab_selected.xml

<item>
    <shape android:shape="rectangle" >
        <solid android:color="#DCDCDC" />

        <corners
            android:topLeftRadius="5dp"
            android:topRightRadius="5dp" />
    </shape>
</item>
<item
    android:bottom="2dp"
    android:left="1dp"
    android:right="1dp"
    android:top="1dp">
    <shape android:shape="rectangle" >
        <solid android:color="#DCDCDC" />
        <corners
            android:topLeftRadius="10dp"
            android:topRightRadius="10dp" />
    </shape>
</item>

tab_unselected.xml

<item android:top="10dp">
    <shape android:shape="rectangle" >
        <solid android:color="#AAAAAA" />
    </shape>
</item>
<item android:bottom="2dp">
    <shape android:shape="rectangle" >
        <solid android:color="#AAAAAA" />

        <corners
            android:topLeftRadius="10dp"
            android:topRightRadius="10dp" />

    </shape>
</item>

I hope it can be done using Pathshape in XML. Can anyone point me out for a reference? Unable find a reference on PathShape

like image 238
intrepidkarthi Avatar asked Apr 16 '13 13:04

intrepidkarthi


People also ask

What is a Chrome Custom Tab?

Custom Tabs is a browser feature, introduced by Chrome, that is now supported by most major browsers on Android. It gives apps more control over their web experience, and makes transitions between native and web content more seamless without having to resort to a WebView.


1 Answers

put you page in a FrameLayout and also a hashmap(with their specific names). then you can change tab like this

  FrameLayout fl =new FrameLayout(context);
  HashMap<String,LinearLayout> tabs =new HashMap<String,LinearLayout>(); 

  LinearLayout tab =new LinearLayout(context);
  fl.addView(tab);
  tabs.put("home",tab);

  tab =new LinearLayout(context);
  fl.addView(tab);
  tabs.put("events",tab);



private void changeTab(String tabKey) {
    for (java.util.Map.Entry<String, LinearLayout> e : tabs.entrySet()) {
        if (e.getKey().compareTo(key) == 0) {
            e.getValue().setVisibility(View.VISIBLE);
        } else {
            e.getValue().setVisibility(View.INVISIBLE);
        }
    }
 }


 use this to change tab:

  changeTab("home");

NOTE: you must set fl as contentview of activity or add it another view and set it as contentview

like image 81
bmavus Avatar answered Sep 20 '22 06:09

bmavus