目录(?)[-]

  1. UI开发
    1. 方式一通过XML文件
    2. 方式二通过代码
    3. 方式三XML代码

UI开发

先理清一些UI概念: view、widget、control:这三个名词其实没有什么区别,都是一个UI元素,例如一个button。Container(容器):包含其他view,例如grid可以认为是容器,它有cell,每个cell可以是一个view。Layout: 对容器们和view们的排版,可以包含其他layout。

Android提供常用的UI(例如文字框)以及适合移动设备的控制,基础类为android.view.View和android.view.ViewGroup。从名字中很容易看出,后者也是view,但是包含其他view,它是layout的基类,而layout本身也是一个container。

在Android中创建UI,可以通过代码,也可以通过XML文件,也可以两者相结合。我们以一个简单例子来看看这三种情况。

方式一:通过XML文件

这种方式在之前学习资源时已经涉及。我们的目标很简单,通过xml定义一个layout,这个layout里面有两个子layout,分别为nameContainer和addressContainer。nameContainer由两个view组成,采用水平排放的方式,而addressContainer也有两个view组成,采用垂直摆放的方式。如图所示,很简单。

<?xml version="1.0" encoding="utf-8"?>  
<!-- Root view : parentContainer -->  
<LinearLayout
 xmlns:android=http://schemas.android.com/apk/res/android
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical" > 
    
    <!-- name Container --> 
    <LinearLayout android:orientation="horizontal"  
        android:layout_width="match_parent" 
        android:layout_height="wrap_content"> 
        <TextView android:layout_width="wrap_content" 
            android:layout_height="wrap_content" 
            android:text="Name: "/> 
        <TextView android:layout_width="wrap_content" 
            android:layout_height="wrap_content" 
            android:text="Hello Android"/> 
    </LinearLayout>

<!-- address Container -->
    <LinearLayout android:orientation="vertical"  
        android:layout_width="match_parent" 
        android:layout_height="wrap_content"> 
        <TextView android:layout_width="match_parent" 
            android:layout_height="wrap_content" 
            android:text="Address: "/> 
        <TextView android:layout_width="match_parent"  
            android:layout_height="wrap_content" 
            android:text="Earth, Solar, Galaxy"/> 
    </LinearLayout> 
</LinearLayout>

这个xml的位于/res/layout目录下,名字为ui_basic.xml,我们在代码中通过setContentView(R.layout.ui_basic); 对其进行调用。

方式二:通过代码

//在这个小例子中,我们不能使用xml,而是完全对同代码来实现界面
public class UiBasicCodeTest extends Activity{  
    private LinearLayout nameContainer = null; 
    private LinearLayout addressContainer = null; 
    private LinearLayout parentContainer = null;  
      
    protected void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        createNameContainer();      //实现name Container,内含2个水平摆放的view
        createAddressContainer();  //实现address Container,内含2个垂直摆放的view 
        createParentContainer();     //实现parentContainer,内含nameAddress和addressContain
        setContentView(parentContainer);//通过setContentView来在activity中显示root view,root view对自己进行渲染,发现有两个child,这两个child对自己渲染,如果有children,再一步一步解析下去。
    } 
     
    //实现name Container 
    private void createNameContainer(){ 
        nameContainer = new LinearLayout(this); 
        //layout带有布局功能,例如设置横排/竖排,可以包含view,也可以包括其他layout,所以它同时也是一个容器。
        //在Android学习笔记系列中,我们使用FILL_PARENT,包括在xml中使用fill_parent,在API Level 8(Android 2.2)后,改为match_parent
        nameContainer.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT,LayoutParams.WRAP_CONTENT));
        nameContainer.setOrientation(LinearLayout.HORIZONTAL); 
        //设置内部的view,并放入容器或layout 
        TextView nameLb = new TextView(this); 
        nameLb.setText("Name: "); 
        TextView nameValue = new TextView(this); 
        nameValue.setText("Hello World");          
        nameContainer.addView(nameLb); 
        nameContainer.addView(nameValue); 
    }

//实现address Container,和name Container相似,不同是改为垂直摆放 
    private void createAddressContainer(){ 
        addressContainer = new LinearLayout(this); 
        addressContainer.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT,LayoutParams.WRAP_CONTENT));
        addressContainer.setOrientation(LinearLayout.VERTICAL); 
        
        TextView addressLb = new TextView(this); 
        addressLb.setText("Address: "); 
        TextView addressValue = new TextView(this); 
        addressValue.setText("Guangzhou, Guangdong , China");          
        addressContainer.addView(addressLb); 
        addressContainer.addView(addressValue); 
    } 
    
    //实现root view ,和前面两个container相似,不同是addView不是加入普通的view,而是加入layout
    private void createParentContainer(){ 
        parentContainer = new LinearLayout(this); 
        parentContainer.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT,LayoutParams.MATCH_PARENT));
        parentContainer.setOrientation(LinearLayout.VERTICAL); 
        parentContainer.addView(nameContainer); 
        parentContainer.addView(addressContainer);
    } 
}

方式三:XML+代码

实际上,我们真正编程时会采用XML+代码的方式,将UI的设计交给XML,而将涉及动态变化的的内容交给代码。在小例子中,很明显,三个layout的架构,渲染,排版是固定的,而部分的textview内容也是固定的,例如“Name : ”和“Address : ”,这些适合通过XML来设定,用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" >  
    <!-- name Container --> 
    <LinearLayout android:orientation="horizontal" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content"> 
        <TextView android:layout_width="wrap_content"
            android:layout_height="wrap_content" 
            android:text="@string/ui_basic_name"/> 
        <TextView android:layout_width="wrap_content"
            android:layout_height="wrap_content" 
            android:id="@+id/ui_name"/> 
    </LinearLayout>

<!-- address Container -->
    <LinearLayout android:orientation="vertical" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content"> 
        <TextView android:layout_width="match_parent"
            android:layout_height="wrap_content" 
            android:text="@string/ui_basic_address"/> 
        <TextView android:layout_width="match_parent"
            android:layout_height="wrap_content" 
            android:id="@+id/ui_address"/> 
    </LinearLayout> 
</LinearLayout>

对应的代码如下:

     protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState); 
        //我们要注意顺序,必须先setContentView(),才能通过findViewById()来获取view的对象,否则会出现NullPointerException的错误
        setContentView(R.layout.ui_basic_recommend);  
        TextView nameValue = (TextView)findViewById(R.id.ui_name);
        nameValue.setText("Data"); 
        TextView addressValue = (TextView)findViewById(R.id.ui_address);
        addressValue.setText("Spaceship Enterprise"); 
    }

相关链接: 我的Android开发相关文章

【转】Pro Android学习笔记(十三):用户界面和控制(1):UI开发的更多相关文章

  1. 【转】Pro Android学习笔记(二五):用户界面和控制(13):LinearLayout和TableLayout

    目录(?)[-] 布局Layout 线性布局LinearLayout 表格布局TableLayout 布局Layout Layout是容器,用于对所包含的view进行布局.layout是view的子类 ...

  2. 【转】 Pro Android学习笔记(二二):用户界面和控制(10):自定义Adapter

    目录(?)[-] 设计Adapter的布局 代码部分 Activity的代码 MyAdapter的代码数据源和构造函数 MyAdapter的代码实现自定义的adapter MyAdapter的代码继续 ...

  3. 【转】 Pro Android学习笔记(十九):用户界面和控制(7):ListView

    目录(?)[-] 点击List的item触发 添加其他控件以及获取item数据 ListView控件以垂直布局方式显示子view.系统的android.app.ListActivity已经实现了一个只 ...

  4. 【转】 Pro Android学习笔记(二九):用户界面和控制(17):include和merge

    目录(?)[-] xml控件代码重用include xml控件代码重用merge 横屏和竖屏landsacpe portrait xml控件代码重用:include 如果我们定义一个控件,需要在不同的 ...

  5. 【转】 Pro Android学习笔记(五二):ActionBar(5):list模式

    可以在action bar中加入spinner的下来菜单,有关spinner,可以参考Pro Android学习笔记(二十):用户界面和控制(8):GridView和Spinner. list的样式和 ...

  6. Pro Android学习笔记 ActionBar(1):Home图标区

     Pro Android学习笔记(四八):ActionBar(1):Home图标区 2013年03月10日 ⁄ 综合 ⁄ 共 3256字 ⁄ 字号 小 中 大 ⁄ 评论关闭 ActionBar在A ...

  7. 【转】 Pro Android学习笔记(八二):了解Package(1):包和进程

    文章转载只能用于非商业性质,且不能带有虚拟货币.积分.注册等附加条件.转载须注明出处:http://blog.csdn.net/flowingflying/ 在之前,我们已经学习了如何签发apk,见P ...

  8. 【转】 Pro Android学习笔记(六七):HTTP服务(1):HTTP GET

    目录(?)[-] HTTP GET小例子 简单小例子 出现异常NetworkOnMainThreadException 通过StrictMode进行处理 URL带键值对 Andriod应用可利用ser ...

  9. 【转】 Pro Android学习笔记(五五):调试和分析(3):adb命令、模拟器控制台和StrictMode

    目录(?)[-] adb命令 模拟器Console StrictMode adb命令 我们在学习SQLite的使用,介绍过部分adb命令的使用,见Pro Android学习笔记(五):了解Conten ...

  10. 【转】 Pro Android学习笔记(五六):配置变化

    目录(?)[-] Activity的destorycreate过程 Fragment的destorycreate过程 onSaveInstanceState saveFragmentInstanceS ...

随机推荐

  1. Android环境搭建 NDK+ADT(免cywgin)

    JDK下载: 1下载地址  http://www.oracle.com/technetwork/java/javase/downloads/index.html 2配置环境变量 JAVA_HOME:创 ...

  2. windows下php升级到7.2

    1: 官网下载:https://windows.php.net/download#php-7.2

  3. flex 坐标系

    全局坐标(舞台坐标)  本地坐标 内容坐标系  地图坐标(MapPoint) flash和flex针对不同的目的,提供了3种不同的坐标系 全局的就是(stage级别的) 本地坐标系(组件级别的) 内容 ...

  4. 20165101 预备作业3 Linux安装及学习

    #Linux安装及命令入门 安装虚拟机 学习了娄老师的博客<基于VirtualBox虚拟机安装Ubuntu图文教程>,我下载了最新版的VirtualBox和16.04版的Ubuntu.根据 ...

  5. django配置文件环境分离后celery的启动方式整理

    django项目中,当配置文件分离时: 启动方式1: 硬编码写死在manage.py中: os.environ.setdefault("DJANGO_SETTINGS_MODULE" ...

  6. android电池(五):电池 充电IC(PM2301)驱动分析篇【转】

    本文转载自:http://blog.csdn.net/xubin341719/article/details/8970363 android充电这块,有的电源管理芯片内部包含充电管理,如s5pv210 ...

  7. PyVim

    PyVim主要用于连接到 Service Instance import atexit from pyVim import connect // Connect to Server If args.d ...

  8. 同步异步阻塞非阻塞Reactor模式和Proactor模式 (目前JAVA的NIO就属于同步非阻塞IO)

    在高性能的I/O设计中,有两个比较著名的模式Reactor和Proactor模式,其中Reactor模式用于同步I/O,而Proactor运用于异步I/O操作. 在比较这两个模式之前,我们首先的搞明白 ...

  9. Spring与web.xml

    出处:http://blog.csdn.net/u010796790 在web.xml配置监听器 ContextLoaderListener (listener-class) ContextLoade ...

  10. 大话设计模式--装饰者模式 Decorator -- C++实现实例

    1.装饰者模式 Decorator 动态地给一个对象添加一个额外的职责, 就添加功能来说, 装饰模式比生成子类更为灵活. 每个装饰对象的实现和如何使用这个对象分离,  每个装饰对象只关心自己的功能,不 ...