动态添加综合布局---动态添加控件及将某XML动态加入到Activity显示（续）

XML 前端之家
前端之家收集整理的这篇文章主要介绍了动态添加综合布局---动态添加控件及将某XML动态加入到Activity显示（续），前端之家小编觉得挺不错的，现在分享给大家，也给大家做个参考。

前言：以前曾写过一篇关于动态生成控件的文章《动态添加控件及将某XML动态加入到Activity显示》，比较浅显，对于RelativeLayout的相关布局设置方法及相对布局与线性布局的混合使用的相关内容都没有进行深入讨论。今天再次涉及到这些内容，就不再单独讨论相对布局的相关设置内容了，直接从相对布局与线性布局的混合应用开始。

相关文章：《动态添加控件及将某XML动态加入到Activity显示》

总效果：

这里动态生成十个相同的列表，这是最终效果，但凡事都是从易而难的，下面我们就从XML生成一项内容开始讲解。

一、利用XML生成一项列表

这里先利用XML生成一项列表开始，先看一项列表的效果图及对应代码：

对应的XML代码为：

[html] view plain copy
  1. <LinearLayoutxmlns:android="http://schemas.android.com/apk/res/android"
  2. xmlns:tools="http://schemas.android.com/tools"
  3. android:id="@+id/layout_root"
  4. android:layout_width="fill_parent"
  5. android:layout_height="fill_parent"
  6. android:orientation="vertical"
  7. tools:context=".MainActivity">
  9. <TextView
  10. android:layout_width="fill_parent"
  11. android:layout_height="wrap_content"
  12. android:background="#19000000"
  13. android:gravity="center_horizontal"
  14. android:paddingBottom="20dip"
  15. android:paddingTop="20dip"
  16. android:text="尝试动态生成列表"
  17. android:textColor="#ff0000"
  18. android:textSize="24sp"/>
  20. <ScrollView
  21. android:layout_width="fill_parent"
  22. android:layout_height="match_parent"
  23. android:scrollbars="vertical">
  25. <LinearLayout
  26. android:id="@+id/list_Lin"
  27. android:layout_width="fill_parent"
  28. android:layout_height="wrap_content"
  29. android:orientation="vertical">
  31. <!--动态生成部分开始-->
  32. <RelativeLayout
  33. android:layout_width="fill_parent"
  34. android:layout_height="wrap_content">
  36. <LinearLayout
  37. android:layout_width="match_parent"
  38. android:layout_height="wrap_content"
  39. android:layout_margin="5dip"
  40. android:layout_marginRight="10dip"
  41. android:layout_toLeftOf="@+id/image"
  42. android:background="#ff00ff00"
  43. android:orientation="horizontal"
  44. android:padding="5dip">
  46. <TextView
  47. android:layout_width="wrap_content"
  48. android:layout_height="wrap_content"
  49. android:text="我的第一次经历"
  50. android:textColor="#ff000000"
  51. android:textSize="20dip"/>
  52. </LinearLayout>
  54. <ImageView
  55. android:id="@+id/image"
  56. android:layout_width="wrap_content"
  57. android:layout_height="wrap_content"
  58. android:layout_alignParentRight="true"
  59. android:clickable="true"
  60. android:padding="5dip"
  61. android:src="@drawable/plus"/>
  62. </RelativeLayout>
  63. <!--动态生成部分结束-->
  65. </LinearLayout>
  66. </ScrollView>
  68. </LinearLayout>

动态生成注释里的部分就是我们将要用代码生成的部分，这里写出来是为了在写代码时参考，现在把注释里的部分删掉，开始在代码中生成。

二、使用XML和JAVA代码生成界面

先贴出完整的代码，然后再逐步讲解。

完整代码：

[java] view plain copy
  1. packagecom.example.trydynamiclayout;
  2. /**
  3. *writebyharvic
  4. *2014-4-25
  5. *http://blog.csdn.net/harvic880925
  6. */
  7. importandroid.os.Bundle;
  8. importandroid.app.Activity;
  9. importandroid.graphics.Color;
  10. importandroid.widget.ImageView;
  11. importandroid.widget.LinearLayout;
  12. importandroid.widget.RelativeLayout;
  13. importandroid.widget.TextView;
  15. publicclassMainActivityextendsActivity{
  17. privatestaticintid=100;
  19. @Override
  20. protectedvoidonCreate(BundlesavedInstanceState){
  21. super.onCreate(savedInstanceState);
  22. setContentView(R.layout.activity_main);
  24. finalLinearLayoutlin=(LinearLayout)findViewById(R.id.list_Lin);
  25. LinearLayout.LayoutParamsLP_FW=newLinearLayout.LayoutParams(
  26. LinearLayout.LayoutParams.FILL_PARENT,LinearLayout.LayoutParams.WRAP_CONTENT);
  27. RelativeLayoutnewSingleRL=newRelativeLayout(this);
  29. for(inti=0;i<10;)
  30. {
  31. newSingleRL=generateSingleLayout(id,"第"+(++i)+"个动态列表");
  32. lin.addView(newSingleRL,LP_FW);//全部用父结点的布局参数
  33. }
  36. //finalLinearLayoutroot=(LinearLayout)findViewById(R.id.layout_root);//获取总根结点
  37. //setContentView(root);//这里必须是总根结点
  38. }
  39. /**
  40. *新建一个列表item
  41. *@paramimageID新建imageView的ID值
  42. *@paramstrTextView要显示的文字
  43. *@return新建的单项布局变量
  44. */
  45. privateRelativeLayoutgenerateSingleLayout(intimageID,Stringstr)
  46. {
  47. RelativeLayoutlayout_root_relative=newRelativeLayout(this);
  49. LinearLayoutlayout_sub_Lin=newLinearLayout(this);
  50. layout_sub_Lin.setBackgroundColor(Color.argb(0xff,0x00,0xff,0x00));
  51. layout_sub_Lin.setOrientation(LinearLayout.VERTICAL);
  52. layout_sub_Lin.setPadding(5,5,5);
  54. TextViewtv=newTextView(this);
  55. LinearLayout.LayoutParamsLP_WW=newLinearLayout.LayoutParams(
  56. LinearLayout.LayoutParams.WRAP_CONTENT,LinearLayout.LayoutParams.WRAP_CONTENT);
  57. tv.setText(str);
  58. tv.setTextColor(Color.argb(0xff,0x00));
  59. tv.setTextSize(20);
  60. tv.setLayoutParams(LP_WW);
  61. layout_sub_Lin.addView(tv);
  63. RelativeLayout.LayoutParamsRL_MW=newRelativeLayout.LayoutParams(RelativeLayout.LayoutParams.MATCH_PARENT,
  64. RelativeLayout.LayoutParams.WRAP_CONTENT);//尤其注意这个位置，用的是父容器的布局参数
  65. RL_MW.setMargins(5,10,5);
  66. RL_MW.addRule(RelativeLayout.LEFT_OF,imageID);
  67. layout_root_relative.addView(layout_sub_Lin,RL_MW);
  70. ImageViewimageView=newImageView(this);
  71. RelativeLayout.LayoutParamsRL_WW=newRelativeLayout.LayoutParams(RelativeLayout.LayoutParams.WRAP_CONTENT,
  72. RelativeLayout.LayoutParams.WRAP_CONTENT);
  73. imageView.setPadding(5,5);
  74. RL_WW.addRule(RelativeLayout.ALIGN_PARENT_RIGHT);
  75. imageView.setLayoutParams(RL_WW);
  76. imageView.setClickable(true);
  77. imageView.setId(imageID);
  78. imageView.setImageResource(R.drawable.plus);
  79. layout_root_relative.addView(imageView);
  81. returnlayout_root_relative;
  83. }
  85. }

讲解：

一、先看generateSingleLayout(int imageID,String str)

1、看这段代码：

[java] view plain copy
  1. RelativeLayoutlayout_root_relative=newRelativeLayout(this);
  3. LinearLayoutlayout_sub_Lin=newLinearLayout(this);
  4. layout_sub_Lin.setBackgroundColor(Color.argb(0xff,RL_MW);

根据上面的XML可以，我们要首先生成一个RelativeLayout，这就是layout_root_relative。
注意一： （控件的布局参数选择方式）

然后生成其第一个字布局LinearLayout layout_sub_Lin；然后再生成layout_sub_Lin里唯一的一个控件，注意这里设置LayoutParams的方式，使用的是LinearLayout参数！！！！对于如何选择当前控件的布局layout_width、layout_height的参数的方法，主要是看其父布局！！！！如果其父布局是LinearLayout设置其LayoutParams参数时就要使用LinearLayout.LayoutParams，正如这里的TextView tv。而如果其父容器的相对布局呢，一样，换它父布局的来，使用RelativeLayout.LayoutParams RL_MW，如这里的LinearLayout layout_sub_Lin，所以即便layout_sub_Lin自己是布局控件也要按其父容器的布局方法写！！！！

注意二： layout_toLeftOf的代码书写方法

在XML中，对于此LinearLayout的相对布局，用到了android:layout_toLeftOf="@+id/image"，而在代码中是动态生成的控件，如何利用此规则呢。
首先给动态生成的ImageView设置一个ID值，此ID值在些Acitivity中必须是唯一的，不可冲突的，如果冲突，关于用到此ID值的任何代码都将是无效的！这也就是后面代码中会看到的imageView.setId(imageID);
然后利用addRule（）添加规则。

2、剩余代码就没什么好讲的了，就是生成一个imageView设置ID值及其它参数，然后添加到RelativeLayout中，并将layout_root_relative返回。

二、onCreate()函数

这段代码如下：

[java] view plain copy
  1. finalLinearLayoutlin=(LinearLayout)findViewById(R.id.list_Lin);
  2. LinearLayout.LayoutParamsLP_FW=newLinearLayout.LayoutParams(
  3. LinearLayout.LayoutParams.FILL_PARENT,LinearLayout.LayoutParams.WRAP_CONTENT);
  4. RelativeLayoutnewSingleRL=newRelativeLayout(this);
  6. for(inti=0;i<10;)
  7. {
  8. newSingleRL=generateSingleLayout(id,"第"+(++i)+"个动态列表");
  9. lin.addView(newSingleRL,LP_FW);//全部用父结点的布局参数
  10. }
  13. finalLinearLayoutroot=(LinearLayout)findViewById(R.id.layout_root);//获取总根结点
  14. setContentView(root);//这里必须是总根结点

1、先看For循环及其上部的代码：

[java] view plain copy
  1. finalLinearLayoutlin=(LinearLayout)findViewById(R.id.list_Lin);

找到当前新生成的ITEM项的插入位置。

[java] view plain copy
  1. LinearLayout.LayoutParamsLP_FW=newLinearLayout.LayoutParams(
  2. LinearLayout.LayoutParams.FILL_PARENT,LinearLayout.LayoutParams.WRAP_CONTENT);
[java] view plain copy
  1. newSingleRL=generateSingleLayout(id,"第"+(++i)+"个动态列表");
  2. lin.addView(newSingleRL,LP_FW);//全部用父结点的布局参数

这里是两块代码，先看第二块，先是新生成一项，注意这一项返回的结点是RelativeLayout layout_root_relative，然后将其插入到列表位置中去，注意要插入的布局是LinearLayout lin，也就是layout_root_relative的父结点是LinearLayout，所以这也就是在addView时为什么它对应的布局参数使用LinearLayout.LayoutParams的原因了！
2、setContentView(root);显示视图

这段代码如下：

[java] view plain copy
  1. finalLinearLayoutroot=(LinearLayout)findViewById(R.id.layout_root);//获取总根结点
  2. setContentView(root);//这里必须是总根结点

这里最注意的一点，setContentView（）所设置的视图结点是整个XML的根结点！！！！设置为其它结点会发生异常！！！很容易理解。

更正：

在原来的onCreate代码中，在代码的最后，加上了

[java] view plain copy
  1. finalLinearLayoutroot=(LinearLayout)findViewById(R.id.layout_root);//获取总根结点
  2. setContentView(root);//这里必须是总根结点
其实这样做是完全没有必要的，直接将这两句删除，效果是完全一样的。

原因在于，在其上面的代码中，我们通过

[java] view plain copy
  1. finalLinearLayoutlin=(LinearLayout)findViewById(R.id.list_Lin);
找到了要插入布局的结点位置，直接在其下面插入布局代码，界面会自动更新，根本不需要重新setContentView()

在博客中，我将这两句无关代码注释了起来，而源码中没有更改过来，请大家注意一下，由于当时刚接触这部分，对大家造成的误导，深表歉意……


（源码中有两句代码完全不必要加，请看博客“更正”部分）

源码下载地址：http://download.csdn.net/detail/harvic880925/7250631，不要分，仅供分享！

三、完全使用JAVA代码生成UI界面

这部分其实在上面的改动不大，只是完全使用代码构建整个界面，由于这种方法构建UI可维护性很差，所以不推荐使用。

其它代码不变，OnCreate()函数代码如下：

[java] view plain copy
  1. protectedvoidonCreate(BundlesavedInstanceState){
  2. super.onCreate(savedInstanceState);
  3. //setContentView(R.layout.activity_main);
  5. finalLinearLayoutlin=newLinearLayout(this);
  6. lin.setOrientation(LinearLayout.VERTICAL);
  7. LinearLayout.LayoutParamsLP_FW=newLinearLayout.LayoutParams(
  8. LinearLayout.LayoutParams.FILL_PARENT,LP_FW);//全部用父结点的布局参数
  9. }
  11. setContentView(lin);//这里必须是总根结点
  12. }
效果图：


该部分源码地址：http://download.csdn.net/detail/harvic880925/7692059

猜你在找的XML相关文章

10分钟掌握XML、JSON及其解析
引言 NOKIA 有句著名的广告语：“科技以人为本”。任何技术都是为了满足人的生产生活需要而...
[CXF REST标准实战系列] 一、JAXB xml与javaBean的转换
Writer：BYSocket（泥沙砖瓦浆木匠） 微博：BYSocket 豆瓣：BYSocket Reprint it anywhere...
[CXF REST标准实战系列] 一、JAXB xml与javaBean的转换
Writer：BYSocket（泥沙砖瓦浆木匠） 微博：BYSocket 豆瓣：BYSocket Reprint it anywhere...
10分钟掌握XML、JSON及其解析
http://blog.jobbole.com/79252/ 引言 NOKIA 有句著名的广告语：“科技以人为本”。任何技...
自定义圆形控件RoundImageView并认识一下attr.xml
(点击上方公众号，可快速关注) 公众号：smart_android 作者：耿广龙｜loonggg 点击“阅读原...
10分钟掌握XML、JSON及其解析
引言 NOKIA 有句著名的广告语：“科技以人为本”。任何技术都是为了满足人的生产生活需要而...
10分钟掌握XML、JSON及其解析(上)
 (点击上方公众号，可快速关注) 来源： Long Luo 的博客 链接：http://longluo.github.i...
10分钟掌握XML、JSON及其解析(中)
接上文 二、JSON XML很好很强大，但是最近有另外一个时代弄潮儿，这就是JSON。现在JSON的光...
10分钟掌握XML、JSON及其解析(下)
接上文 2.4 如何解析JSON？ Android JSON所有相关类，都在org.json包下。 包括JSONObject、...
10分钟掌握XML、JSON及其解析
原文出处：  Long Luo 的博客（@Long_Luo）   引言 NOKIA 有句著名的广告语：“科技以人...
HTMLHTML5JavaScriptCSSjQueryBootstrapAngularjsTypeScriptVueDojoJsonElectronNode.jsextjsExpress XMLES6AjaxFlashUnityReactFlexAnt DesignWeb前端微信小程序微信公众号
关闭广告单独headers封装代码提示错误整数正则非0开头跳页出页码antd table提示URL未注册公众号支付vue hash模式iSlider车牌键盘循环图片echarts 双折左右布局DllPlugin对象创建打字游戏圈选两栏云函数蒙版ES2020橱窗无缝滚动轮播色块碰撞组件销毁文档操作