使用Fragment来处理Andoird app的UI布局的实例分享

Fragment 的出现一方面是为了缓解 Activity 任务过重的问题,另一方面是为了处理在不同屏幕上 UI 组件的布局问题,而且它还提供了一些新的特性(例如 Retainable)来处理一些在 Activity 中比较棘手的问题。Fragment 拥有和 Activity 一致的生命周期,它和 Activity 一样被定义为 Controller 层的类。有过中大型项目开发经验的开发者,应该都会遇到过 Activity 过于臃肿的情况,而 Fragment 的出现就是为了缓解这一状况,可以说 它将屏幕分解为多个「Fragment(碎片)」(这句话很重要),但它又不同于 View,它干的实质上就是 Activity 的事情,负责控制 View 以及它们之间的逻辑。将屏幕碎片化为多个 Fragment 后,其实 Activity 只需要花精力去管理当前屏幕内应该显示哪些 Fragments,以及应该对它们进行如何布局就行了。这是一种组件化的思维,用 Fragment 去组合了一系列有关联的 UI 组件,并管理它们之间的逻辑,而 Activity 负责在不同屏幕下(例如横竖屏)布局不同的 Fragments 组合。这种碎片不单单能管理可视的 Views,它也能执行不可视的 Tasks,它提供了 retainInstance 属性,能够在 Activity 因为屏幕状态发生改变(例如切换横竖屏时)而销毁重建时,依然保留实例。这示意着我们能在 RetainedFragment 里面执行一些在屏幕状态发生改变时不被中断的操作。
下面我们就来具体看一个Android Fragment功能的例子。
实现的功能很简单,也是最基本的,上下分别是两个Fragment,上面的Fragment中是一个listview,当点击item时,下面的Fragment显示对应的文字详细信息:

具体的实现步骤如下:
①创建工程FragmentExam,目录视图如下(把之前的FragmentPreference的demo也加到了一起):

②main.xml文件布局,垂直方向上两个Fragment,用<Fragment>标签声明

<LinearLayout 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" android:orientation="vertical" android:background="#7ecef4"> <fragment android:name="com.example.fragementexam.FragementList" android:id="@+id/frag_list" android:layout_width="fill_parent" android:layout_height="0dp" android:layout_weight="2"/> <fragment android:name="com.example.fragementexam.FragementDetails" android:id="@+id/frag_detail" android:layout_width="fill_parent" android:layout_height="0dp" android:layout_weight="1"/> </LinearLayout>

③FragmentList.java的代码,它继承了ListFragment,注意在onCreateView方法中使用inflater的inflate方法将布局页面引进:

package com.example.fragementexam; import java.util.ArrayList; import java.util.HashMap; import java.util.List; import java.util.Map; import android.app.ListFragment; import android.os.Bundle; import android.util.Log; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.ListView; import android.widget.SimpleAdapter; public class FragementList extends ListFragment { private String[] values = new String[] { "侏儒", "人类", "暗夜精灵", "矮人", "德莱尼", "狼人" }; private int[] images = new int[] { R.drawable.gnome, R.drawable.human, R.drawable.nightelf, R.drawable.dwarf, R.drawable.draenei, R.drawable.werewolf }; @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { return inflater.inflate(R.layout.frag_list, container, false); } @Override public void onActivityCreated(Bundle savedInstanceState) { super.onActivityCreated(savedInstanceState); List<Map<String, Object>> listItems = new ArrayList<Map<String, Object>>(); for (int i = 0; i < values.length; i++) { Map<String, Object> listItem = new HashMap<String, Object>(); listItem.put("values", values[i]); listItem.put("images", images[i]); listItems.add(listItem); } SimpleAdapter adapter = new SimpleAdapter(getActivity(), listItems, R.layout.list_item, new String[] { "values", "images" }, new int[] { R.id.txt_title, R.id.img }); setListAdapter(adapter); } @Override public void onListItemClick(ListView l, View v, int position, long id) { // String item = (String) getListAdapter().getItem(position); FragementDetails frag = (FragementDetails) getFragmentManager() .findFragmentById(R.id.frag_detail); if (frag != null && frag.isInLayout()) { switch (position) { case 0: frag.setText(getString(R.string.Gnome)); break; case 1: frag.setText(getString(R.string.Human)); break; case 2: frag.setText(getString(R.string.NightElf)); break; case 3: frag.setText(getString(R.string.Dwarf)); break; case 4: frag.setText(getString(R.string.Draenei)); break; case 5: frag.setText(getString(R.string.Werewolf)); break; } } Log.i("PDA", "position = " + position); } }

④FragementDetails.java的代码,这个比较简单,里面有一个设置TextView内容的方法,其布局页面也仅仅是一个TextView

package com.example.fragementexam; import android.app.Fragment; import android.os.Bundle; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.TextView; public class FragementDetails extends Fragment { @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { // TODO Auto-generated method stub return inflater.inflate(R.layout.frag_detail, container,false); } public void setText(String item){ TextView txt = (TextView) getView().findViewById(R.id.txt_detail); txt.setText(item); } }

其他的部分就是一些数组,String的定义了,这个demo虽然简单,却将Android Fragment方面常用到的做了一个综述,如果自己写明白了这个的话,今后遇到类似的项目应该要好应付的多,好了,收工!

时间: 2024-09-30 12:05:13

使用Fragment来处理Andoird app的UI布局的实例分享的相关文章

使用Fragment来处理Andoird app的UI布局的实例分享_Android

Fragment 的出现一方面是为了缓解 Activity 任务过重的问题,另一方面是为了处理在不同屏幕上 UI 组件的布局问题,而且它还提供了一些新的特性(例如 Retainable)来处理一些在 Activity 中比较棘手的问题.Fragment 拥有和 Activity 一致的生命周期,它和 Activity 一样被定义为 Controller 层的类.有过中大型项目开发经验的开发者,应该都会遇到过 Activity 过于臃肿的情况,而 Fragment 的出现就是为了缓解这一状况,可以

iOS开发UI篇:APP主流UI框架结构

一.简单示例 说明:使用APP主流UI框架结构完成简单的界面搭建 搭建页面效果: 开发UI篇:APP主流UI框架结构-"> 查看本栏目更多精彩内容:http://www.bianceng.cnhttp://www.bianceng.cn/OS/extra/

移动-对于现在手机App的UI设计的问题

问题描述 对于现在手机App的UI设计的问题 今天,公司要求我做PS,可以我不知道尺寸呀,ps的文件像素大小?--真心纠结呀 解决方案 各个手机操作系统都 App UI 的图片要求是不一样的,你设计的是用于 Android 吗?应用图标尺寸(宽*高) 1024 * 1024(其他尺寸我们可以自己缩放)要求:应用图标iOS端要求直角图片.Android端要求圆角图片启动界面图尺寸(宽*高) android:1920*1080 背景:1920*1080 解决方案二: .......没特别要求就默认么

iOS开发UI篇—APP主流UI框架结构

一.简单示例 说明:使用APP主流UI框架结构完成简单的界面搭建 搭建页面效果: 二.搭建过程和注意点 1.新建一个项目,把原有的控制器删除,添加UITabBarController控制器作为管理控制器 2.对照界面完成搭建 3.注意点: (1)隐藏工具条:配置一个属性,Hideabotton bar在push的时候隐藏底部的bar在那个界面隐藏,就在哪个界面设置. (2).cell可以设置行高 (3)连线 (4)说明:在上面的页面搭建中直接使用了静态单元格,但在实际开发中,通常不这么做. (5

为什么fragment不会实时的刷新ui

问题描述 为什么fragment不会实时的刷新ui 我是采用的viewPager+fragment,使用的是fragmentStatePagerAdapter创建的fragment,现在有一个需求,在fragment里定义boolean值,当值为false的时候点击按钮跳转到一个activity,然后在activity里修改这个Boolean的值,在点击activity里的按钮,将Boolean值返回去,从而修改fragment的布局,我用的是startActivityforResult的方法来

一些最新的 iPhone APP 的 UI 设计实例

本文收集的一些最新的 iPhone 下的 APP 的 UI 设计实例或许对你开发 APP 有所帮助.不过很抱歉,这里只有一个截图. Notesbook App idea Cause.It iPhone App Confirm Payment PayPal for iPhone redesign Hattrick App Starbucks application Home View Transactions Camera Awesome New iPhone app design iOS Top

Android UI布局问题总结

在做新行程项目期间,遇到了很多关于UI布局的问题,这里总结一部分,都是一些小细节,希望能加深理解,以后少走弯路. 一 页面唤起后view创建完成的时间     Activity的生命周期为下图所示:     Activity在onCreate中使用setContentView()方法中载入xml布局,那么布局中的view是在何时完成创建的呢?在父布局中添加一个TextView,使用getLeft().getRight()方法获取TextView在父布局中的左右边界的位置,打印出来可以看到    

iOS8开发~UI布局(三)深入理解autolayout

一.概要 通过对iOS8界面布局的学习和总结,发现autolayout才是主角,autolayout是iOS6引入的新特性,当时还粗浅的学习了下,可是没有真正应用到项目中.随着iOS设备尺寸逐渐碎片化,纯粹的hard code方式UI布局将会走向死角,而autoresizing方式也有其局限性,所以无论如何autolayout都将成为UI布局的重要方式. 前两篇以发烧友心态对iOS8界面布局的主要元素size class和autolayout进行了探索,发现要完全掌握autolayout需要大量

[UWP]涨姿势UWP源码——UI布局

原文:[UWP]涨姿势UWP源码--UI布局 懒癌晚期兼正月里都是过年,一直拖到今天才继续更新.之前的几篇介绍了数据的来源,属于准备工作.本篇我们正式开始构建涨姿势UWP程序的UI界面. 我们这个Hello World程序比较简单,总共只有一个页面,在PC和Tablet上呈左右分开,左边以列表显示新闻标题及简述,右边则显示新闻正文. 对于这样的一个布局,Grid无疑是最为合适的Panel,大体是以下的结构: <Grid> <Grid.ColumnDefinitions> <C