通过声明方式在Android 3.0上使用Fragment

23
回复
522941
查看
[复制链接]

206

主题

1622

帖子

2721

安币

Android大神

Rank: 6Rank: 6

发表于 2011-11-10 13:38:52 | 显示全部楼层 |阅读模式

编写最简单的Fragment中使用的环境是1.6到2.3的。为了比较正式的学习一下Fragment的使用,在Android 3.0平板模拟器上开发了一个示例:

使用Fragment可以有两种方式,即:

  • 通过布局xml文件,将fragment声明到布局里,这样fragment生命周期和Activity是绑定的
  • 通过编程方式,自己可以灵活处理在Activity内的fragment生命周期,缺点是可能因为复杂的生命周期管理带来不可预期的效果,比如[cref 4096]示例

以下使用的是声明方式。

先看布局文件main.xml:

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:orientation="horizontal" android:layout_width="match_parent"
  4.     android:layout_height="match_parent"
  5.     android:background="#c0c0c0c0">
  6.     <fragment android:name="com.easymorse.fragment.ArticleListFragment"
  7.         android:id="@+id/list" android:layout_weight="1" android:layout_width="0dp"
  8.         android:layout_height="match_parent" />
  9.     <fragment android:name="com.easymorse.fragment.ContentFragment"
  10.             android:id="@+id/content"
  11.             android:layout_weight="2"
  12.             android:layout_width="0dp"
  13.             android:layout_height="match_parent" />
  14. </LinearLayout>
复制代码
左右各有一个fragment,而且是按照1:2的方式分割布局空间。要为每个fragment编写单独的类,右边的比较简单,先说。右侧的fragment内是一个WebView,简单示例可见:android编写简单的Webview布局文件:
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="match_parent" android:layout_height="match_parent"
  4.     android:background="#ffffffff">
  5.     <WebView android:layout_width="match_parent" android:id="@+id/webView"
  6.         android:layout_height="match_parent" />
  7. </FrameLayout>
复制代码
fragment的类文件:
  1. public class ContentFragment extends Fragment {
  2.     @Override
  3.     public View onCreateView(LayoutInflater inflater, ViewGroup container,
  4.             Bundle savedInstanceState) {
  5.         return inflater.inflate(R.layout.right_content, container, false);
  6.     }

  7.     public void loadUrl(String url) {
  8.         WebView webView = (WebView) getView().findViewById(R.id.webView);
  9.         webView.getSettings().setJavaScriptEnabled(true);
  10.         webView.loadUrl(url);
  11.     }
  12. }
复制代码
这里特别要注意setJavaScriptEnable,否则无法执行网页中的javascript。左侧的fragment比较复杂,因为使用的是Fragment的子类ListFragment,作用类似ListActivity,简化有关List的开发。没有单独的布局文件,以下是ListView行元素的布局:
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="match_parent" android:layout_height="wrap_content"
  4.     android:background="#99ffffff">
  5.     <ImageView android:id="@+id/authorImage"
  6.         android:layout_width="80dp" android:layout_height="100dp" android:src="@drawable/marshal"
  7.         android:layout_alignParentLeft="true" android:padding="4dp" />
  8.     <TextView android:id="@+id/authorName" android:layout_width="match_parent"
  9.         android:layout_height="wrap_content" android:layout_alignParentTop="true"
  10.         android:layout_toRightOf="@id/authorImage" android:text="name"
  11.         android:textColor="#00000000" android:textSize="20sp"
  12.         android:textStyle="bold" android:padding="3dp"/>
  13.     <TextView android:id="@+id/authorIntroduction"
  14.         android:layout_width="match_parent" android:layout_height="wrap_content"
  15.         android:layout_toRightOf="@id/authorImage" android:layout_below="@id/authorName"
  16.         android:text="introduction" android:textColor="#00000000"
  17.         android:textSize="14sp" android:padding="3dp"/>
  18. </RelativeLayout>
复制代码
左侧Fragment的类:
  1. public class ArticleListFragment extends ListFragment {

  2.     private static final List<Member> MEMBERS = new ArrayList<Member>();

  3.     static {
  4.         Member member = new Member("Marshal",
  5.                 "WitMob团队负责人。致力于通过集体的力量使团队成长为国内先进的移动互联网外包应用提供商。",
  6.                 R.drawable.marshal, "http://marshal.easymorse.com/");
  7.         MEMBERS.add(member);
  8.         member = new Member("王保安",
  9.                 "iOS组负责人。擅长iOS开发。在工作上乐观勤奋,虽然有时碰到挫折也想回唐山老家。",
  10.                 R.drawable.wangjun, "http://wangjun.easymorse.com/");
  11.         MEMBERS.add(member);
  12.         member = new Member("大辉", "大嘴帅锅,Android组负责人。目前主攻Android技术方向。",
  13.                 R.drawable.dahui, "http://bigcat.easymorse.com/");
  14.         MEMBERS.add(member);
  15.     }

  16.     private MemberListener memberListener;

  17.     public void setMemberListener(MemberListener memberListener) {
  18.         this.memberListener = memberListener;
  19.     }

  20.     @Override
  21.     public void onActivityCreated(Bundle savedInstanceState) {
  22.         super.onActivityCreated(savedInstanceState);

  23.         setListAdapter(new ArticleListAdapter());
  24.     }

  25.     @Override
  26.     public void onListItemClick(ListView l, View v, int position, long id) {
  27.         l.setItemChecked(position, true);

  28.         if (memberListener != null) {
  29.             memberListener.onMemberSelected(MEMBERS.get(position));
  30.         }
  31.     }

  32.     class ArticleListAdapter extends BaseAdapter {

  33.         @Override
  34.         public int getCount() {
  35.             return MEMBERS.size();
  36.         }

  37.         @Override
  38.         public Object getItem(int position) {
  39.             return MEMBERS.get(position);
  40.         }

  41.         @Override
  42.         public long getItemId(int position) {
  43.             return position;
  44.         }

  45.         @Override
  46.         public View getView(int position, View convertView, ViewGroup parent) {
  47.             if (convertView == null) {
  48.                 convertView = getActivity().getLayoutInflater().inflate(
  49.                         R.layout.row, null);
  50.             }

  51.             Member member = MEMBERS.get(position);

  52.             TextView textView = (TextView) convertView
  53.                     .findViewById(R.id.authorName);
  54.             textView.setText(member.getName());

  55.             textView = (TextView) convertView
  56.                     .findViewById(R.id.authorIntroduction);
  57.             textView.setText(member.getIntroduction());

  58.             if (member.getImageResourseId() != 0) {
  59.                 ImageView imageView = (ImageView) convertView
  60.                         .findViewById(R.id.authorImage);
  61.                 imageView.setImageResource(member.getImageResourseId());
  62.             }

  63.             return convertView;
  64.         }

  65.     }
  66. }
复制代码
这里要创建ListAdapter,和ListView里面的使用类似,如果这里不懂,建议先摸一下ListView。为了能点击左侧Fragment的条目,改变右侧WebView加载的网页。自定义了一个监听器:
  1. public interface MemberListener {
  2.     void onMemberSelected(Member member);
  3. }
复制代码


本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x

2

主题

378

帖子

7

安币

代码手工艺人

Rank: 4

发表于 2011-12-5 15:34:24 | 显示全部楼层
看着挺不错

0

主题

67

帖子

46

安币

初级码农

Rank: 1

QQ达人

发表于 2012-4-19 23:18:56 | 显示全部楼层
学习下,谢谢分享

4

主题

104

帖子

321

安币

攻城狮

Rank: 3Rank: 3

QQ达人

发表于 2012-7-3 15:24:24 | 显示全部楼层
好奇,运行看看

0

主题

29

帖子

44

安币

程序猿

Rank: 2

发表于 2012-7-4 17:06:00 | 显示全部楼层
最近正好在学习,借鉴下了~

98

主题

1077

帖子

4132

安币

码皇(巴士元老)

Android奋斗者

Rank: 8Rank: 8

QQ达人

QQ
发表于 2012-7-9 18:36:26 | 显示全部楼层
看上去不错啊
加油!!

98

主题

1077

帖子

4132

安币

码皇(巴士元老)

Android奋斗者

Rank: 8Rank: 8

QQ达人

QQ
发表于 2012-7-9 19:07:52 | 显示全部楼层
看后有点晕
加油!!

0

主题

40

帖子

841

安币

代码手工艺人

Rank: 4

发表于 2012-9-3 10:03:10 | 显示全部楼层
嗯,不错
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

领先的中文移动开发者社区
18620764416
7*24全天服务
意见反馈:1294855032@qq.com

扫一扫关注我们

Powered by Discuz! X3.2© 2001-2019 Comsenz Inc.( 粤ICP备15117877号 )