Android碎片标签主机+ viewpager刷卡?

时间:2022-09-13 20:52:54

I currently have a fragment tab host, made by this tutorial http://maxalley.wordpress.com/2013/05/18/android-creating-a-tab-layout-with-fragmenttabhost-and-fragments/

我目前有一个fragmenttabhost,由本教程http://maxalley.wordpress.com/2013/05/18/android-creating-a-tab-layout-with-fragmenttabhost-和fragments/制作

The only difference is that I'm using this inside a fragment. So I have a fragment with the tabs, each tab has another fragment..

唯一的区别是我在一个片段中使用了这个。我有一个带有标签的片段,每个标签都有另一个片段。

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

The fragment class

片段类

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

This works, I can see my tabs. Now I want to implement a viewpager, in order to be able to swipe left or right.

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

I've read this from the android developer page http://developer.android.com/training/animation/screen-slide.html

我已经在android开发者页面http://developer.android.com/training/animation/screen-slide.html上看到过

But I can't figure out, where should I put my viewpager? I want my fragment to be independent of my activity...

但是我不知道,我应该把我的viewpager放在哪里?我希望我的片段独立于我的活动……

4 个解决方案

#1


11  

TabHost doesn't provide ViewPager support.
Also, I suggest you to not use TabHost – this is old style.
Use PagerTabStrip

TabHost不提供ViewPager支持。另外,我建议您不要使用TabHost——这是老式的。使用PagerTabStrip

Look this Gist.

看这一要点。

UPD: I add some code, for case, if this Gist be deleted;

UPD:我添加了一些代码,如果这个要点被删除;

MainActivity.java

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 (without PagerTabStrip)

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 (with PagerTabStrip)

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

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

getPageTitle

getPageTitle

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

UPD 2 With Fragment:

乌利希期刊指南与片段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;
        }
    }
}

Hope it helps

希望它能帮助

#2


1  

use the following solution i have put the view page like below.. and my work done..

使用下面的解决方案,我将视图页面如下所示。和我的工作。

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

#3


0  

You can implement the viewpager as a library.

您可以将viewpager实现为库。

First thing you need to import viewpager project to the eclipse workspace. [ I think you are modifying the project :Tabhost example]

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

so right click your Tabhost example project thn build path -> configure build path.. thn click Android ...when you click android you can see 2 section Project build Target & Library.So in Library you can add the viewpager Library.

因此,右键单击您的Tabhost示例项目thn构建路径—>配置构建路径。而不是点击安卓…当你点击android时,你可以看到2部分项目构建目标和库。在库中可以添加viewpager库。

#4


0  

Inorder to include viewpager library to the project ,you should import the library
"Existing Project” to your current one.

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

Step 1:-Download source code from GitHub.(https://github.com/JakeWharton/Android-ViewPagerIndicator)

第一步:-从GitHub上下载源代码。

Step2 :-In your Android Studio Project: File -> Project Structure -> add (+ symbol) -> Import Existing Project. Import just the folder called ”library”, not the entire project (leave the import options as Android Studio suggests).

步骤2:在您的Android Studio项目中:File ->项目结构-> add (+ symbol) ->导入现有项目。只导入名为“library”的文件夹,而不是整个项目(按照Android Studio的建议,保留导入选项)。

step 3:-If the "compileSdkVersion" specified in your build.gradle doesn’t match with the one specified in the Android-ViewPagerIndicator project, change the second one. The same apply with any other property, such as "minSdkVersion" or even the current support library.

步骤3:-如果“编译dkversion”在您的构建中指定。gradle与Android-ViewPagerIndicator项目中指定的不匹配,请修改第二个。同样适用于任何其他属性,比如“minSdkVersion”,甚至是当前支持库。

Step 4:-Add Android-ViewPagerIndicator project as a dependency to your build.gradle module: dependencies { compile project(':library') }

步骤4:-添加Android-ViewPagerIndicator项目作为构建的依赖项。gradle模块:依赖项{编译项目(':library')}

Step 5:- Sync project with gradle files.

步骤5:-同步项目与级文件。

#1


11  

TabHost doesn't provide ViewPager support.
Also, I suggest you to not use TabHost – this is old style.
Use PagerTabStrip

TabHost不提供ViewPager支持。另外,我建议您不要使用TabHost——这是老式的。使用PagerTabStrip

Look this Gist.

看这一要点。

UPD: I add some code, for case, if this Gist be deleted;

UPD:我添加了一些代码,如果这个要点被删除;

MainActivity.java

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 (without PagerTabStrip)

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 (with PagerTabStrip)

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

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

getPageTitle

getPageTitle

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

UPD 2 With Fragment:

乌利希期刊指南与片段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;
        }
    }
}

Hope it helps

希望它能帮助

#2


1  

use the following solution i have put the view page like below.. and my work done..

使用下面的解决方案,我将视图页面如下所示。和我的工作。

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

#3


0  

You can implement the viewpager as a library.

您可以将viewpager实现为库。

First thing you need to import viewpager project to the eclipse workspace. [ I think you are modifying the project :Tabhost example]

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

so right click your Tabhost example project thn build path -> configure build path.. thn click Android ...when you click android you can see 2 section Project build Target & Library.So in Library you can add the viewpager Library.

因此,右键单击您的Tabhost示例项目thn构建路径—>配置构建路径。而不是点击安卓…当你点击android时,你可以看到2部分项目构建目标和库。在库中可以添加viewpager库。

#4


0  

Inorder to include viewpager library to the project ,you should import the library
"Existing Project” to your current one.

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

Step 1:-Download source code from GitHub.(https://github.com/JakeWharton/Android-ViewPagerIndicator)

第一步:-从GitHub上下载源代码。

Step2 :-In your Android Studio Project: File -> Project Structure -> add (+ symbol) -> Import Existing Project. Import just the folder called ”library”, not the entire project (leave the import options as Android Studio suggests).

步骤2:在您的Android Studio项目中:File ->项目结构-> add (+ symbol) ->导入现有项目。只导入名为“library”的文件夹,而不是整个项目(按照Android Studio的建议,保留导入选项)。

step 3:-If the "compileSdkVersion" specified in your build.gradle doesn’t match with the one specified in the Android-ViewPagerIndicator project, change the second one. The same apply with any other property, such as "minSdkVersion" or even the current support library.

步骤3:-如果“编译dkversion”在您的构建中指定。gradle与Android-ViewPagerIndicator项目中指定的不匹配,请修改第二个。同样适用于任何其他属性,比如“minSdkVersion”,甚至是当前支持库。

Step 4:-Add Android-ViewPagerIndicator project as a dependency to your build.gradle module: dependencies { compile project(':library') }

步骤4:-添加Android-ViewPagerIndicator项目作为构建的依赖项。gradle模块:依赖项{编译项目(':library')}

Step 5:- Sync project with gradle files.

步骤5:-同步项目与级文件。