[英]How can I put titles in ViewPager using fragments?
I am using ViewPager to allow user to swipe between fragments.我正在使用 ViewPager 来允许用户在片段之间滑动。
How can I add a the title of each fragment to the screen?如何将每个片段的标题添加到屏幕上?
package com.multi.andres;
import java.util.List;
import java.util.Vector;
import com.viewpagerindicator.TitlePageIndicator;
import com.viewpagerindicator.TitleProvider;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
public class ViewPagerFragment extends FragmentActivity{
private PagerAdapter mPagerAdapter; //contiene el pager adapter
private static String[] titulosPaginas = { "APP 1", "APP 2" };
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
super.setContentView(R.layout.lcmeter); //layout que contiene el ViewPager
initialisePaging(); //inicializo las paginas
}
private void initialisePaging() {
List<Fragment> fragments = new Vector<Fragment>();
fragments.add(Fragment.instantiate(this, FragmentPrueba1.class.getName()));
fragments.add(Fragment.instantiate(this, FragmentPrueba2.class.getName()));
this.mPagerAdapter = new PagerAdapter(super.getSupportFragmentManager(), fragments);
ViewPager pager = (ViewPager)super.findViewById(R.id.pager);
pager.setAdapter(this.mPagerAdapter);
//Agrega los titulos
TitlePageIndicator titleIndicator = (TitlePageIndicator) findViewById(R.id.titulos); //layout XML
titleIndicator.setViewPager(pager);
}
/** *************************************************************************************************
/** Clase: public class PagerAdapter extends FragmentPagerAdapter implements TitleProvider
/** Notas: extends FragmentPagerAdapter permite el uso de las paginas de ViewPager pero con Fragments
/** implements TitleProvider permite el uso de los titulos en las paginas
/** Funcion: crea paginas por las cuales deslizarse horizontalmente las cuales son usadas
****************************************************************************************************/
public class PagerAdapter extends FragmentPagerAdapter implements TitleProvider {
private List<Fragment> fragments;
public String getTitle(int position) {
// TODO Auto-generated method stub
return titulosPaginas[position]; // titulo de la pagina
}
public PagerAdapter(FragmentManager fm, List<Fragment> fragments) {
super(fm);
this.fragments = fragments;
}
@Override
public int getCount() {
return this.fragments.size();
}
@Override
public Fragment getItem(int position) {
return this.fragments.get(position);
}
}
}
But it doesn't show the titles of ViewPager and I don't know why.但是它没有显示 ViewPager 的标题,我不知道为什么。 I used ViewPager with titles before but not with fragments and I cannot get titles working now.
我之前将 ViewPager 与标题一起使用,但不与片段一起使用,现在我无法让标题工作。
You can also use Jake Wharton's ViewPagerIndicator library to get the desired effect.您还可以使用 Jake Wharton 的ViewPagerIndicator库来获得所需的效果。 Davek804's answer works too, but it requires you to reference the entire ActionBarSherlock library, which isn't as preferable if you only need a
ViewPager
that supports custom/styled titles. Davek804 的答案也有效,但它要求您引用整个 ActionBarSherlock 库,如果您只需要一个支持自定义/样式化标题的
ViewPager
,则这不是可取的。
Setting it up to work correctly is simply a matter of writing a tiny bit of XML, initializing your ViewPager
in your Activity
, and implementing a FragmentAdapter
(which extends FragmentPagerAdapter implements TitleProvider
) to specify which pages hold which Fragment
s.将其设置为正常工作只需编写一小段 XML,在
Activity
中初始化ViewPager
,并实现FragmentAdapter
( extends FragmentPagerAdapter implements TitleProvider
)以指定哪些页面包含哪些Fragment
。
XML layout XML布局
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <com.viewpagerindicator.TabPageIndicator android:id="@+id/titles" android:layout_height="wrap_content" android:layout_width="match_parent"/> <android.support.v4.view.ViewPager android:id="@+id/pager" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1"/> </LinearLayout>
Initialize in your Activity
在您的
Activity
中初始化
//Set the pager with an adapter ViewPager pager = (ViewPager)findViewById(R.id.pager); pager.setAdapter(new CustomAdapter(getSupportFragmentManager())); //Bind the title indicator to the adapter TitlePageIndicator titleIndicator = (TitlePageIndicator) findViewById(R.id.titles); titleIndicator.setViewPager(pager);
Implement a CustomFragmentAdapter
实施
CustomFragmentAdapter
public static class CustomFragmentAdapter extends FragmentPagerAdapter implements TitleProvider { public static final int POSITION_PAGE_1 = 0; public static final int POSITION_PAGE_2 = 1; public static final int POSITION_PAGE_3 = 2; private static final String[] TITLES = new String[] { "Title 1", "Title 2", "Title 3" }; public static final int NUM_TITLES = TITLES.length; public CustomFragmentAdapter(FragmentManager fm) { super(fm); } @Override public Fragment getItem(int position) { switch (position) { case POSITION_TITLE_1: return PageOneFragment.newInstance(); case POSITION_TITLE_2: return PageTwoFragment.newInstance(); case POSITION_TITLE_3: return PageThreeFragment.newInstance(); } return null; } @Override public int getCount() { return NUM_TITLES; } @Override public String getTitle(int position) { return TITLES[position % NUM_TITLES].toUpperCase(); } }
The ViewPagerIndicator
library supports the titling features: ViewPagerIndicator
库支持标题功能:
TitlePageIndicator
TabPageIndicator
CirclePageIndicator
Or if you don't like to use from third-part library, you can use support v4 PagerTabStrip class. For example:或者,如果您不喜欢使用第三方库,则可以使用支持 v4 PagerTabStrip class。例如:
<android.support.v4.view.ViewPager
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="0px"
android:layout_weight="1">
<android.support.v4.view.PagerTabStrip
android:id="@+id/pts_main"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</android.support.v4.view.ViewPager>
and in PagerAdapter override getPageTitle method:并在 PagerAdapter 中覆盖 getPageTitle 方法:
public static class MyAdapter extends FragmentPagerAdapter {
...
@Override
public CharSequence getPageTitle(int position) {
return String.valueOf(position);
}
}
You can access for xml element from code like this:您可以通过如下代码访问 xml 元素:
protected void onCreate(Bundle savedInstanceState) {
setContentView(R.layout.pager);
...
mAdapter = new MyAdapter(getSupportFragmentManager());
// Add custom adapter
mPager = (ViewPager)findViewById(R.id.pager);
mPager.setAdapter(mAdapter);
// Get PagerTabStrip
PagerTabStrip strip = (PagerTabStrip) findViewById(R.id.pts_main);
strip.setDrawFullUnderline(false);
...
I hope it will helps for someone我希望它会对某人有所帮助
Where mine says SherlockFragmentActivity, you can just have FragmentActivity.我说 SherlockFragmentActivity 的地方,你可以只拥有 FragmentActivity。 getSupportActionBar can be getActionBar().
getSupportActionBar 可以是 getActionBar()。
public class Polling extends SherlockFragmentActivity implements OnMenuItemClickListener {
private ViewPager mViewPager;
private TabsAdapter mTabsAdapter;
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mViewPager = new ViewPager(this);
mViewPager.setId(R.id.pager);
setContentView(mViewPager);
bar = getSupportActionBar();
bar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS);
bar.setDisplayShowTitleEnabled(false);
bar.setDisplayShowHomeEnabled(false);
mTabsAdapter = new TabsAdapter(this, mViewPager);
mTabsAdapter.addTab(bar.newTab().setText(R.string.login),
LoginFragment.class, null);
mTabsAdapter.addTab(bar.newTab().setText(R.string.economics),
EconFragment.class, null);
mTabsAdapter.addTab(bar.newTab().setText(R.string.elections),
ElectionsFragment.class, null);
mTabsAdapter.addTab(bar.newTab().setText(R.string.politics),
PoliticsFragment.class, null);
mTabsAdapter.addTab(bar.newTab().setText(R.string.science),
ScienceFragment.class, null);
mTabsAdapter.addTab(bar.newTab().setText(R.string.finance),
FinanceFragment.class, null);
mTabsAdapter.addTab(bar.newTab().setText(R.string.religion),
ReligionFragment.class, null);
mTabsAdapter.addTab(bar.newTab().setText(R.string.military),
MilitaryFragment.class, null);
mTabsAdapter.addTab(bar.newTab().setText(R.string.international),
InternationalFragment.class, null);
}
public static class TabsAdapter extends FragmentPagerAdapter
implements ActionBar.TabListener, ViewPager.OnPageChangeListener {
private final Context mContext;
private final ActionBar mActionBar;
private final ViewPager mViewPager;
private final ArrayList<TabInfo> mTabs = new ArrayList<TabInfo>();
static final class TabInfo {
private final Class<?> clss;
private final Bundle args;
TabInfo(Class<?> _class, Bundle _args) {
clss = _class;
args = _args;
}
}
public TabsAdapter(SherlockFragmentActivity activity, ViewPager pager) {
super(activity.getSupportFragmentManager());
mContext = activity;
mActionBar = activity.getSupportActionBar();
mViewPager = pager;
mViewPager.setAdapter(this);
mViewPager.setOnPageChangeListener(this);
}
public void addTab(ActionBar.Tab tab, Class<?> clss, Bundle args) {
TabInfo info = new TabInfo(clss, args);
tab.setTag(info);
tab.setTabListener(this);
mTabs.add(info);
mActionBar.addTab(tab);
notifyDataSetChanged();
}
public int getCount() {
return mTabs.size();
}
public SherlockFragment getItem(int position) {
TabInfo info = mTabs.get(position);
return (SherlockFragment)Fragment.instantiate(mContext, info.clss.getName(), info.args);
}
public void onPageSelected(int position) {
mActionBar.setSelectedNavigationItem(position);
}
public void onPageScrollStateChanged(int state) {}
public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {}
public void onTabSelected(Tab tab, FragmentTransaction ft) {
mViewPager.setCurrentItem(tab.getPosition());
//Log.v(TAG, "clicked");
Object tag = tab.getTag();
for (int i=0; i<mTabs.size(); i++) {
if (mTabs.get(i) == tag) {
mViewPager.setCurrentItem(i);
}
}
}
public void onTabUnselected(Tab tab, FragmentTransaction ft) {}
public void onTabReselected(Tab tab, FragmentTransaction ft) {}
public void onTabReselected(Tab tab, android.app.FragmentTransaction ft) {}
public void onTabUnselected(Tab tab, android.app.FragmentTransaction ft) {}
}
}
@Alex Lockwood Thanks you:) I still have a problem:/ It is my XML: @Alex Lockwood 谢谢你:)我还有一个问题:/这是我的 XML:
lcmeter.xml lcmeter.xml
<?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.support.v4.view.ViewPager
android:id="@+id/pager"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</android.support.v4.view.ViewPager>
<com.viewpagerindicator.TitlePageIndicator
android:id="@+id/titulos"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
Whit my original code in the first post if a put "TitlePageIndicator" before "android.support.v4.view.ViewPager" i can see the titles but i cannot swype only clicking the titles change the pages and my fragments are not showed but whit the XML on that way i can swype through my fragments but i cannot see the titles:/.如果将“TitlePageIndicator”放在“android.support.v4.view.ViewPager”之前,我在第一篇文章中使用我的原始代码我可以看到标题,但我不能仅单击标题更改页面并且我的片段没有显示但是XML 这样我可以浏览我的片段,但我看不到标题:/。 I tried whit constructors on this way:
我以这种方式尝试了构造函数:
package com.multi.andres;
import java.util.List;
import java.util.Vector;
import com.viewpagerindicator.TitlePageIndicator;
import com.viewpagerindicator.TitleProvider;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
public class ViewPagerFragment extends FragmentActivity{
private PagerAdapter mPagerAdapter; //contiene el pager adapter
String[] titulosPaginas = { "APP 1", "APP 2" };
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
super.setContentView(R.layout.lcmeter); //layout que contiene el ViewPager
initialisePaging(); //inicializo las paginas
}
private void initialisePaging() {
List<Fragment> fragments = new Vector<Fragment>();
fragments.add(Fragment.instantiate(this, FragmentPrueba1.class.getName()));
fragments.add(Fragment.instantiate(this, FragmentPrueba2.class.getName()));
this.mPagerAdapter = new PagerAdapter(super.getSupportFragmentManager(), fragments);
ViewPager pager = (ViewPager)super.findViewById(R.id.pager);
pager.setAdapter(this.mPagerAdapter);
//Agrega los titulos
TitlePageIndicator titleIndicator = (TitlePageIndicator) findViewById(R.id.titulos); //layout XML
titleIndicator.setViewPager(pager);
}
/** *************************************************************************************************
/** Clase: public class PagerAdapter extends FragmentPagerAdapter implements TitleProvider
/** Notas: extends FragmentPagerAdapter permite el uso de las paginas de ViewPager pero con Fragments
/** implements TitleProvider permite el uso de los titulos en las paginas
/** Funcion: crea paginas por las cuales deslizarse horizontalmente las cuales son usadas
****************************************************************************************************/
public class PagerAdapter extends FragmentPagerAdapter implements TitleProvider {
private List<Fragment> fragments;
public String getTitle(int position) {
// TODO Auto-generated method stub
return titulosPaginas[position]; // titulo de la pagina
}
public PagerAdapter(FragmentManager fm, List<Fragment> fragments) {
super(fm);
this.fragments = fragments;
}
@Override
public int getCount() {
return this.fragments.size();
}
@Override
public Fragment getItem(int position) {
try {
FragmentPrueba1.class.newInstance();
} catch (InstantiationException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (IllegalAccessException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return this.fragments.get(position);
}
}
}
But i have a FC when i open the application.但是当我打开应用程序时,我有一个 FC。 Here is my fragment both are equal:
这是我的片段,两者都是平等的:
package com.multi.andres;
import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;
public class FragmentPrueba1 extends Fragment {
FragmentPrueba1 (){
}
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
return (LinearLayout)inflater.inflate(R.layout.prueba1, container, false);
}
}
It is fragments XML:它是片段 XML:
<?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"
android:background="#FF0000" >
<TextView
android:id="@+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Numero 1 !!" />
<Button
android:id="@+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Esto es un boton XD" />
</LinearLayout>
I have read about Fragments but i cannot get working Fragments whit titles and it doesnt make sense:/ I am new at this but i am learning and is pretty complicated to me this kind of things thank you very much for your help i really appreciate it:)我已经阅读了有关 Fragments 的内容,但我无法使用带有标题的 Fragments 并且它没有意义:/我是新手,但我正在学习并且对我来说非常复杂这类事情非常感谢您的帮助我真的很感激:)
EDIT:编辑:
I think i have founded the problem, it is not on Java code, the problem is on XML file ViewPager:我想我已经找到了问题所在,它不在 Java 代码上,问题出在 XML 文件 ViewPager 上:
<?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.support.v4.view.ViewPager
android:id="@+id/pager"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
</android.support.v4.view.ViewPager>
<com.viewpagerindicator.TitlePageIndicator
android:id="@+id/titulos"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />
</LinearLayout>
That seems to "get over" the titles because if i use XML file of Google example which adds android:layout_weight="1" on android.support.v4.view.ViewPager, i can see the titles on the bottom of the screen, not on top instead but is a progress:)这似乎“克服”了标题,因为如果我使用 Google 示例的 XML 文件,该文件在 android.support.v4.view.ViewPager 上添加了 android:layout_weight="1",我可以在屏幕底部看到标题,不是最重要的,而是一个进步:)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.