【问题标题】:Android fragment tab host + viewpager swipe?Android片段标签主机+ viewpager滑动?
【发布时间】:2014-10-15 11:50:05
【问题描述】:

我目前有一个片段选项卡主机,由本教程制作 http://maxalley.wordpress.com/2013/05/18/android-creating-a-tab-layout-with-fragmenttabhost-and-fragments/

唯一的区别是我在片段中使用它。 所以我有一个带有标签的片段,每个标签都有另一个片段..

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

    <TabWidget
        android:id="@android:id/tabs"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom" />

    <FrameLayout
        android:id="@android:id/tabcontent"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />


</LinearLayout>

片段类

public class AddServiceFragment extends Fragment {




    public AddServiceFragment() {
        // Required empty public constructor
    }

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


    }


    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

        View view = inflater.inflate(R.layout.fragment_add_service, container, false);
        FragmentTabHost mTabHost = (FragmentTabHost) view.findViewById(android.R.id.tabhost);
        mTabHost.setup(getActivity(), getChildFragmentManager(), android.R.id.tabcontent);


        String[] tabs = new String[]{"text1", "text2"};
        mTabHost.addTab(
                mTabHost.newTabSpec("tab1").setIndicator(tabs[0], null),
                MedicalHistoryFragment.class, null);


        mTabHost.addTab(
                mTabHost.newTabSpec("tab2").setIndicator(tabs[1], null),
                MedicalHistoryFragment.class, null);

            return view;
    }

这行得通,我可以看到我的标签。 现在我想实现一个viewpager,以便能够向左或向右滑动。

我从 android 开发者页面读到了这篇文章 http://developer.android.com/training/animation/screen-slide.html

但我不知道,我应该把我的浏览器放在哪里? 我希望我的片段独立于我的活动...

【问题讨论】:

    标签: android fragment swipe


    【解决方案1】:

    TabHost 不提供 ViewPager 支持。
    另外,我建议您不要使用 TabHost - 这是旧样式。
    使用PagerTabStrip

    看看这个Gist

    统一更新: 我添加了一些代码,以防万一,如果这个 Gist 被删除;

    MainActivity.java

    package ch.pboos.android.sample.viewpager;
    
    import android.os.Bundle;
    import android.support.v4.app.Fragment;
    import android.support.v4.app.FragmentActivity;
    import android.support.v4.app.FragmentPagerAdapter;
    import android.support.v4.view.ViewPager;
    import android.view.LayoutInflater;
    import android.view.View;
    import android.view.ViewGroup;
    import android.widget.TextView;
    
    public class MainActivity extends FragmentActivity {
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
            viewPager.setAdapter(new SampleFragmentPagerAdapter());
        }
    
        public class SampleFragmentPagerAdapter extends FragmentPagerAdapter {
            final int PAGE_COUNT = 5;
    
            public SampleFragmentPagerAdapter() {
                super(getSupportFragmentManager());
            }
    
            @Override
            public int getCount() {
                return PAGE_COUNT;
            }
    
            @Override
            public Fragment getItem(int position) {
                return PageFragment.create(position + 1);
            }
        }
    
        public static class PageFragment extends Fragment {
            public static final String ARG_PAGE = "ARG_PAGE";
    
            private int mPage;
    
            public static PageFragment create(int page) {
                Bundle args = new Bundle();
                args.putInt(ARG_PAGE, page);
                PageFragment fragment = new PageFragment();
                fragment.setArguments(args);
                return fragment;
            }
    
            @Override
            public void onCreate(Bundle savedInstanceState) {
                super.onCreate(savedInstanceState);
                mPage = getArguments().getInt(ARG_PAGE);
            }
    
            @Override
            public View onCreateView(LayoutInflater inflater, ViewGroup container,
                    Bundle savedInstanceState) {
                View view = inflater.inflate(R.layout.fragment_page, container, false);
                TextView textView = (TextView) view;
                textView.setText("Fragment #" + mPage);
                return view;
            }
        }
    }
    

    activity_main.xml(没有 PagerTabStrip)

    <?xml version="1.0" encoding="utf-8"?>
    <android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    </android.support.v4.view.ViewPager>
    

    activity_main_2.xml(带有 PagerTabStrip)

    <?xml version="1.0" encoding="utf-8"?>
    <android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    
        <android.support.v4.view.PagerTabStrip
            android:id="@+id/pager_header"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="top"
            android:background="#000"
            android:paddingBottom="4dp"
            android:paddingTop="4dp"
            android:textColor="#fff" />
    
    </android.support.v4.view.ViewPager>
    

    fragment_page.xml

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

    获取页面标题

    public CharSequence getPageTitle(int position) {
        return "Page " + (position + 1);
    }
    

    UPD 2 带片段:

    public class MainFragment extends Fragment{
    
        @Override
        public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
            return inflater.inflate(R.layout.activity_main_2, container, false);
        }
    
        @Override
        public void onActivityCreated(Bundle savedInstanceState) {
            super.onActivityCreated(savedInstanceState);
    
            ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
            viewPager.setAdapter(new SampleFragmentPagerAdapter());
        }
    
        public class SampleFragmentPagerAdapter extends FragmentPagerAdapter {
            final int PAGE_COUNT = 5;
    
            public SampleFragmentPagerAdapter() {
                super(getSupportFragmentManager());
            }
    
            @Override
            public int getCount() {
                return PAGE_COUNT;
            }
    
            @Override
            public Fragment getItem(int position) {
                return PageFragment.create(position + 1);
            }
        }
    
        public static class PageFragment extends Fragment {
            public static final String ARG_PAGE = "ARG_PAGE";
    
            private int mPage;
    
            public static PageFragment create(int page) {
                Bundle args = new Bundle();
                args.putInt(ARG_PAGE, page);
                PageFragment fragment = new PageFragment();
                fragment.setArguments(args);
                return fragment;
            }
    
            @Override
            public void onCreate(Bundle savedInstanceState) {
                super.onCreate(savedInstanceState);
                mPage = getArguments().getInt(ARG_PAGE);
            }
    
            @Override
            public View onCreateView(LayoutInflater inflater, ViewGroup container,
                    Bundle savedInstanceState) {
                View view = inflater.inflate(R.layout.fragment_page, container, false);
                TextView textView = (TextView) view;
                textView.setText("Fragment #" + mPage);
                return view;
            }
        }
    }
    

    希望对你有帮助

    【讨论】:

    • 在这种情况下,Activity 和 Fragment 之间没有太大区别。只是改为#onCreate() 方法,您应该实现#onCreateView() 以从布局资源和#onActivityCreated() (或onViewCreated()) 初始化一些视图。我用代码 sn-p 编辑了我的问题,说明它是如何实现的。请检查一下。
    • 你能告诉我你从哪里知道 TabHost 是老式的吗?我已经整天都在搜索这个主题(带有片段的标签),这非常痛苦。开发人员文档告诉您有关用于滑动的 ViewPager、关于使用 ActionBar 选项卡、AndroidStudio 后者已被弃用并在 UI 设计器中提供 TabHost(除了 SO 等所有或多或少被黑客入侵的解决方案)。为什么所有这些类都可以在没有任何文档的情况下存在?谁能期望大多数应用程序实现一个不被弃用且正确的接口?抱歉,最后的问题当然是反问。
    • @TiBo TabHost 是老式的,因为它没有滑动功能。幻灯片上的更改选项卡是一个很好的用户体验,在许多应用程序中使用,所以它很常见。当用户看到标签时,他希望他可以通过滑动来更改标签。我应该说, TabHost 没有被弃用,但我认为最好使用更新的替代品。 |||哪些类没有任何文档存在?
    • 我的意思是在培训或指南部分中解释它们的方式的文档......是否也可以启用经典的 TabHost 样式?
    • 我不明白你在抱怨什么。标签的旧样式文档:developer.android.com/design/building-blocks/tabs.html,新材料样式文档:google.com/design/spec/components/tabs.html#tabs-usage。而且我不明白什么是“经典 TabHost 风格”。为什么你需要一些“经典”风格,而不是新材料(或至少是全息)风格
    【解决方案2】:

    使用下面的解决方案,我已经把视图页面放在下面......我的工作已经完成......

    <RelativeLayout 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"
        tools:context=".MainActivity" >
    
    <TabHost
        android:id="@android:id/tabhost"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content" >
    
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical" >
    
            <TabWidget
                android:id="@android:id/tabs"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_weight="0"
                android:orientation="horizontal" />
    
            <FrameLayout
                android:id="@android:id/tabcontent"
                android:layout_width="0dp"
                android:layout_height="0dp"
                android:layout_weight="0" />
    
            <android.support.v4.view.ViewPager
                android:id="@+id/viewpager"
                android:layout_width="fill_parent"
                android:layout_height="wrap_content"
                android:layout_gravity="bottom"
                android:overScrollMode="never" />
        </LinearLayout>
    </TabHost>
    

    【讨论】:

    • 我认为他希望 TabHost+ViewPager 一起“工作”,但不只是将 ViewPager 放在 TabHost 中的某个位置。
    • 他不确定将 viewpager 放在标签主机的哪个位置。这就是为什么我在我的项目中实现了这个代码并且它运行良好..
    • @ArpitPatel 你是如何实现它的?你能展示一些样品吗?
    • @ArpitPatel 你能展示一下它的实现代码还是一点想法
    • 其实这是现在很老的风格了。来自here的用户资料标签。
    【解决方案3】:

    您可以将 viewpager 实现为库。

    首先需要将 viewpager 项目导入 Eclipse 工作区。 [我认为您正在修改项目:Tabhost示例]

    所以右键单击您的 Tabhost 示例项目然后构建路径 -> 配置构建路径.. 然后单击 Android ...当您单击 android 时,您可以看到 2 部分项目构建目标和库。所以在库中您可以添加 viewpager 库。

    【讨论】:

    • 不,对不起,你的回答错了,顺便我用的是Android Studio。
    • 您只能通过 maven 包含它。因此,如果您需要在 android studio 中添加库文件夹并将其包含在 app.gradle.file 中。 library.gradle:- dependencies { compile 'com.android.support:support-v4:19.+' compile fileTree(dir: 'libs', include: ['*.jar']) }
    【解决方案4】:

    为了将 viewpager 库包含到项目中,您应该导入该库
    “现有项目”到您当前的项目。

    第 1 步:-从 GitHub 下载源代码。(https://github.com/JakeWharton/Android-ViewPagerIndicator)

    Step2 :-在您的 Android Studio 项目中: 文件 -> 项目结构 -> 添加(+ 符号) -> 导入现有项目。只导入名为“library”的文件夹,而不是整个项目(按照 Android Studio 的建议保留导入选项)。

    步骤3:-如果你的build.gradle中指定的“compileSdkVersion”与Android-ViewPagerIndicator项目中指定的不匹配,则更改第二个。 这同样适用于任何其他属性,例如“minSdkVersion”甚至当前的支持库。

    第 4 步:-将 Android-ViewPagerIndicator 项目作为依赖项添加到您的 build.gradle 模块: 依赖{ 编译项目(':库') }

    第 5 步:- 将项目与 gradle 文件同步。

    【讨论】:

      猜你喜欢
      • 2013-08-04
      • 1970-01-01
      • 1970-01-01
      • 2012-11-17
      • 1970-01-01
      • 1970-01-01
      • 2013-12-23
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多