使用自定义视图创建应用标签

时间:2017-01-31 17:04:52

标签: android fragment android-fragmentactivity android-tablayout

enter image description here

我正面临设计此应用程序的问题,带有自定义视图的选项卡,其中两个选项卡可用第一个选项卡有3个元素,每个元素有3个子元素,每个子元素有3个子元素。第二个标签我必须显示带有来自网址的标签的图片。

3 个答案:

答案 0 :(得分:0)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">


    <TabHost
        android:id="@+id/tabHost"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical">

            <TabWidget
                android:id="@android:id/tabs"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

            <FrameLayout
                android:id="@android:id/tabcontent"
                android:layout_width="match_parent"
                android:layout_height="match_parent">

                <RelativeLayout
                    android:id="@+id/first_tab"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical">
                //YOUR FIRST VIEW CREATE OR INCLUDE VIEW
                    <include
                    android:id="@+id/first_tab"
                    layout="@layout/first_tab" />

                </RelativeLayout>

                <RelativeLayout
                    android:id="@+id/secend_tab"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical">

                    //YOUR SECEND VIEW CREATE OR INCLUDE VIEW
                    <include
                    android:id="@+id/secend_tab"
                    layout="@layout/secend_tab" />
                </RelativeLayout>

            </FrameLayout>
        </LinearLayout>
    </TabHost>
</LinearLayout>

和您的活动,对话等中的代码。

    TabHost host = (TabHost) findViewById(R.id.tabHost);
    host.setup();

    //Tab 1
    TabHost.TabSpec spec = host.newTabSpec("firstTab");
    spec.setContent(R.id.first_tab);
    spec.setIndicator("TABE ONE");
    host.addTab(spec);


    //Tab 2
    spec = host.newTabSpec("secendTab");
    spec.setContent(R.id.secend_tab);
    spec.setIndicator("TAB TWO");
    host.addTab(spec);

答案 1 :(得分:0)

这很简单。为您的选项卡构建xml布局。然后给它充气并打电话

    getTabAt(x).setCustomView(View v);

代码如下:

   TextView tabOne = (TextView)LayoutInflater.from(this).inflate(R.layout.custom_tab, null);
   tabOne.setText("ONE");
   tabOne.setCompoundDrawablesWithIntrinsicBounds(0, R.drawable.ic_tab_favourite, 0, 0);
   tabLayout.getTabAt(0).setCustomView(tabOne);

答案 2 :(得分:0)

首先为标签创建tablayout

   <android.support.design.widget.CoordinatorLayout 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.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.v7.widget.Toolbar
            android:id="@+id/toolbar"
            android:layout_width="match_parent"
            android:layout_height="?attr/actionBarSize"
            android:background="?attr/colorPrimary"
            app:layout_scrollFlags="scroll|enterAlways"
            app:popupTheme="@style/ThemeOverlay.AppCompat.Light" />

        <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"/>
    </android.support.design.widget.AppBarLayout>

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

http://www.androidhive.info/2015/09/android-material-design-working-with-tabs/

然后,对于您的第一个标签,您需要expandablelistview

http://www.androidhive.info/2013/07/android-expandable-list-view-tutorial/