Android之Fragment界面布局实例

显示效果图：

TabActivity.java:

package com.demo.tab;import android.os.Bundle;import android.support.v4.app.FragmentActivity;import android.support.v4.view.ViewPager;import android.support.v4.view.ViewPager.SimpleOnPageChangeListener;import android.view.View;import android.view.View.OnClickListener;import android.widget.ImageView;import android.widget.TextView;import com.demo.broadcast.R;public class TabActivity extends FragmentActivity implements OnClickListener{private TextView tab1, tab2, tab3;private ImageView tab1_bottom, tab2_bottom, tab3_bottom;private ViewPager viewPager;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);this.setContentView(R.layout.tab);initView();show(1);}private void initView() {tab1 = (TextView) findViewById(R.id.tab1);tab2 = (TextView) findViewById(R.id.tab2);tab3 = (TextView) findViewById(R.id.tab3);tab1.setOnClickListener(this);tab2.setOnClickListener(this);tab3.setOnClickListener(this);tab1_bottom = (ImageView) findViewById(R.id.tab1_bottom);tab2_bottom = (ImageView) findViewById(R.id.tab2_bottom);tab3_bottom = (ImageView) findViewById(R.id.tab3_bottom);viewPager = (ViewPager) findViewById(R.id.viewPager);TabPagerAdapter adapter = new TabPagerAdapter(getSupportFragmentManager());viewPager.setAdapter(adapter);viewPager.setOnPageChangeListener(new SimpleOnPageChangeListener(){          @Override          public void onPageSelected(int arg0) {        show(arg0);        }  });  viewPager.setCurrentItem(1);}private void show(int position){tab1_bottom.setVisibility(position == 0 ? View.VISIBLE : View.INVISIBLE);tab2_bottom.setVisibility(position == 1 ? View.VISIBLE : View.INVISIBLE);tab3_bottom.setVisibility(position == 2 ? View.VISIBLE : View.INVISIBLE);}@Overridepublic void onClick(View v) {switch(v.getId()){case R.id.tab1:viewPager.setCurrentItem(0);  break;case R.id.tab2:viewPager.setCurrentItem(1);  break;case R.id.tab3:viewPager.setCurrentItem(2);  break;}}}

TabPagerAdapter.java:

package com.demo.tab;import android.os.Bundle;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentPagerAdapter;public class TabPagerAdapter extends FragmentPagerAdapter{private static int TCOUNT = 3;private TabFragment[] fragments = new TabFragment[TCOUNT];public TabPagerAdapter(FragmentManager fm) {super(fm);}@Overridepublic Fragment getItem(int position) {TabFragment fragment = new TabFragment();Bundle args = new Bundle();args.putInt("section_number", position);fragment.setArguments(args);fragments[position] = fragment;return fragment;}@Overridepublic int getCount() {return TCOUNT;}}

TabFragment.java:

package com.demo.tab;import android.os.Bundle;import android.support.v4.app.Fragment;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import com.demo.broadcast.R;public class TabFragment extends Fragment{private int section;@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {section = getArguments().getInt("section_number");if(section == 0){View view = inflater.inflate(R.layout.tab1, container, false);return view;}else if(section == 1){View view = inflater.inflate(R.layout.tab2, container, false);return view;}else if(section == 2){View view = inflater.inflate(R.layout.tab3, container, false);return view;}return null;}}

tab.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:background="#ffffff"    android:orientation="vertical" >        <android.support.v4.view.ViewPager        android:id="@+id/viewPager"        android:layout_width="match_parent"        android:layout_height="match_parent"        android:layout_weight="1" />        <!-- tab标签栏 -->    <LinearLayout        android:layout_width="fill_parent"        android:layout_height="60dp"        android:background="#000000" >        <TextView            android:id="@+id/tab1"            android:layout_width="fill_parent"            android:layout_height="fill_parent"            android:layout_weight="1"            android:gravity="center"            android:text="tab1"            android:textColor="#ffffff"            android:textSize="18sp" />        <View            android:layout_width="1dp"            android:layout_height="30dp"            android:layout_gravity="center_vertical"            android:background="#F3F2F6" />        <TextView            android:id="@+id/tab2"            android:layout_width="fill_parent"            android:layout_height="fill_parent"            android:layout_weight="1"            android:gravity="center"            android:text="tab2"            android:textColor="#ffffff"            android:textSize="18sp" />                <View            android:layout_width="1dp"            android:layout_height="30dp"            android:layout_gravity="center_vertical"            android:background="#F3F2F6" />        <TextView            android:id="@+id/tab3"            android:layout_width="fill_parent"            android:layout_height="fill_parent"            android:layout_weight="1"            android:gravity="center"            android:text="tab3"            android:textColor="#ffffff"            android:textSize="18sp" />    </LinearLayout>    <LinearLayout        android:layout_width="match_parent"        android:layout_height="wrap_content"        android:orientation="horizontal" >        <ImageView            android:id="@+id/tab1_bottom"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:background="@drawable/tab_red_bottom" />        <ImageView            android:id="@+id/tab2_bottom"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:background="@drawable/tab_red_bottom" />                <ImageView            android:id="@+id/tab3_bottom"            android:layout_width="0dp"            android:layout_height="wrap_content"            android:layout_weight="1"            android:background="@drawable/tab_red_bottom" />    </LinearLayout></LinearLayout>

tab1.xml,tab2.xml,tab3.xml布局非常简单，在此就不在展示了。

更多相关文章

随机推荐