Android官方开发文档Training系列课程中文版:使用Fragment构建动态UI之Fragment创建

简介: 原文地址:http://android.xsoftlab.net/training/basics/fragments/index.html导言为了在Android中创建动态的多面板用户界面,你需要将UI组件和活动的行为封装到模块中,这些模块可以在activity中互相交换。

原文地址:http://android.xsoftlab.net/training/basics/fragments/index.html

导言

为了在Android中创建动态的多面板用户界面,你需要将UI组件和活动的行为封装到模块中,这些模块可以在activity中互相交换。你可以使用类Fragment创建这些模块,这些习性看起来像一个鸟巢状的activity,它允许定义自己的布局和管理自己的生命周期。

当Fragment指定了布局,它可以与其它fragment以不同的方式组合进activity中,以便可以对不同的屏幕尺寸做适应,小屏幕可能需要在同一时刻只展示一个fragment,而大屏幕可以同时展示两个或两个以上的fragment。

这节课将会展示如何通过fragment创建动态的用户效果,并改进APP在不同屏幕尺寸上的展示的用户效果,同时继续支持运行Android1.6系统的设备。

创建一个Fragment

你可以把fragment想象为activity的一个单独的模块,这个模块拥有自己的生命周期,并且可以接收用户输入。并且可以在activity运行的时候添加或移除fragment。这节课展示了如何继承支持库中的Fragment,从而可以使APP可以运行在Android1.6这种低版本上。

Note:如果选择了APP的最低支持版本为11或者11以上,那么就不需要使用支持库。这时可以使用框架中的Fragment类。不过需要意识到这节课使用的是支持库中的Fragment,这里的API名称可能会与框架中的Fragment名称有稍微的不同。

在开始这节课之前,必须确认工程已经使用了支持库。如果还没有使用支持库的话,请选择v4包中的支持库。你也可以使用包含了ActionBar的v7支持库,不过它只能运行在Android2.1及以上的版本上。

创建一个Fragment类

如果要创建一个Fragment,需要继承Fragment类,然后重写关键的生命周期函数,与Activity类的方式很相似。

唯一的不同就是在创建Fragment时必须使用onCreateView方法定义布局。实际上,如果要简单运行的话,这是唯一个需要重写的方法。举个例子:

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.ViewGroup;
public class ArticleFragment extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
        Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.article_view, container, false);
    }
}

正如Activity一样,一个fragment应该实现其它生命周期函数,这些生命周期函数可以管理各种状态,比如说添加到activity的状态或是从activity移除的状态,或是像activity类似的生命周期状态。举个例子,当activity的onPause方法被调用时,在activity中的每一个fragment的onPause方法也会被调用。

有关更多fragment的生命周期以及回调函数介绍请参见Fragments开发文档。

使用XML将Fragment添加到Activity中

虽然fragment有可重用化、UI组件模块化的特点,但是每一个fragment都需要与FragmentActivity关联才能使用。你可以在activity的XML布局文件中通过定义的方式达成这种关联。

**Note:**FragmentActivity是支持库中一个特殊的activity,它使得fragment可以在版本11以下的设备上运行。如果APP的最低支持版本在11及11以上的话,可以使用正规的Activity类。

下面的这个布局例子展示了当设备的屏幕被认为是”large”时,添加了两个Fragment到Activity中(特别指明布局文件夹的目录包含”large”标识符):
res/layout-large/news_articles.xml

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <fragment android:name="com.example.android.fragments.HeadlinesFragment"
              android:id="@+id/headlines_fragment"
              android:layout_weight="1"
              android:layout_width="0dp"
              android:layout_height="match_parent" />
    <fragment android:name="com.example.android.fragments.ArticleFragment"
              android:id="@+id/article_fragment"
              android:layout_weight="2"
              android:layout_width="0dp"
              android:layout_height="match_parent" />
</LinearLayout>

Tips:有关更多针对不同的屏幕尺寸创建布局的信息,请参见:Supporting Different Screen Sizes(本系列也有翻译,请自行查找)

然后将布局应用到Activity中:

import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
public class MainActivity extends FragmentActivity {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.news_articles);
    }
}

如果你使用了v7 appcompat library,Activity应该替换为继承ActionBarActivity,它是FragmentActivity的子类。

Note:如果通过XML布局的方式将Fragment添加到了Activity中,那么在运行时是不可以移除Fragment的。如果你计划在用户使用的时候将Fragment换进换出,那么你必须在Activity第一次启动的时候把fragment添加进去。下一节课将会讨论这些。

目录
相关文章
|
4月前
|
开发框架 前端开发 JavaScript
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发一
本文介绍了方舟开发框架(ArkUI)及其两种开发范式:基于ArkTS的声明式开发范式和类Web开发范式。ArkUI是用于构建HarmonyOS应用界面的UI框架,提供极简UI语法和基础设施。声明式开发范式使用ArkTS语言,以组件、动画和状态管理为核心,适合复杂团队协作;类Web开发范式采用HML、CSS、JavaScript三段式开发,适用于简单界面应用,贴近Web开发者习惯。文中还概述了两者的架构和基础能力,帮助开发者选择合适的范式进行高效开发。
163 15
|
4月前
|
编解码 前端开发 Java
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发三
本文介绍了基于声明式UI范式的图形绘制与动画效果实现方法,涵盖绘制图形、添加动画效果及常见组件说明三部分内容。在绘制图形部分,详细讲解了如何通过Circle组件为食物成分表添加圆形标签,以及使用Path组件结合SVG命令绘制自定义图形(如应用Logo)。动画效果部分则展示了如何利用animateTo实现闪屏动画,包括渐出、放大效果,并设置页面跳转;同时介绍了页面间共享元素转场动画的实现方式。最后,文章列举了声明式开发范式中的各类组件及其功能,帮助开发者快速上手构建复杂交互页面。
150 11
|
11天前
|
存储 开发者 容器
鸿蒙 HarmonyOS NEXT星河版APP应用开发-ArkTS面向对象及组件化UI开发使用实例
本文介绍了ArkTS语言中的Class类、泛型、接口、模块化、自定义组件及状态管理等核心概念,并结合代码示例讲解了对象属性、构造方法、继承、静态成员、访问修饰符等内容,同时涵盖了路由管理、生命周期和Stage模型等应用开发关键知识点。
122 0
鸿蒙 HarmonyOS NEXT星河版APP应用开发-ArkTS面向对象及组件化UI开发使用实例
|
3月前
|
JavaScript 前端开发 UED
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发四
本文介绍了Web组件开发与性能优化的相关内容。在Web组件开发部分,涵盖创建组件、设置样式与属性、添加事件和方法以及场景示例,如动态播放视频。性能提升方面,推荐使用数据懒加载、条件渲染替代显隐控制、Column/Row替代Flex、设置List组件宽高及调整cachedCount减少滑动白块等方法,以优化应用性能与用户体验。
175 56
|
3月前
|
编解码 UED 开发者
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发之常见布局
本文主要介绍了自适应布局与响应式布局的相关内容。自适应布局部分涵盖线性布局、层叠布局、弹性布局和网格布局,详细说明了各布局的特性及使用方法,例如线性布局中的排列、拉伸与缩放,弹性布局的方向、换行与对齐方式等。响应式布局则重点讲解了栅格系统和媒体查询,阐述如何通过栅格组件和媒体查询条件实现不同设备上的适配效果。这些技术帮助开发者灵活应对多尺寸屏幕的设计需求,提升用户体验。
206 55
|
7月前
|
前端开发 安全 开发工具
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
394 90
【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
|
4月前
|
存储 开发框架 API
【HarmonyOS Next之旅】基于ArkTS开发(二) -> UI开发二
本文详细介绍了基于声明式UI开发的健康饮食应用的设计与实现过程。内容涵盖从基础环境搭建到复杂功能实现的全流程,包括创建简单视图、构建布局(如Stack、Flex)、数据模型设计、列表与网格布局构建,以及页面跳转和数据传递等核心功能。 本文通过实际案例深入浅出地解析了声明式UI开发的关键技术和最佳实践,为开发者提供了宝贵的参考。
153 14
|
3月前
|
JavaScript 前端开发 开发者
09.HarmonyOS Next数据驱动UI开发:ForEach与动态渲染完全指南(上)
在现代前端开发中,数据驱动UI已成为主流开发范式。HarmonyOS Next的ArkTS语言和声明式UI框架完美支持这一理念,使开发者能够以更高效、更直观的方式构建复杂应用。
95 1
|
10月前
|
搜索推荐 Android开发 开发者
探索安卓开发中的自定义视图:打造个性化UI组件
【10月更文挑战第39天】在安卓开发的世界中,自定义视图是实现独特界面设计的关键。本文将引导你理解自定义视图的概念、创建流程,以及如何通过它们增强应用的用户体验。我们将从基础出发,逐步深入,最终让你能够自信地设计和实现专属的UI组件。
|
5月前
|
人工智能 物联网 编译器
【01】优雅草星云物联网AI智控系统从0开发鸿蒙端适配完成流程-初始化鸿蒙编译器deveco studio项目结构-UI设计图切片下载-优雅草卓伊凡
【01】优雅草星云物联网AI智控系统从0开发鸿蒙端适配完成流程-初始化鸿蒙编译器deveco studio项目结构-UI设计图切片下载-优雅草卓伊凡
168 11
【01】优雅草星云物联网AI智控系统从0开发鸿蒙端适配完成流程-初始化鸿蒙编译器deveco studio项目结构-UI设计图切片下载-优雅草卓伊凡

热门文章

最新文章