web-dev-qa-db-ja.com

画面の下部にタブを配置する

画面の下部にタブを配置したい。この目的のために、私は次のコードを持っています：

package info.androidhive.tabsswipe;

import info.androidhive.tabsswipe.adapter.TabsPagerAdapter;
import Android.app.ActionBar;
import Android.app.ActionBar.Tab;
import Android.app.FragmentTransaction;
import Android.os.Bundle;
import Android.support.v4.app.FragmentActivity;
import Android.support.v4.view.ViewPager;

public class MainActivity extends FragmentActivity implements
        ActionBar.TabListener {

    private ViewPager viewPager;
    private TabsPagerAdapter mAdapter;
    private ActionBar actionBar;
    // Tab titles
    private String[] tabs = { "Top Rated", "Games", "Movies" };

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

        // Initilization
        viewPager = (ViewPager) findViewById(R.id.pager);
        actionBar = getActionBar(); 
        mAdapter = new TabsPagerAdapter(getSupportFragmentManager());

        viewPager.setAdapter(mAdapter) ;
        actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
        actionBar.setDisplayShowHomeEnabled(false);
        actionBar.setDisplayShowTitleEnabled(false);

        // Adding Tabs
        for (String tab_name : tabs) {
            actionBar.addTab(actionBar.newTab().setText(tab_name)
                    .setTabListener(this));
        }

        /**
         * on swiping the viewpager make respective tab selected
         * */
        viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {

            @Override
            public void onPageSelected(int position) {
                // on changing the page
                // make respected tab selected
                actionBar.setSelectedNavigationItem(position);
            }

            @Override
            public void onPageScrolled(int arg0, float arg1, int arg2) {
            }

            @Override
            public void onPageScrollStateChanged(int arg0) {
            }
        });
    }

    @Override
    public void onTabReselected(Tab tab, FragmentTransaction ft) {
    }

    @Override
    public void onTabSelected(Tab tab, FragmentTransaction ft) {
        // on tab selected
        // show respected fragment view
        viewPager.setCurrentItem(tab.getPosition());
    }

    @Override
    public void onTabUnselected(Tab tab, FragmentTransaction ft) {
    }

}

このコードによって、私は次のレイアウトを持っています：

package info.androidhive.tabsswipe;

import info.androidhive.tabsswipe.adapter.TabsPagerAdapter;
import Android.app.ActionBar;
import Android.app.ActionBar.Tab;
import Android.app.FragmentTransaction;
import Android.os.Bundle;
import Android.support.v4.app.FragmentActivity;
import Android.support.v4.view.ViewPager;

public class MainActivity extends FragmentActivity implements
        ActionBar.TabListener {

    private ViewPager viewPager;
    private TabsPagerAdapter mAdapter;
    private ActionBar actionBar;
    // Tab titles
    private String[] tabs = { "Top Rated", "Games", "Movies" };

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

        // Initilization
        viewPager = (ViewPager) findViewById(R.id.pager);
        actionBar = getActionBar(); 
        mAdapter = new TabsPagerAdapter(getSupportFragmentManager());

        viewPager.setAdapter(mAdapter) ;
        actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
        actionBar.setDisplayShowHomeEnabled(false);
        actionBar.setDisplayShowTitleEnabled(false);

        // Adding Tabs
        for (String tab_name : tabs) {
            actionBar.addTab(actionBar.newTab().setText(tab_name)
                    .setTabListener(this));
        }

        /**
         * on swiping the viewpager make respective tab selected
         * */
        viewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() {

            @Override
            public void onPageSelected(int position) {
                // on changing the page
                // make respected tab selected
                actionBar.setSelectedNavigationItem(position);
            }

            @Override
            public void onPageScrolled(int arg0, float arg1, int arg2) {
            }

            @Override
            public void onPageScrollStateChanged(int arg0) {
            }
        });
    }

    @Override
    public void onTabReselected(Tab tab, FragmentTransaction ft) {
    }

    @Override
    public void onTabSelected(Tab tab, FragmentTransaction ft) {
        // on tab selected
        // show respected fragment view
        viewPager.setCurrentItem(tab.getPosition());
    }

    @Override
    public void onTabUnselected(Tab tab, FragmentTransaction ft) {
    }

}

このコードにより、コンパイル後の画面は次のようになります。

enter image description here

画面の下部にタブを配置するにはどうすればよいですか？

javaandroidandroid-fragmentsandroid-tabs
15
osimer pothe

これらのサンプルxmlコードは、タブを画面の下部に移動することを定義しています。

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

    <TabHost
        Android:id="@Android:id/tabhost"
        Android:layout_width="fill_parent"
        Android:layout_height="fill_parent" >

        <RelativeLayout
            Android:layout_width="fill_parent"
            Android:layout_height="fill_parent" >

            <FrameLayout
                Android:id="@Android:id/tabcontent"
                Android:layout_width="fill_parent"
                Android:layout_height="fill_parent"
                Android:layout_below="@Android:id/tabs" >

                <FrameLayout
                    Android:id="@+id/tab_home"
                    Android:layout_width="fill_parent"
                    Android:layout_height="fill_parent" />

                <FrameLayout
                    Android:id="@+id/tab_video"
                    Android:layout_width="fill_parent"
                    Android:layout_height="fill_parent" />

                <FrameLayout
                    Android:id="@+id/tab_audio"
                    Android:layout_width="fill_parent"
                    Android:layout_height="fill_parent" >
                </FrameLayout>

                <FrameLayout
                    Android:id="@+id/tab_blog"
                    Android:layout_width="fill_parent"
                    Android:layout_height="fill_parent" >
                </FrameLayout>

                <FrameLayout
                    Android:id="@+id/tab_gal"
                    Android:layout_width="fill_parent"
                    Android:layout_height="fill_parent" >
                </FrameLayout>

                <FrameLayout
                    Android:id="@+id/tab_more"
                    Android:layout_width="fill_parent"
                    Android:layout_height="fill_parent" >
                </FrameLayout>
            </FrameLayout>

            <TabWidget
                Android:id="@Android:id/tabs"
                Android:layout_width="fill_parent"
                Android:layout_height="wrap_content"
                Android:layout_alignParentBottom="true"  //align parent bottom mainly used for move the tab to bottom of the screen.
                Android:background="@drawable/ic_launcher"
                Android:divider="@null" />

            <!-- Android:background="#d8e49c" -->
        </RelativeLayout>
    </TabHost>

</LinearLayout>
7
Stephen

実際には、Androidデザインガイドラインに反しています。下部に戻るボタンのホームボタンなどのソフト/ハードボタンがあるためです。

http://developer.Android.com/design/patterns/pure-Android.html

しかし、それらを一番下に置くように主張する場合は、GitHubの例がFragmentTabHostを使用して一番下にタブを構成するように実装できます。

https://github.com/rameshkec85/BottomTabsFragmentTabHost

15
Priyank Patel

Androidアプリは次のように見えるはずです。アクションバーを使用すると、上部にのみタブを追加できます。下部にタブを配置することは、純粋にiOSスタイルです。同じ外観を実現したい：

これ 。 Githubソースが見つかります ここ

2
Rat-a-tat-a-tat Ratatouille

もう1つの解決策： https://stackoverflow.com/a/23150258/2765497 サポートapi <11の場合は、TabViewをFragmentTabVeiwに置き換え、Sherlock of Supportライブラリから別のインポートを追加します

0
Flinbor

これを行わないでください。タブは常にAndroidの一番上にある必要があります。

0
Mark Buikema